create-heliumts-app 0.2.5

package/README.md

@@ -0,0 +1,67 @@
+# create-heliumts-app
+
+Create [HeliumTS](https://github.com/heliobentes/heliumts) apps with one command.
+
+## Usage
+
+```bash
+npx create-heliumts-app my-app
+```
+
+Or to scaffold in the current directory:
+
+```bash
+npx create-heliumts-app .
+```
+
+### Options
+
+| Flag | Description |
+|------|-------------|
+| `--tailwind` | Use Tailwind CSS template (skips prompt) |
+| `--no-tailwind` | Use basic template without Tailwind (skips prompt) |
+
+```bash
+# Use Tailwind CSS (default, skips prompt)
+npx create-heliumts-app my-app --tailwind
+
+# Use basic template without Tailwind (skips prompt)
+npx create-heliumts-app my-app --no-tailwind
+```
+
+## What it does
+
+1. Asks if you want to use **Tailwind CSS** (defaults to Yes)
+2. Scaffolds a complete HeliumTS project with one of two templates:
+   - `tailwind` - HeliumTS with Tailwind CSS pre-configured (default)
+   - `basic` - Standard HeliumTS setup
+3. Automatically runs `npm install`
+
+## Requirements
+
+- Node.js 18.0.0 or later
+- npm, yarn, or pnpm
+
+## After Installation
+
+```bash
+cd my-app
+npm run dev
+```
+
+## Available Scripts
+
+| Command | Description |
+|---------|-------------|
+| `npm run dev` | Start development server |
+| `npm run build` | Build for production |
+| `npm run start` | Start production server |
+
+## Learn More
+
+- [HeliumTS Documentation](https://heliumts.com/docs)
+- [HeliumTS GitHub](https://github.com/heliobentes/heliumts)
+
+## License
+
+MIT

package/bin/index.js

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+
+import { createApp } from '../src/index.js';
+
+createApp();

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "create-heliumts-app",
+  "version": "0.2.5",
+  "description": "Create HeliumTS apps with one command",
+  "type": "module",
+  "main": "src/index.js",
+  "bin": {
+    "create-heliumts-app": "./bin/index.js"
+  },
+  "scripts": {
+    "test": "node bin/index.js test-app"
+  },
+  "keywords": [
+    "heliumts",
+    "react",
+    "vite",
+    "fullstack",
+    "typescript",
+    "cli",
+    "create-app"
+  ],
+  "author": "Helio Bentes",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/heliobentes/create-heliumts-app.git"
+  },
+  "bugs": {
+    "url": "https://github.com/heliobentes/create-heliumts-app/issues"
+  },
+  "homepage": "https://heliumts.com",
+  "files": [
+    "bin",
+    "src",
+    "templates"
+  ],
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}

package/src/index.js

@@ -0,0 +1,245 @@
+import * as fs from 'fs';
+import * as path from 'path';
+import * as readline from 'readline';
+import { execSync } from 'child_process';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const COLORS = {
+    reset: '\x1b[0m',
+    bright: '\x1b[1m',
+    dim: '\x1b[2m',
+    red: '\x1b[31m',
+    green: '\x1b[32m',
+    yellow: '\x1b[33m',
+    blue: '\x1b[34m',
+    magenta: '\x1b[35m',
+    cyan: '\x1b[36m',
+    white: '\x1b[37m'
+};
+
+function log(message, color = '') {
+    console.log(`${color}${message}${COLORS.reset}`);
+}
+
+function logSuccess(message) {
+    log(`✓ ${message}`, COLORS.green);
+}
+
+function logError(message) {
+    log(`✗ ${message}`, COLORS.red);
+}
+
+function logInfo(message) {
+    log(`ℹ ${message}`, COLORS.cyan);
+}
+
+function printBanner() {
+    console.log('');
+    log('╔═══════════════════════════════════════════╗', COLORS.cyan);
+    log('║                                           ║', COLORS.cyan);
+    log('║        🚀 Create HeliumTS App 🚀          ║', COLORS.cyan);
+    log('║                                           ║', COLORS.cyan);
+    log('╚═══════════════════════════════════════════╝', COLORS.cyan);
+    console.log('');
+}
+
+function askQuestion(rl, question) {
+    return new Promise((resolve) => {
+        rl.question(question, (answer) => {
+            resolve(answer.trim());
+        });
+    });
+}
+
+function copyDirectory(src, dest) {
+    fs.mkdirSync(dest, { recursive: true });
+    
+    const entries = fs.readdirSync(src, { withFileTypes: true });
+    
+    for (const entry of entries) {
+        const srcPath = path.join(src, entry.name);
+        const destPath = path.join(dest, entry.name);
+        
+        if (entry.isDirectory()) {
+            copyDirectory(srcPath, destPath);
+        } else {
+            fs.copyFileSync(srcPath, destPath);
+        }
+    }
+}
+
+function isDirectoryEmpty(dirPath) {
+    if (!fs.existsSync(dirPath)) {
+        return true;
+    }
+    
+    const files = fs.readdirSync(dirPath);
+    // Ignore hidden files like .git, .DS_Store
+    const visibleFiles = files.filter(f => !f.startsWith('.'));
+    return visibleFiles.length === 0;
+}
+
+function parseArgs(args) {
+    const result = {
+        projectName: null,
+        tailwind: null // null means ask, true means use tailwind, false means skip tailwind
+    };
+    
+    for (const arg of args) {
+        if (arg === '--tailwind') {
+            result.tailwind = true;
+        } else if (arg === '--no-tailwind') {
+            result.tailwind = false;
+        } else if (!arg.startsWith('-')) {
+            result.projectName = arg;
+        }
+    }
+    
+    return result;
+}
+
+export async function createApp() {
+    printBanner();
+    
+    // Get project name from command line arguments
+    const args = process.argv.slice(2);
+    const { projectName, tailwind: tailwindFlag } = parseArgs(args);
+    
+    if (!projectName) {
+        logError('Please specify the project directory:');
+        console.log('');
+        log('  npx create-heliumts-app <project-directory>', COLORS.dim);
+        console.log('');
+        log('For example:', COLORS.dim);
+        log('  npx create-heliumts-app my-helium-app', COLORS.dim);
+        log('  npx create-heliumts-app my-helium-app --tailwind', COLORS.dim);
+        log('  npx create-heliumts-app .', COLORS.dim);
+        console.log('');
+        process.exit(1);
+    }
+    
+    // Resolve the target directory
+    const isCurrentDir = projectName === '.';
+    const targetDir = isCurrentDir 
+        ? process.cwd() 
+        : path.resolve(process.cwd(), projectName);
+    
+    const displayName = isCurrentDir ? 'current directory' : projectName;
+    
+    // Check if directory is empty
+    if (!isDirectoryEmpty(targetDir)) {
+        logError(`The directory "${displayName}" is not empty.`);
+        log('Please choose an empty directory or remove existing files.', COLORS.dim);
+        console.log('');
+        process.exit(1);
+    }
+    
+    // Create readline interface for user input
+    const rl = readline.createInterface({
+        input: process.stdin,
+        output: process.stdout
+    });
+    
+    try {
+        // Determine if we should use Tailwind
+        let useTailwind;
+        
+        if (tailwindFlag !== null) {
+            // Flag was provided, use it directly
+            useTailwind = tailwindFlag;
+            log(`Creating a new HeliumTS app in ${COLORS.cyan}${targetDir}${COLORS.reset}`);
+            console.log('');
+            logInfo(`Using ${useTailwind ? 'Tailwind CSS' : 'basic'} template (from flag)...`);
+        } else {
+            // Ask the user
+            log(`Creating a new HeliumTS app in ${COLORS.cyan}${targetDir}${COLORS.reset}`);
+            console.log('');
+            
+            const tailwindAnswer = await askQuestion(
+                rl, 
+                `${COLORS.yellow}?${COLORS.reset} Do you want to use Tailwind CSS? ${COLORS.dim}(Y/n)${COLORS.reset} `
+            );
+            
+            // Default is YES (Tailwind)
+            useTailwind = tailwindAnswer.toLowerCase() !== 'n' && tailwindAnswer.toLowerCase() !== 'no';
+            console.log('');
+            logInfo(`Using ${useTailwind ? 'Tailwind CSS' : 'basic'} template...`);
+        }
+        
+        const templateName = useTailwind ? 'tailwind' : 'basic';
+        
+        // Get template path
+        const templatesDir = path.join(__dirname, '..', 'templates');
+        const templatePath = path.join(templatesDir, templateName);
+        
+        // Check if template exists
+        if (!fs.existsSync(templatePath)) {
+            logError(`Template "${templateName}" not found at ${templatePath}`);
+            log('Please make sure the templates are properly installed.', COLORS.dim);
+            process.exit(1);
+        }
+        
+        // Copy template to target directory
+        logInfo('Scaffolding project...');
+        copyDirectory(templatePath, targetDir);
+        
+        // Update package.json with project name
+        const packageJsonPath = path.join(targetDir, 'package.json');
+        if (fs.existsSync(packageJsonPath)) {
+            const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf-8'));
+            packageJson.name = isCurrentDir ? path.basename(targetDir) : projectName;
+            fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2) + '\n');
+        }
+        
+        logSuccess('Project scaffolded successfully!');
+        
+        // Install dependencies
+        console.log('');
+        logInfo('Installing dependencies...');
+        console.log('');
+        
+        try {
+            execSync('npm install', {
+                cwd: targetDir,
+                stdio: 'inherit'
+            });
+            console.log('');
+            logSuccess('Dependencies installed successfully!');
+        } catch (error) {
+            logError('Failed to install dependencies.');
+            log('Please run "npm install" manually in the project directory.', COLORS.dim);
+        }
+        
+        // Print success message
+        console.log('');
+        log('═══════════════════════════════════════════', COLORS.green);
+        logSuccess('Your HeliumTS app is ready!');
+        log('═══════════════════════════════════════════', COLORS.green);
+        console.log('');
+        
+        log('Next steps:', COLORS.bright);
+        console.log('');
+        
+        if (!isCurrentDir) {
+            log(`  cd ${projectName}`, COLORS.cyan);
+        }
+        log('  npm run dev', COLORS.cyan);
+        console.log('');
+        
+        log('Available commands:', COLORS.bright);
+        console.log('');
+        log('  npm run dev     - Start development server', COLORS.dim);
+        log('  npm run build   - Build for production', COLORS.dim);
+        log('  npm run start   - Start production server', COLORS.dim);
+        console.log('');
+        
+        log('Happy coding! 🎉', COLORS.magenta);
+        console.log('');
+        
+    } finally {
+        rl.close();
+    }
+}

package/templates/basic/README.md

@@ -0,0 +1,44 @@
+# HeliumTS App
+
+This is a [HeliumTS](https://heliumts.com) project bootstrapped with `create-heliumts-app`.
+
+## Getting Started
+
+First, install the dependencies:
+
+```bash
+npm install
+# or
+yarn
+# or
+pnpm install
+```
+
+Then, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+```
+
+Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
+
+You can start editing the page by modifying `src/pages/index.tsx`. The page auto-updates as you edit the file.
+
+## Project Structure
+
+- `src/pages` - File-based routing for your application.
+- `src/server` - Server-side logic and RPC functions.
+- `src/components` - React components.
+- `helium.config.ts` - HeliumTS configuration.
+
+## Learn More
+
+To learn more about HeliumTS, take a look at the following resources:
+
+- [HeliumTS Documentation](https://heliumts.com/docs) - learn about HeliumTS features and API.
+- [HeliumTS GitHub](https://github.com/heliobentes/heliumts) - check out the source code and contribute.
+

package/templates/basic/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+  },
+])

package/templates/basic/helium.config.ts

@@ -0,0 +1,21 @@
+import type { HeliumConfig } from "heliumts/server";
+
+const config: HeliumConfig = {
+  trustProxyDepth: 1, // Trust 1 proxy level (e.g., DigitalOcean, Netlify, etc.)
+  rpc: {
+    transport: "websocket",
+    autoHttpOnMobile: false,
+    compression: {
+      enabled: true,
+      threshold: 1024,
+    },
+    security: {
+      maxConnectionsPerIP: 10,
+      maxMessagesPerWindow: 200,
+      rateLimitWindowMs: 60000,
+      tokenValidityMs: 30000,
+    },
+  },
+};
+
+export default config;

package/templates/basic/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/helium.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>HeliumTS App</title>
+    <link href="/src/styles.css" rel="stylesheet" />
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>