create-stackflow 1.0.7 → 1.0.9

package/README.md

@@ -230,9 +230,17 @@ npx create-stackflow
 
 ## Start Project
 
+### Start Backend
+
 ```bash
-cd my-app
+cd my-app/backend
+npm run dev
+```
+
+### Start Frontend
 
+```bash
+cd my-app/frontend
 npm run dev
 ```
 
@@ -248,22 +256,6 @@ MONGO_URI=mongodb://127.0.0.1:27017/myapp
 
 ---
 
-# Root Development Scripts
-
-StackFlow automatically configures:
-
-```bash
-npm run dev
-```
-
-This starts:
-- frontend
-- backend
-
-simultaneously using `concurrently`.
-
----
-
 # CLI Architecture
 
 ```text

package/cli.js

@@ -8,7 +8,7 @@ const program = new Command();
 program
   .name("create-stackflow")
   .description("Generate a production-minded MERN starter with frontend, backend, auth, CRUD, and dashboard UI.")
-  .version("1.0.7")
+  .version("1.0.9")
   .argument("[project-name]", "project folder name")
   .option("--skip-install", "generate files without installing dependencies")
   .option("--yes", "use recommended defaults")

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-stackflow",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "Interactive CLI for generating modern full-stack MERN applications.",
   "type": "module",
   "bin": {

package/src/commands/create.js

@@ -5,6 +5,7 @@ import fs from "fs-extra";
 import ora from "ora";
 import validatePackageName from "validate-npm-package-name";
 import { execa } from "execa";
+import concurrently from "concurrently";
 import { askQuestions } from "../utils/prompts.js";
 import { createRootFiles } from "../generators/root.js";
 import { createBackend } from "../generators/backend.js";
@@ -47,9 +48,9 @@ export async function createStackFlow(options) {
 
   await fs.ensureDir(projectDir);
 
-  await step("Creating root workspace", () => createRootFiles(context));
   await createFrontend(context);
   await createBackend(context);
+  await step("Writing project gitignore files", () => createRootFiles(context));
 
   if (!context.skipInstall) {
     await step("Installing dependencies (root node_modules)", () =>
@@ -62,7 +63,16 @@ export async function createStackFlow(options) {
   if (context.runProject) {
     console.log(chalk.cyan("\n🚀 Starting the project..."));
     try {
-      await execa("npm", ["run", "dev"], { cwd: context.frontendDir, stdio: "inherit" });
+      const { result } = concurrently(
+        [
+          { command: "npm run dev", name: "backend", cwd: context.backendDir, prefixColor: "blue" },
+          { command: "npm run dev", name: "frontend", cwd: context.frontendDir, prefixColor: "green" },
+        ],
+        {
+          killOthers: ["failure", "success"],
+        }
+      );
+      await result;
     } catch (error) {
       console.error(chalk.red("\nFailed to start the project."));
       console.error(chalk.dim(error.message));
@@ -164,8 +174,12 @@ function printSuccess(context) {
   console.log(chalk.green.bold("StackFlow app created successfully."));
   console.log();
   console.log(chalk.white("Next steps:"));
-  console.log(chalk.cyan(`  cd ${context.projectName}/${frontend}`));
-  console.log(chalk.cyan("  npm run dev"));
+  console.log(chalk.white("  Start Backend:"));
+  console.log(chalk.cyan(`    cd ${context.projectName}/${backend}`));
+  console.log(chalk.cyan("    npm run dev"));
+  console.log(chalk.white("  Start Frontend:"));
+  console.log(chalk.cyan(`    cd ${context.projectName}/${frontend}`));
+  console.log(chalk.cyan("    npm run dev"));
   console.log();
   console.log(chalk.dim(`Frontend: ${frontend}`));
   console.log(chalk.dim(`Backend:  ${backend}`));

package/src/generators/frontend.js

@@ -27,14 +27,25 @@ async function scaffoldOfficialFrontend(context) {
         "--import-alias",
         "@/*"
       ];
-      await execa("npx", args, { cwd: context.projectDir, stdio: "ignore" });
+      await execa("npx", args, { cwd: context.projectDir, stdio: "inherit" });
     } else {
       const template = context.language === "typescript" ? "react-ts" : "react";
-      await execa("npm", ["create", "vite@latest", path.basename(context.frontendDir), "--", "--template", template], {
-        cwd: context.projectDir,
-        stdio: "ignore"
-      });
+      const frontendName = path.basename(context.frontendDir);
+      if (await fs.pathExists(context.frontendDir)) {
+        const existing = await fs.readdir(context.frontendDir);
+        if (existing.length > 0) {
+          throw new Error(
+            `Frontend folder "${frontendName}" already exists and is not empty. Remove it or choose another frontend folder name.`,
+          );
+        }
+      }
+      await execa(
+        "npm",
+        ["create", "vite@latest", frontendName, "--", "--template", template, "--no-interactive"],
+        { cwd: context.projectDir, stdio: "inherit" },
+      );
     }
+    await assertFrontendScaffolded(context);
     spinner.succeed("Creating frontend with official generator");
   } catch (error) {
     spinner.fail("Creating frontend with official generator");
@@ -42,6 +53,16 @@ async function scaffoldOfficialFrontend(context) {
   }
 }
 
+async function assertFrontendScaffolded(context) {
+  const packageFile = path.join(context.frontendDir, "package.json");
+  if (!(await fs.pathExists(packageFile))) {
+    throw new Error(
+      `Frontend scaffold did not create package.json at ${packageFile}. ` +
+        "The official generator may have been cancelled or failed. Try again in an empty project folder.",
+    );
+  }
+}
+
 async function installFrontendDependencies(context) {
   await updateFrontendPackage(context);
 }
@@ -73,20 +94,16 @@ async function updateFrontendPackage(context) {
     pkg.devDependencies["@tailwindcss/vite"] = "latest";
   }
 
-  const backendName = path.basename(context.backendDir);
-  pkg.devDependencies = pkg.devDependencies || {};
-  pkg.devDependencies.concurrently = "latest";
-
   if (context.frontend === "react") {
     pkg.scripts = {
       ...(pkg.scripts || {}),
       build: "vite build",
-      dev: `concurrently -n backend,frontend -c blue,green "npm run dev --prefix ../${backendName}" "vite"`,
+      dev: "vite",
     };
   } else {
     pkg.scripts = {
       ...(pkg.scripts || {}),
-      dev: `concurrently -n backend,frontend -c blue,green "npm run dev --prefix ../${backendName}" "next dev"`,
+      dev: "next dev",
     };
   }