create-bcp-app 0.1.2 → 0.1.4

package/README.md

@@ -8,16 +8,76 @@ cd my-app
 npm run dev
 ```
 
+When running interactively, the generator asks:
+
+```text
+Use Tailwind CSS? (Y/n)
+Select a database:
+  1) None
+  2) MySQL
+  3) PostgreSQL
+  4) SQLite
+  5) MongoDB
+```
+
+## Generated optional setup
+
+### Tailwind CSS
+
+When Tailwind is enabled, the project includes:
+
+- `tailwindcss`
+- `@tailwindcss/cli`
+- `concurrently`
+- `app/globals.css`
+- `app/api/bcp-styles/route.ts`
+- a stylesheet link in `app/layout.tsx`
+- starter Tailwind utility classes in `app/page.tsx`
+
+The generated npm scripts compile Tailwind before starting BCP and keep Tailwind running in watch mode during development:
+
+```text
+npm run css:build
+npm run css:watch
+npm run css:build:prod
+```
+
+`npm run dev` performs an initial CSS build, then runs the Tailwind watcher and `bcp dev` together. `npm run build` creates a minified stylesheet before the BCP production build.
+
+### Database
+
+The database choice adds a starter `lib/database.ts`, updates `.env.example`, and installs the matching driver:
+
+- MySQL: `mysql2`
+- PostgreSQL: `pg`
+- SQLite: `better-sqlite3`
+- MongoDB: `mongodb`
+- None: no database dependency
+
+The generator intentionally installs database drivers directly and does not force an ORM.
+
 ## Options
 
 ```text
---no-install       Create files without running npm install
---bcp <specifier>  Override dependencies.bcp
--h, --help         Show help
+--no-install              Create files without running npm install
+--tailwind                Enable Tailwind CSS without prompting
+--no-tailwind             Disable Tailwind CSS without prompting
+--database <database>     none | mysql | postgresql | sqlite | mongodb
+-y, --yes                 Accept defaults (Tailwind enabled, no database)
+--bcp <specifier>         Override dependencies.bcp
+-h, --help                Show help
+```
+
+Examples:
+
+```bash
+npx create-bcp-app my-app --tailwind --database mysql
+npx create-bcp-app my-app --no-tailwind --database mongodb
+npx create-bcp-app my-app --yes
 ```
 
 The `--bcp` option is primarily useful for prerelease and local package testing, for example:
 
 ```bash
-npx create-bcp-app my-app --bcp file:../bcp-0.1.0.tgz
+npx create-bcp-app my-app --bcp file:../bcp-0.1.4.tgz
 ```

package/bin/create-bcp-app.mjs

@@ -1,10 +1,22 @@
 #!/usr/bin/env node
 
 import path from "node:path";
+import {
+    createInterface,
+} from "node:readline/promises";
+
+import {
+    stdin as input,
+    stdout as output,
+} from "node:process";
 
 import {
     createBcpApp,
 } from "../src/index.mjs";
+import {
+    DATABASE_CHOICES,
+    normalizeDatabase,
+} from "../src/project-options.mjs";
 
 const args =
     process.argv.slice(2);
@@ -23,6 +35,12 @@ let install =
     true;
 let bcpPackage =
     undefined;
+let tailwind =
+    undefined;
+let database =
+    undefined;
+let acceptDefaults =
+    false;
 
 for (
     let index = 0;
@@ -40,6 +58,53 @@ for (
         continue;
     }
 
+    if (
+        value === "--yes" ||
+        value === "-y"
+    ) {
+        acceptDefaults =
+            true;
+        continue;
+    }
+
+    if (
+        value === "--tailwind"
+    ) {
+        tailwind =
+            true;
+        continue;
+    }
+
+    if (
+        value === "--no-tailwind"
+    ) {
+        tailwind =
+            false;
+        continue;
+    }
+
+    if (
+        value === "--database"
+    ) {
+        const nextValue =
+            args[
+                index + 1
+            ];
+
+        if (!nextValue) {
+            fail(
+                "--database requires a value."
+            );
+        }
+
+        database =
+            normalizeDatabase(
+                nextValue
+            );
+        index++;
+        continue;
+    }
+
     if (
         value === "--bcp"
     ) {
@@ -87,11 +152,22 @@ if (!projectDirectory) {
         1;
 } else {
     try {
+        const selected =
+            await resolveInteractiveOptions({
+                tailwind,
+                database,
+                acceptDefaults,
+            });
+
         const result =
             await createBcpApp({
                 projectDirectory,
                 install,
                 bcpPackage,
+                tailwind:
+                    selected.tailwind,
+                database:
+                    selected.database,
                 packageManager:
                     "npm",
             });
@@ -109,6 +185,12 @@ if (!projectDirectory) {
         console.log(
             `Location: ${result.targetDirectory}`
         );
+        console.log(
+            `Tailwind CSS: ${result.tailwind ? "Yes" : "No"}`
+        );
+        console.log(
+            `Database: ${formatDatabaseName(result.database)}`
+        );
         console.log("");
         console.log(
             "Next steps:"
@@ -136,6 +218,230 @@ if (!projectDirectory) {
     }
 }
 
+async function resolveInteractiveOptions({
+    tailwind: selectedTailwind,
+    database: selectedDatabase,
+    acceptDefaults: useDefaults,
+}) {
+    let resolvedTailwind =
+        selectedTailwind;
+    let resolvedDatabase =
+        selectedDatabase;
+
+    const interactive =
+        Boolean(
+            input.isTTY &&
+            output.isTTY
+        );
+
+    if (useDefaults) {
+        return {
+            tailwind:
+                resolvedTailwind ??
+                true,
+            database:
+                normalizeDatabase(
+                    resolvedDatabase ??
+                    "none"
+                ),
+        };
+    }
+
+    if (!interactive) {
+        return {
+            tailwind:
+                resolvedTailwind ??
+                false,
+            database:
+                normalizeDatabase(
+                    resolvedDatabase ??
+                    "none"
+                ),
+        };
+    }
+
+    const prompt =
+        createInterface({
+            input,
+            output,
+        });
+
+    try {
+        console.log("");
+        console.log(
+            "Configure your BCP app"
+        );
+        console.log("");
+
+        if (
+            resolvedTailwind ===
+            undefined
+        ) {
+            resolvedTailwind =
+                await askYesNo(
+                    prompt,
+                    "Use Tailwind CSS?",
+                    true
+                );
+        }
+
+        if (
+            resolvedDatabase ===
+            undefined
+        ) {
+            resolvedDatabase =
+                await askDatabase(
+                    prompt
+                );
+        }
+    } finally {
+        prompt.close();
+    }
+
+    return {
+        tailwind:
+            Boolean(
+                resolvedTailwind
+            ),
+        database:
+            normalizeDatabase(
+                resolvedDatabase
+            ),
+    };
+}
+
+async function askYesNo(
+    prompt,
+    label,
+    defaultValue
+) {
+    const suffix =
+        defaultValue
+            ? " (Y/n) "
+            : " (y/N) ";
+
+    while (true) {
+        const answer =
+            (
+                await prompt.question(
+                    `${label}${suffix}`
+                )
+            )
+                .trim()
+                .toLowerCase();
+
+        if (!answer) {
+            return defaultValue;
+        }
+
+        if (
+            answer === "y" ||
+            answer === "yes"
+        ) {
+            return true;
+        }
+
+        if (
+            answer === "n" ||
+            answer === "no"
+        ) {
+            return false;
+        }
+
+        console.log(
+            "Please answer yes or no."
+        );
+    }
+}
+
+async function askDatabase(
+    prompt
+) {
+    const labels = {
+        none: "None",
+        mysql: "MySQL",
+        postgresql: "PostgreSQL",
+        sqlite: "SQLite",
+        mongodb: "MongoDB",
+    };
+
+    console.log(
+        "Select a database:"
+    );
+
+    DATABASE_CHOICES.forEach(
+        (
+            value,
+            index
+        ) => {
+            console.log(
+                `  ${index + 1}) ${labels[value]}`
+            );
+        }
+    );
+
+    while (true) {
+        const answer =
+            (
+                await prompt.question(
+                    "Database (1): "
+                )
+            ).trim();
+
+        if (!answer) {
+            return "none";
+        }
+
+        const index =
+            Number(
+                answer
+            ) - 1;
+
+        if (
+            Number.isInteger(
+                index
+            ) &&
+            index >= 0 &&
+            index <
+                DATABASE_CHOICES.length
+        ) {
+            return DATABASE_CHOICES[
+                index
+            ];
+        }
+
+        const normalized =
+            answer.toLowerCase();
+
+        if (
+            DATABASE_CHOICES.includes(
+                normalized
+            )
+        ) {
+            return normalized;
+        }
+
+        console.log(
+            "Choose a number from the list or enter a database name."
+        );
+    }
+}
+
+function formatDatabaseName(
+    value
+) {
+    const names = {
+        none: "None",
+        mysql: "MySQL",
+        postgresql: "PostgreSQL",
+        sqlite: "SQLite",
+        mongodb: "MongoDB",
+    };
+
+    return names[value] ??
+        value;
+}
+
 function printHelp() {
     console.log(`
 create-bcp-app
@@ -143,15 +449,26 @@ create-bcp-app
 Usage:
   npx create-bcp-app <project-name> [options]
 
+Interactive setup:
+  - Choose whether to use Tailwind CSS
+  - Choose a database: None, MySQL, PostgreSQL, SQLite or MongoDB
+
 Options:
-  --no-install       Create files without running npm install
-  --bcp <specifier>  Override the package specifier stored under dependencies.bcp
-  -h, --help         Show this help message
+  --no-install              Create files without running npm install
+  --tailwind                Enable Tailwind CSS without prompting
+  --no-tailwind             Disable Tailwind CSS without prompting
+  --database <database>     none | mysql | postgresql | sqlite | mongodb
+  -y, --yes                 Accept defaults (Tailwind enabled, no database)
+  --bcp <specifier>         Override the package specifier stored under dependencies.bcp
+  -h, --help                Show this help message
 
 Examples:
   npx create-bcp-app my-app
+  npx create-bcp-app my-app --tailwind --database mysql
+  npx create-bcp-app my-app --no-tailwind --database mongodb
+  npx create-bcp-app my-app --yes
   npx create-bcp-app my-app --no-install
-  npx create-bcp-app my-app --bcp file:../bcp-0.1.0.tgz
+  npx create-bcp-app my-app --bcp file:../bcp-0.1.2.tgz
 `);
 }
 

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "create-bcp-app",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Create a new BCP Framework application.",
   "type": "module",
   "license": "MIT",
+  "bcpFrameworkPackage": "@chidchanun/bcp",
   "bin": {
     "create-bcp-app": "bin/create-bcp-app.mjs"
   },
@@ -24,6 +25,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "bcpFrameworkPackage": "@chidchanun/bcp"
+  }
 }

package/src/index.d.mts

@@ -0,0 +1,31 @@
+export type BcpDatabase =
+    | "none"
+    | "mysql"
+    | "postgresql"
+    | "sqlite"
+    | "mongodb";
+
+export interface CreateBcpAppOptions {
+    projectDirectory: string;
+    install?: boolean;
+    bcpPackage?: string;
+    tailwind?: boolean;
+    database?: BcpDatabase;
+    packageManager?: "npm";
+}
+
+export interface CreateBcpAppResult {
+    targetDirectory: string;
+    projectName: string;
+    packageSpecifier: string;
+    tailwind: boolean;
+    database: BcpDatabase;
+}
+
+export function createBcpApp(
+    options: CreateBcpAppOptions
+): Promise<CreateBcpAppResult>;
+
+export function validateProjectName(
+    value: unknown
+): string;

package/src/index.mjs

@@ -7,6 +7,11 @@ import {
     fileURLToPath,
 } from "node:url";
 
+import {
+    applyProjectOptions,
+    normalizeDatabase,
+} from "./project-options.mjs";
+
 const packageRoot =
     path.resolve(
         path.dirname(
@@ -31,6 +36,12 @@ export async function createBcpApp(
                 targetDirectory
             )
         );
+    const tailwind =
+        options.tailwind === true;
+    const database =
+        normalizeDatabase(
+            options.database
+        );
 
     ensureTargetDirectory(
         targetDirectory
@@ -102,6 +113,14 @@ export async function createBcpApp(
         },
     };
 
+    const selectedOptions =
+        applyProjectOptions({
+            targetDirectory,
+            packageJson,
+            tailwind,
+            database,
+        });
+
     fs.writeFileSync(
         path.join(
             targetDirectory,
@@ -129,6 +148,10 @@ export async function createBcpApp(
         targetDirectory,
         projectName,
         packageSpecifier,
+        tailwind:
+            selectedOptions.tailwind,
+        database:
+            selectedOptions.database,
     };
 }
 

package/src/project-options.mjs

@@ -0,0 +1,508 @@
+import fs from "node:fs";
+import path from "node:path";
+
+export const DATABASE_CHOICES = [
+    "none",
+    "mysql",
+    "postgresql",
+    "sqlite",
+    "mongodb",
+];
+
+const DATABASE_PRESETS = {
+    mysql: {
+        dependencies: {
+            mysql2: "^3.24.2",
+        },
+        devDependencies: {},
+        env: [
+            "DATABASE_URL=mysql://root:password@localhost:3306/bcp_app",
+        ],
+        source: `import mysql from "mysql2/promise";
+
+const connectionString =
+    process.env.DATABASE_URL;
+
+if (!connectionString) {
+    throw new Error(
+        "DATABASE_URL is required for MySQL."
+    );
+}
+
+export const db =
+    mysql.createPool(
+        connectionString
+    );
+`,
+    },
+    postgresql: {
+        dependencies: {
+            pg: "^8.23.0",
+        },
+        devDependencies: {
+            "@types/pg": "^8.23.1",
+        },
+        env: [
+            "DATABASE_URL=postgresql://postgres:password@localhost:5432/bcp_app",
+        ],
+        source: `import {
+    Pool,
+} from "pg";
+
+const connectionString =
+    process.env.DATABASE_URL;
+
+if (!connectionString) {
+    throw new Error(
+        "DATABASE_URL is required for PostgreSQL."
+    );
+}
+
+export const db =
+    new Pool({
+        connectionString,
+    });
+`,
+    },
+    sqlite: {
+        dependencies: {
+            "better-sqlite3": "^13.0.3",
+        },
+        devDependencies: {
+            "@types/better-sqlite3": "^9.6.0",
+        },
+        env: [
+            "DATABASE_URL=./data/bcp.sqlite",
+        ],
+        source: `import fs from "node:fs";
+import path from "node:path";
+
+import Database from "better-sqlite3";
+
+const databaseFile =
+    process.env.DATABASE_URL ??
+    "./data/bcp.sqlite";
+const resolvedFile =
+    path.resolve(
+        databaseFile
+    );
+
+fs.mkdirSync(
+    path.dirname(
+        resolvedFile
+    ),
+    {
+        recursive: true,
+    }
+);
+
+export const db =
+    new Database(
+        resolvedFile
+    );
+`,
+    },
+    mongodb: {
+        dependencies: {
+            mongodb: "^7.6.0",
+        },
+        devDependencies: {},
+        env: [
+            "DATABASE_URL=mongodb://localhost:27017",
+            "DATABASE_NAME=bcp_app",
+        ],
+        source: `import {
+    MongoClient,
+} from "mongodb";
+
+const connectionString =
+    process.env.DATABASE_URL;
+
+if (!connectionString) {
+    throw new Error(
+        "DATABASE_URL is required for MongoDB."
+    );
+}
+
+export const mongoClient =
+    new MongoClient(
+        connectionString
+    );
+
+export async function getDatabase() {
+    await mongoClient.connect();
+
+    return mongoClient.db(
+        process.env.DATABASE_NAME ??
+        "bcp_app"
+    );
+}
+`,
+    },
+};
+
+export function normalizeDatabase(
+    value
+) {
+    const normalized =
+        String(
+            value ?? "none"
+        )
+            .trim()
+            .toLowerCase();
+
+    if (
+        !DATABASE_CHOICES.includes(
+            normalized
+        )
+    ) {
+        throw new Error(
+            `Unsupported database: ${normalized}. Choose one of: ${DATABASE_CHOICES.join(", ")}.`
+        );
+    }
+
+    return normalized;
+}
+
+export function applyProjectOptions({
+    targetDirectory,
+    packageJson,
+    tailwind = false,
+    database = "none",
+}) {
+    const selectedDatabase =
+        normalizeDatabase(
+            database
+        );
+
+    if (tailwind) {
+        configureTailwind(
+            targetDirectory,
+            packageJson
+        );
+    }
+
+    if (
+        selectedDatabase !== "none"
+    ) {
+        const preset =
+            DATABASE_PRESETS[
+                selectedDatabase
+            ];
+
+        packageJson.dependencies = {
+            ...packageJson.dependencies,
+            ...preset.dependencies,
+        };
+        packageJson.devDependencies = {
+            ...packageJson.devDependencies,
+            ...preset.devDependencies,
+        };
+
+        writeFile(
+            targetDirectory,
+            "lib/database.ts",
+            preset.source
+        );
+        appendEnvExample(
+            targetDirectory,
+            preset.env
+        );
+    }
+
+    return {
+        tailwind:
+            Boolean(
+                tailwind
+            ),
+        database:
+            selectedDatabase,
+    };
+}
+
+function configureTailwind(
+    targetDirectory,
+    packageJson
+) {
+    packageJson.devDependencies = {
+        ...packageJson.devDependencies,
+        tailwindcss:
+            "^4.3.3",
+        "@tailwindcss/cli":
+            "^4.3.3",
+        concurrently:
+            "^10.0.5",
+    };
+
+    packageJson.scripts = {
+        ...packageJson.scripts,
+        dev:
+            "npm run css:build && concurrently -k -n tailwind,bcp \"npm run css:watch\" \"bcp dev\"",
+        build:
+            "npm run css:build:prod && bcp build",
+        "css:build":
+            "tailwindcss -i ./app/globals.css -o ./public/bcp.css",
+        "css:watch":
+            "tailwindcss -i ./app/globals.css -o ./public/bcp.css --watch",
+        "css:build:prod":
+            "tailwindcss -i ./app/globals.css -o ./public/bcp.css --minify",
+    };
+
+    writeFile(
+        targetDirectory,
+        "app/globals.css",
+        `@import "tailwindcss" source("../");
+
+@theme {
+    --font-sans: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+`
+    );
+
+    writeFile(
+        targetDirectory,
+        "app/api/bcp-styles/route.ts",
+        `import fs from "node:fs/promises";
+import path from "node:path";
+
+export async function GET() {
+    const stylesheet =
+        path.join(
+            process.cwd(),
+            "public",
+            "bcp.css"
+        );
+
+    try {
+        const css =
+            await fs.readFile(
+                stylesheet,
+                "utf8"
+            );
+
+        return new Response(
+            css,
+            {
+                headers: {
+                    "Content-Type":
+                        "text/css; charset=utf-8",
+                    "Cache-Control":
+                        "no-store, max-age=0",
+                },
+            }
+        );
+    } catch {
+        return new Response(
+            "/* BCP Tailwind stylesheet has not been built yet. */",
+            {
+                status: 503,
+                headers: {
+                    "Content-Type":
+                        "text/css; charset=utf-8",
+                    "Cache-Control":
+                        "no-store, max-age=0",
+                },
+            }
+        );
+    }
+}
+`
+    );
+
+    fs.mkdirSync(
+        path.join(
+            targetDirectory,
+            "public"
+        ),
+        {
+            recursive: true,
+        }
+    );
+
+    injectTailwindStylesheet(
+        targetDirectory
+    );
+    applyTailwindStarterStyles(
+        targetDirectory
+    );
+    appendGitIgnore(
+        targetDirectory,
+        "public/bcp.css"
+    );
+}
+
+function injectTailwindStylesheet(
+    targetDirectory
+) {
+    const layoutFile =
+        path.join(
+            targetDirectory,
+            "app",
+            "layout.tsx"
+        );
+    const source =
+        fs.readFileSync(
+            layoutFile,
+            "utf8"
+        );
+    const rootPattern =
+        /^([ \t]*)<div>[ \t]*(\r?\n)/m;
+    const match =
+        rootPattern.exec(
+            source
+        );
+
+    if (!match) {
+        throw new Error(
+            "BCP create-app could not attach the Tailwind stylesheet to app/layout.tsx."
+        );
+    }
+
+    const indent =
+        match[1];
+    const newline =
+        match[2];
+    const childIndent =
+        `${indent}    `;
+    const propertyIndent =
+        `${childIndent}    `;
+    const replacement =
+        `${indent}<div>${newline}` +
+        `${childIndent}<link${newline}` +
+        `${propertyIndent}rel="stylesheet"${newline}` +
+        `${propertyIndent}href="/api/bcp-styles"${newline}` +
+        `${childIndent}/>${newline}`;
+
+    fs.writeFileSync(
+        layoutFile,
+        source.replace(
+            rootPattern,
+            replacement
+        ),
+        "utf8"
+    );
+}
+
+function applyTailwindStarterStyles(
+    targetDirectory
+) {
+    const pageFile =
+        path.join(
+            targetDirectory,
+            "app",
+            "page.tsx"
+        );
+    let source =
+        fs.readFileSync(
+            pageFile,
+            "utf8"
+        );
+
+    source =
+        source.replace(
+            "        <section>",
+            "        <section className=\"mx-auto max-w-3xl space-y-6 px-6 py-16\">"
+        );
+    source =
+        source.replace(
+            "            <h1>",
+            "            <h1 className=\"text-4xl font-bold tracking-tight text-slate-900\">"
+        );
+    source =
+        source.replace(
+            "            <p>",
+            "            <p className=\"text-lg text-slate-600\">"
+        );
+
+    fs.writeFileSync(
+        pageFile,
+        source,
+        "utf8"
+    );
+}
+
+function appendGitIgnore(
+    targetDirectory,
+    entry
+) {
+    const filePath =
+        path.join(
+            targetDirectory,
+            ".gitignore"
+        );
+    const current =
+        fs.existsSync(
+            filePath
+        )
+            ? fs.readFileSync(
+                filePath,
+                "utf8"
+            ).trimEnd()
+            : "";
+    const lines =
+        new Set(
+            current
+                .split(/\r?\n/)
+                .filter(Boolean)
+        );
+
+    lines.add(entry);
+
+    fs.writeFileSync(
+        filePath,
+        `${Array.from(lines).join("\n")}\n`,
+        "utf8"
+    );
+}
+
+function appendEnvExample(
+    targetDirectory,
+    lines
+) {
+    const filePath =
+        path.join(
+            targetDirectory,
+            ".env.example"
+        );
+    const current =
+        fs.existsSync(
+            filePath
+        )
+            ? fs.readFileSync(
+                filePath,
+                "utf8"
+            ).trimEnd()
+            : "";
+
+    fs.writeFileSync(
+        filePath,
+        `${current}${current ? "\n\n" : ""}# Database\n${lines.join("\n")}\n`,
+        "utf8"
+    );
+}
+
+function writeFile(
+    targetDirectory,
+    relativePath,
+    content
+) {
+    const filePath =
+        path.join(
+            targetDirectory,
+            relativePath
+        );
+
+    fs.mkdirSync(
+        path.dirname(
+            filePath
+        ),
+        {
+            recursive: true,
+        }
+    );
+    fs.writeFileSync(
+        filePath,
+        content,
+        "utf8"
+    );
+}

package/template/tsconfig.json

@@ -18,6 +18,7 @@
   "include": [
     "app/**/*.ts",
     "app/**/*.tsx",
+    "lib/**/*.ts",
     "bcp.config.ts"
   ],
   "exclude": [