@developerankitkumar/create-reactforge 0.0.0-stage → 1.0.0

package/README.md

@@ -1,3 +1,88 @@
-# Temporary Holding Version
+# React TypeScript Starter CLI
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+A reusable React + TypeScript starter template with Material UI, SCSS, authentication, API integration, dynamic themes, and ready-to-use components.
+
+## Quick Start
+
+Create a new project using:
+
+```bash
+npx --yes @developerankitkumar/create-react-starter@latest my-new-app
+```
+
+Then run:
+
+```bash
+cd my-new-app
+npm install
+npm run dev
+```
+
+## Features
+
+- React with TypeScript and Vite
+- Material UI (MUI)
+- SCSS architecture
+- Dynamic Light, Dark, and System themes
+- Authentication and protected routes
+- Mock API and real backend API modes
+- Configurable backend URL
+- Reusable layout with sidebar and topbar
+- Reusable form and table components
+- User management example
+- Snackbar notifications
+- Excel import and file upload components
+- Font Awesome Free icons
+
+## Interactive Setup
+
+The CLI allows you to configure:
+
+1. Project name
+2. Default theme: System, Light, or Dark
+3. API mode: Mock API or Real API
+4. Backend URL when Real API is selected
+
+## Environment Configuration
+
+Generated projects support environment variables such as:
+
+```env
+VITE_USE_MOCK=true
+VITE_API_BASE_URL=http://localhost:8000
+```
+
+Use Mock API mode for frontend development without a backend, or Real API mode to connect your application to an existing backend.
+
+## Project Structure
+
+```text
+src/
+├── components/
+├── context/
+├── interface/
+├── mock/
+├── pages/
+├── services/
+├── styles/
+├── types/
+└── utils/
+```
+
+## Build for Production
+
+```bash
+npm run build
+```
+
+## NPM Package
+
+[@developerankitkumar/create-react-starter](https://www.npmjs.com/package/@developerankitkumar/create-react-starter)
+
+## GitHub Repository
+
+[developerankitkumar/create-react-starter](https://github.com/developerankitkumar/create-react-starter)
+
+## Author
+
+Developed by **developerankitkumar**.

package/bin/index.js

@@ -0,0 +1,222 @@
+#!/usr/bin/env node
+
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import prompts from 'prompts';
+import pc from 'picocolors';
+import { downloadTemplate } from './template-downloader.js';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+let projectName = process.argv[2];
+
+if (!projectName) {
+    const response = await prompts({
+        type: 'text',
+        name: 'projectName',
+        message: 'Enter your project name:',
+        initial: 'my-react-app',
+        validate: (value) =>
+            /^[a-z0-9][a-z0-9._-]*$/.test(value)
+                ? true
+                : 'Use a valid lowercase project name',
+    });
+
+    projectName = response.projectName;
+}
+
+if (!projectName) {
+    console.log(pc.yellow('Project creation cancelled.'));
+    process.exit(1);
+}
+
+if (
+    !/^[a-z0-9][a-z0-9._-]*$/.test(projectName) ||
+    projectName === '.' ||
+    projectName === '..'
+) {
+    console.error(pc.red('Invalid project name.'));
+    process.exit(1);
+}
+
+const themeResponse = await prompts({
+    type: 'select',
+    name: 'theme',
+    message: 'Choose default theme:',
+    choices: [
+        { title: 'System (Recommended)', value: 'system' },
+        { title: 'Light', value: 'light' },
+        { title: 'Dark', value: 'dark' },
+    ],
+    initial: 0,
+});
+
+if (!themeResponse.theme) {
+    console.log(pc.yellow('Project creation cancelled.'));
+    process.exit(1);
+}
+
+const authResponse = await prompts({
+    type: 'select',
+    name: 'authMode',
+    message: 'Choose API / Authentication mode:',
+    choices: [
+        { title: 'Mock API (Demo / Development)', value: 'mock' },
+        { title: 'Real API (Backend Integration)', value: 'real' },
+    ],
+    initial: 0,
+});
+
+if (!authResponse.authMode) {
+    console.log(pc.yellow('Project creation cancelled.'));
+    process.exit(1);
+}
+
+let apiBaseUrl = '';
+
+if (authResponse.authMode === 'real') {
+    const apiResponse = await prompts({
+        type: 'text',
+        name: 'baseUrl',
+        message: 'Enter Backend API Base URL:',
+        initial: 'http://localhost:8000',
+        validate: (value) => {
+            try {
+                const url = new URL(value);
+
+                return ['http:', 'https:'].includes(url.protocol)
+                    ? true
+                    : 'URL must start with http:// or https://';
+            } catch {
+                return 'Please enter a valid API URL';
+            }
+        },
+    });
+
+    if (!apiResponse.baseUrl) {
+        console.log(pc.yellow('Project creation cancelled.'));
+        process.exit(1);
+    }
+
+    apiBaseUrl = apiResponse.baseUrl.trim().replace(/\/+$/, '');
+}
+
+const targetDir = path.resolve(process.cwd(), projectName);
+const licenseResponse = await prompts({
+    type: 'password',
+    name: 'licenseKey',
+    message: 'Enter your React Starter license key:',
+    validate: (value) =>
+        /^AK-[A-F0-9]{8}(-[A-F0-9]{8}){3}$/i.test(value.trim())
+            ? true
+            : 'Please enter a valid license key format',
+});
+
+if (!licenseResponse.licenseKey) {
+    console.log(pc.yellow('Project creation cancelled.'));
+    process.exit(1);
+}
+
+const licenseKey = licenseResponse.licenseKey.trim();
+if (fs.existsSync(targetDir)) {
+    console.error(pc.red(`Folder "${projectName}" already exists.`));
+    process.exit(1);
+}
+
+try {
+    console.log(pc.cyan('\nValidating license and downloading template...\n'));
+
+    await downloadTemplate({
+        licenseKey,
+        targetDir,
+        projectName,
+        serverUrl:
+            process.env.REACT_STARTER_LICENSE_SERVER_URL ||
+            'https://license.ankitdeveloper.site',
+    });
+
+    console.log(pc.green('✔ License verified and template downloaded.\n'));
+
+// Generate environment configuration
+    const envPath = path.join(targetDir, '.env');
+
+    const envContent = [
+        `VITE_USE_MOCK=${authResponse.authMode === 'mock'}`,
+        `VITE_API_BASE_URL=${apiBaseUrl}`,
+        'VITE_NGROK_SKIP=',
+        '',
+    ].join('\n');
+
+    fs.writeFileSync(envPath, envContent);
+
+// Apply selected default theme to generated project
+    const themeContextPath = path.join(
+        targetDir,
+        'src/context/ThemeModeContext.tsx'
+    );
+
+    let themeContext = fs.readFileSync(themeContextPath, 'utf8');
+
+    const themePlaceholder =
+        "export const DEFAULT_THEME_MODE: ThemeMode = 'system'";
+
+    if (!themeContext.includes(themePlaceholder)) {
+        throw new Error('Default theme configuration not found in template.');
+    }
+
+    themeContext = themeContext.replace(
+        themePlaceholder,
+        `export const DEFAULT_THEME_MODE: ThemeMode = '${themeResponse.theme}'`
+    );
+
+    fs.writeFileSync(themeContextPath, themeContext);
+
+    // Create .gitignore in the generated project
+    const gitignorePath = path.join(targetDir, '.gitignore');
+
+    fs.writeFileSync(
+        gitignorePath,
+        [
+            'node_modules/',
+            'dist/',
+            '.env',
+            '.env.*',
+            '!.env.example',
+            '.DS_Store',
+            '.idea/',
+            '*.log',
+            '',
+        ].join('\n')
+    );
+
+    const packagePath = path.join(targetDir, 'package.json');
+    const pkg = JSON.parse(fs.readFileSync(packagePath, 'utf8'));
+
+    pkg.name = projectName;
+    pkg.version = '0.1.0';
+    pkg.private = true;
+
+    fs.writeFileSync(
+        packagePath,
+        JSON.stringify(pkg, null, 2) + '\n'
+    );
+
+    // Regenerate lockfile during npm install
+    const lockPath = path.join(targetDir, 'package-lock.json');
+
+    if (fs.existsSync(lockPath)) {
+        fs.rmSync(lockPath);
+    }
+
+    console.log(pc.green('✔ Project created successfully!\n'));
+
+    console.log('Next steps:\n');
+    console.log(pc.cyan(`  cd ${projectName}`));
+    console.log(pc.cyan('  npm install'));
+    console.log(pc.cyan('  npm run dev\n'));
+
+} catch (error) {
+    console.error(pc.red(`Project creation failed: ${error.message}`));
+    process.exit(1);
+}

package/bin/template-downloader.js

@@ -0,0 +1,168 @@
+
+import fs from 'node:fs';
+import path from 'node:path';
+import { randomUUID } from 'node:crypto';
+import { unzipSync } from 'fflate';
+
+const MAX_ZIP_SIZE = 20 * 1024 * 1024;
+const MAX_FILE_SIZE = 30 * 1024 * 1024;
+const MAX_TOTAL_SIZE = 100 * 1024 * 1024;
+const MAX_FILES = 5000;
+
+export async function downloadTemplate({
+  licenseKey,
+  targetDir,
+  projectName,
+  installationId = randomUUID(),
+  serverUrl = 'https://license.ankitdeveloper.site',
+}) {
+  if (fs.existsSync(targetDir)) {
+    throw new Error('Target directory already exists.');
+  }
+
+  const url = new URL('/api/v1/templates/download', serverUrl);
+
+  // HTTP is allowed only for local development.
+  const isLocalhost = ['127.0.0.1', 'localhost', '::1']
+    .includes(url.hostname);
+
+  if (
+    url.protocol !== 'https:' &&
+    !(url.protocol === 'http:' && isLocalhost)
+  ) {
+    throw new Error('License server must use HTTPS.');
+  }
+
+  const response = await fetch(url, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'Accept': 'application/zip',
+    },
+    body: JSON.stringify({
+  license_key: licenseKey,
+  installation_id: installationId,
+  project_name: projectName,
+}),
+    signal: AbortSignal.timeout(60000),
+    redirect: 'error',
+  });
+
+  if (!response.ok) {
+    if (response.status === 403) {
+      throw new Error('Invalid, expired or revoked license.');
+    }
+
+    throw new Error(
+      `Template download failed (HTTP ${response.status}).`
+    );
+  }
+
+  if (!response.body) {
+    throw new Error('Empty template response.');
+  }
+
+  const chunks = [];
+  let downloadedSize = 0;
+
+  for await (const chunk of response.body) {
+    downloadedSize += chunk.length;
+
+    if (downloadedSize > MAX_ZIP_SIZE) {
+      throw new Error('Template ZIP exceeds maximum size.');
+    }
+
+    chunks.push(chunk);
+  }
+
+  const zipBuffer = Buffer.concat(chunks);
+
+  // ZIP entries are checked before writing to disk.
+  const entries = unzipSync(
+    new Uint8Array(zipBuffer),
+    {
+      filter(file) {
+        if (file.originalSize > MAX_FILE_SIZE) {
+          throw new Error('Template contains an oversized file.');
+        }
+        return true;
+      },
+    }
+  );
+
+  const filenames = Object.keys(entries);
+
+  if (filenames.length > MAX_FILES) {
+    throw new Error('Template contains too many files.');
+  }
+
+  let totalSize = 0;
+
+  for (const [filename, data] of Object.entries(entries)) {
+    if (
+      !filename ||
+      filename.includes('\\') ||
+      filename.includes('\0') ||
+      filename.startsWith('/') ||
+      /^[a-zA-Z]:/.test(filename)
+    ) {
+      throw new Error('Unsafe ZIP entry detected.');
+    }
+
+    const segments = filename.split('/');
+
+    if (
+      segments.some(
+        (segment) => segment === '..' || segment === '.'
+      )
+    ) {
+      throw new Error('ZIP path traversal detected.');
+    }
+
+    totalSize += data.length;
+
+    if (
+      data.length > MAX_FILE_SIZE ||
+      totalSize > MAX_TOTAL_SIZE
+    ) {
+      throw new Error('Template exceeds extraction size limits.');
+    }
+  }
+
+  fs.mkdirSync(targetDir, { recursive: false });
+
+  try {
+    for (const [filename, data] of Object.entries(entries)) {
+      const outputPath = path.resolve(targetDir, filename);
+
+      if (
+        outputPath !== targetDir &&
+        !outputPath.startsWith(targetDir + path.sep)
+      ) {
+        throw new Error('Unsafe extraction path.');
+      }
+
+      if (filename.endsWith('/')) {
+        fs.mkdirSync(outputPath, { recursive: true });
+        continue;
+      }
+
+      fs.mkdirSync(path.dirname(outputPath), {
+        recursive: true,
+      });
+
+      fs.writeFileSync(outputPath, data, {
+        flag: 'wx',
+      });
+    }
+  } catch (error) {
+    fs.rmSync(targetDir, {
+      recursive: true,
+      force: true,
+    });
+
+    throw error;
+  }
+
+  return targetDir;
+}

package/package.json

@@ -1,6 +1,35 @@
 {
   "name": "@developerankitkumar/create-reactforge",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "description": "ReactForge - React TypeScript Starter CLI with License Verification",
+  "dependencies": {
+    "fflate": "^0.8.3",
+    "picocolors": "^1.1.1",
+    "prompts": "^2.4.2"
+  },
+  "type": "module",
+  "bin": {
+    "create-reactforge": "./bin/index.js"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "bin"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/developerankitkumar/reactforge-platform.git"
+  },
+  "homepage": "https://github.com/developerankitkumar/reactforge-platform#readme",
+  "bugs": {
+    "url": "https://github.com/developerankitkumar/reactforge-platform/issues"
+  }
+}