baraqex 1.0.49 → 1.0.51

package/templates/fullstack-template/package.json

@@ -1,32 +1,14 @@
 {
   "name": "fullstack-app",
   "version": "1.0.0",
-  "description": "A fullstack application built with Baraqex",
   "type": "module",
-  "main": "server.js",
   "scripts": {
     "dev": "node server.js",
-    "start": "NODE_ENV=production node server.js",
-    "build": "echo 'No build step required for this template'",
-    "test": "echo 'No tests specified' && exit 0"
+    "start": "node server.js",
+    "build": "echo \"No build step required\""
   },
   "dependencies": {
-    "baraqex": "^1.0.48",
-    "cors": "^2.8.5",
-    "express": "^4.18.2",
-    "frontend-hamroun": "latest"
-  },
-  "devDependencies": {
-    "@types/cors": "^2.8.13",
-    "@types/express": "^4.17.17"
-  },
-  "keywords": [
-    "baraqex",
-    "fullstack",
-    "express",
-    "api",
-    "ssr"
-  ],
-  "author": "",
-  "license": "MIT"
+    "frontend-hamroun": "latest",
+    "baraqex": "latest"
+  }
 }

package/templates/fullstack-template/server.js

@@ -1,577 +1,16 @@
-import express from 'express';
-import cors from 'cors';
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
+import { createDevServer } from 'baraqex/server';
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-async function startServer() {
-  try {
-    console.log('🚀 Starting Baraqex fullstack server...');
-    
-    const app = express();
-    const port = process.env.PORT || 3000;
-    
-    // Basic middleware
-    app.use(express.json());
-    app.use(express.urlencoded({ extended: true }));
-    app.use(cors());
-    
-    // Request logging
-    app.use((req, res, next) => {
-      console.log(`${new Date().toISOString()} - ${req.method} ${req.url}`);
-      next();
-    });
-    
-    // Serve static files from public directory
-    const publicDir = path.join(process.cwd(), 'public');
-    if (fs.existsSync(publicDir)) {
-      app.use(express.static(publicDir));
-      console.log('📂 Serving static files from /public');
-    }
-    
-    // Auto-discover and register API routes
-    await setupApiRoutes(app);
-    
-    // Auto-discover and register page routes (SSR)
-    await setupPageRoutes(app);
-    
-    // Root route fallback
-    app.get('/', async (req, res) => {
-      try {
-        // Try to render the index page component if it exists
-        const indexPagePath = path.join(process.cwd(), 'src/pages/index.js');
-        if (fs.existsSync(indexPagePath)) {
-          const pageHtml = await renderPageComponent(indexPagePath, {
-            path: '/',
-            query: req.query
-          });
-          res.send(pageHtml);
-        } else {
-          // Fallback to basic HTML
-          res.send(generateWelcomePage());
-        }
-      } catch (error) {
-        console.error('Error rendering root page:', error);
-        res.status(500).send(generateErrorPage(500, 'Server Error'));
-      }
-    });
-    
-    // 404 handler
-    app.use((req, res) => {
-      res.status(404).json({
-        error: 'Not Found',
-        message: `Route ${req.method} ${req.path} not found`,
-        timestamp: new Date().toISOString()
-      });
-    });
-    
-    // Error handler
-    app.use((err, req, res, next) => {
-      console.error('Server Error:', err);
-      res.status(500).json({
-        error: 'Internal Server Error',
-        message: process.env.NODE_ENV === 'production' ? 'Something went wrong' : err.message,
-        timestamp: new Date().toISOString()
-      });
-    });
-    
-    // Start server
-    app.listen(port, () => {
-      console.log('✅ Fullstack server is running!');
-      console.log(`📍 Server: http://localhost:${port}`);
-      console.log('📁 API routes available at /api/*');
-      console.log('📄 Pages available at /*');
-      console.log('📂 Static files served from /public');
-      console.log('\n🔗 Quick links:');
-      console.log(`   - Homepage: http://localhost:${port}`);
-      console.log(`   - API Hello: http://localhost:${port}/api/hello`);
-      console.log(`   - API Users: http://localhost:${port}/api/users`);
-    });
-    
-  } catch (error) {
-    console.error('❌ Failed to start server:', error.message);
-    
-    if (error.code === 'MODULE_NOT_FOUND') {
-      console.error('\n💡 Please install dependencies: npm install express cors');
-    }
-    
-    process.exit(1);
-  }
-}
-
-// Auto-discover API routes in src/api
-async function setupApiRoutes(app) {
-  const apiDir = path.join(process.cwd(), 'src/api');
-  
-  if (!fs.existsSync(apiDir)) {
-    console.log('📁 Creating src/api directory...');
-    fs.mkdirSync(apiDir, { recursive: true });
-    
-    // Create example API files
-    await createExampleApiFiles(apiDir);
-  }
-  
-  console.log('🔄 Scanning for API routes...');
-  await scanApiDirectory(app, apiDir, '/api');
-}
-
-// Recursively scan API directory and register routes
-async function scanApiDirectory(app, dirPath, routePrefix) {
-  const entries = fs.readdirSync(dirPath, { withFileTypes: true });
-  
-  for (const entry of entries) {
-    const fullPath = path.join(dirPath, entry.name);
-    
-    if (entry.isDirectory()) {
-      await scanApiDirectory(app, fullPath, `${routePrefix}/${entry.name}`);
-    } else if (entry.name.endsWith('.js')) {
-      const routePath = getApiRoutePath(entry.name, routePrefix);
-      await registerApiRoute(app, fullPath, routePath);
-    }
-  }
-}
-
-// Convert filename to route path
-function getApiRoutePath(filename, routePrefix) {
-  const baseName = path.basename(filename, '.js');
-  
-  if (baseName === 'index') {
-    return routePrefix === '/api' ? '/api' : routePrefix;
-  }
-  
-  // Handle dynamic routes [param]
-  const paramMatch = baseName.match(/^\[(.+)\]$/);
-  if (paramMatch) {
-    return `${routePrefix}/:${paramMatch[1]}`;
-  }
-  
-  return `${routePrefix}/${baseName}`;
-}
-
-// Register API route handlers
-async function registerApiRoute(app, filePath, routePath) {
-  try {
-    // Import the API module with cache busting
-    const apiModule = await import(`${filePath}?t=${Date.now()}`);
-    
-    const methods = ['get', 'post', 'put', 'delete', 'patch', 'options'];
-    let registeredMethods = [];
-    
-    for (const method of methods) {
-      if (typeof apiModule[method] === 'function') {
-        app[method](routePath, async (req, res, next) => {
-          try {
-            await apiModule[method](req, res, next);
-          } catch (error) {
-            console.error(`Error in ${method.toUpperCase()} ${routePath}:`, error);
-            next(error);
-          }
-        });
-        registeredMethods.push(method.toUpperCase());
-      }
-    }
-    
-    if (registeredMethods.length > 0) {
-      console.log(`📡 API: ${routePath} [${registeredMethods.join(', ')}]`);
-    }
-  } catch (error) {
-    console.error(`Error registering API route ${routePath}:`, error.message);
-  }
-}
-
-// Setup page routes for SSR
-async function setupPageRoutes(app) {
-  const pagesDir = path.join(process.cwd(), 'src/pages');
-  
-  if (!fs.existsSync(pagesDir)) {
-    console.log('📁 Creating src/pages directory...');
-    fs.mkdirSync(pagesDir, { recursive: true });
-    
-    // Create example page
-    await createExamplePageFile(pagesDir);
-  }
-  
-  console.log('🔄 Scanning for page routes...');
-  await scanPagesDirectory(app, pagesDir, '');
-}
-
-// Scan pages directory for SSR routes
-async function scanPagesDirectory(app, dirPath, routePrefix) {
-  const entries = fs.readdirSync(dirPath, { withFileTypes: true });
-  
-  for (const entry of entries) {
-    const fullPath = path.join(dirPath, entry.name);
-    
-    if (entry.isDirectory()) {
-      await scanPagesDirectory(app, fullPath, `${routePrefix}/${entry.name}`);
-    } else if (entry.name.endsWith('.js')) {
-      const routePath = getPageRoutePath(entry.name, routePrefix);
-      await registerPageRoute(app, fullPath, routePath);
-    }
-  }
-}
-
-// Convert page filename to route path
-function getPageRoutePath(filename, routePrefix) {
-  const baseName = path.basename(filename, '.js');
-  
-  if (baseName === 'index') {
-    return routePrefix || '/';
-  }
-  
-  // Handle dynamic routes [param]
-  const paramMatch = baseName.match(/^\[(.+)\]$/);
-  if (paramMatch) {
-    return `${routePrefix}/:${paramMatch[1]}`;
-  }
-  
-  return `${routePrefix}/${baseName}`;
-}
-
-// Register page route for SSR
-async function registerPageRoute(app, filePath, routePath) {
-  try {
-    // Only register if not root route (we handle that separately)
-    if (routePath !== '/') {
-      app.get(routePath, async (req, res) => {
-        try {
-          const pageHtml = await renderPageComponent(filePath, {
-            path: req.path,
-            query: req.query,
-            params: req.params
-          });
-          res.send(pageHtml);
-        } catch (error) {
-          console.error(`Error rendering page ${routePath}:`, error);
-          res.status(500).send(generateErrorPage(500, 'Page rendering error'));
-        }
-      });
-      
-      console.log(`📄 Page: ${routePath}`);
-    }
-  } catch (error) {
-    console.error(`Error registering page route ${routePath}:`, error.message);
-  }
-}
-
-// Render page component to HTML
-async function renderPageComponent(filePath, props) {
-  try {
-    const pageModule = await import(`${filePath}?t=${Date.now()}`);
-    const PageComponent = pageModule.default;
-    
-    if (typeof PageComponent !== 'function') {
-      throw new Error('Page component must export a default function');
-    }
-    
-    // Simple JSX to HTML conversion
-    const componentResult = PageComponent(props);
-    let htmlContent = '';
-    
-    if (typeof componentResult === 'string') {
-      htmlContent = componentResult;
-    } else {
-      // Convert JSX-like structure to HTML
-      htmlContent = jsxToHtml(componentResult);
-    }
-    
-    // Get page metadata
-    const title = PageComponent.title || 'Baraqex App';
-    const description = PageComponent.description || 'A Baraqex fullstack application';
-    
-    return generateDocument(htmlContent, { title, description, props });
-    
-  } catch (error) {
-    console.error('Error rendering page component:', error);
-    return generateErrorPage(500, 'Failed to render page component');
-  }
-}
-
-// Simple JSX to HTML converter
-function jsxToHtml(jsx) {
-  if (typeof jsx === 'string') {
-    return jsx;
-  }
-  
-  if (typeof jsx === 'number') {
-    return jsx.toString();
-  }
-  
-  if (jsx === null || jsx === undefined || jsx === false) {
-    return '';
-  }
-  
-  if (Array.isArray(jsx)) {
-    return jsx.map(item => jsxToHtml(item)).join('');
-  }
-  
-  if (jsx && typeof jsx === 'object') {
-    const { type, props } = jsx;
-    
-    if (!type) return '';
-    
-    const { children, ...attrs } = props || {};
-    
-    // Convert attributes to HTML
-    const attrStr = Object.entries(attrs)
-      .filter(([key, value]) => value != null && key !== 'children')
-      .map(([key, value]) => {
-        // Handle special attributes
-        if (key === 'className') key = 'class';
-        if (key === 'htmlFor') key = 'for';
-        if (key.startsWith('on')) return ''; // Skip event handlers
-        if (typeof value === 'object') {
-          // Handle style objects
-          if (key === 'style') {
-            const styleStr = Object.entries(value)
-              .map(([prop, val]) => `${prop.replace(/([A-Z])/g, '-$1').toLowerCase()}: ${val}`)
-              .join('; ');
-            return `style="${styleStr}"`;
-          }
-          return '';
-        }
-        return `${key}="${String(value)}"`;
-      })
-      .filter(Boolean)
-      .join(' ');
-    
-    const attrString = attrStr ? ` ${attrStr}` : '';
-    
-    // Handle self-closing tags
-    if (['img', 'br', 'hr', 'input', 'meta', 'link'].includes(type)) {
-      return `<${type}${attrString} />`;
-    }
-    
-    const childrenHtml = children ? jsxToHtml(children) : '';
-    return `<${type}${attrString}>${childrenHtml}</${type}>`;
-  }
-  
-  return String(jsx);
-}
-
-// Create example API files
-async function createExampleApiFiles(apiDir) {
-  // Create hello.js
-  const helloApiContent = `// Example API endpoint: GET/POST /api/hello
-
-export async function get(req, res) {
-  res.json({
-    message: 'Hello from Baraqex API!',
-    timestamp: new Date().toISOString(),
-    method: 'GET',
-    path: req.path
-  });
-}
-
-export async function post(req, res) {
-  const { name = 'World' } = req.body;
-  
-  res.json({
-    message: \`Hello \${name} from Baraqex API!\`,
-    timestamp: new Date().toISOString(),
-    method: 'POST',
-    body: req.body
-  });
-}
-`;
-
-  // Create users/index.js
-  const usersDir = path.join(apiDir, 'users');
-  fs.mkdirSync(usersDir, { recursive: true });
-  
-  const usersApiContent = `// Example API endpoint: /api/users
-
-const users = [
-  { id: 1, name: 'John Doe', email: 'john@example.com' },
-  { id: 2, name: 'Jane Smith', email: 'jane@example.com' },
-  { id: 3, name: 'Bob Johnson', email: 'bob@example.com' }
-];
-
-export async function get(req, res) {
-  res.json({
-    success: true,
-    data: users,
-    count: users.length
-  });
-}
-
-export async function post(req, res) {
-  const { name, email } = req.body;
-  
-  if (!name || !email) {
-    return res.status(400).json({
-      success: false,
-      message: 'Name and email are required'
-    });
-  }
-  
-  const newUser = {
-    id: users.length + 1,
-    name,
-    email
-  };
-  
-  users.push(newUser);
-  
-  res.status(201).json({
-    success: true,
-    message: 'User created successfully',
-    data: newUser
-  });
-}
-`;
-
-  fs.writeFileSync(path.join(apiDir, 'hello.js'), helloApiContent);
-  fs.writeFileSync(path.join(usersDir, 'index.js'), usersApiContent);
-  
-  console.log('📝 Created example API files');
-}
-
-// Create example page file
-async function createExamplePageFile(pagesDir) {
-  // Use the existing index.js content but ensure it's properly formatted
-  const indexPagePath = path.join(pagesDir, 'index.js');
-  if (!fs.existsSync(indexPagePath)) {
-    // Copy from the existing file or create a new one
-    const existingIndexPath = path.join(process.cwd(), 'src/pages/index.js');
-    if (fs.existsSync(existingIndexPath)) {
-      fs.copyFileSync(existingIndexPath, indexPagePath);
-    }
-    console.log('📝 Page component ready at src/pages/index.js');
-  }
-}
-
-// Generate complete HTML document
-function generateDocument(content, options = {}) {
-  const { title = 'Baraqex App', description = '', props = {} } = options;
-  
-  return `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${escapeHtml(title)}</title>
-  ${description ? `<meta name="description" content="${escapeHtml(description)}">` : ''}
-  <style>
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
-      margin: 0;
-      padding: 0;
-      background-color: #f5f5f5;
-    }
-    .app-container {
-      min-height: 100vh;
-    }
-  </style>
-</head>
-<body>
-  <div id="app-root" class="app-container">
-    ${content}
-  </div>
-  
-  <!-- Initial props for hydration -->
-  <script id="__APP_DATA__" type="application/json">
-    ${JSON.stringify(props)}
-  </script>
-  
-  <!-- Add any client-side scripts here -->
-</body>
-</html>`;
-}
-
-// Generate welcome page
-function generateWelcomePage() {
-  const content = `
-    <div style="text-align: center; padding: 2rem; max-width: 800px; margin: 0 auto;">
-      <h1 style="color: #2c3e50; font-size: 2.5rem; margin-bottom: 1rem;">
-        🚀 Welcome to Baraqex!
-      </h1>
-      
-      <p style="font-size: 1.2rem; color: #666; margin-bottom: 2rem;">
-        Your fullstack application is running successfully!
-      </p>
-      
-      <div style="display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); margin: 2rem 0;">
-        <div style="background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
-          <h3 style="margin-top: 0; color: #3498db;">📡 API Routes</h3>
-          <p>Your API endpoints are ready to use.</p>
-          <ul style="text-align: left;">
-            <li><a href="/api/hello" style="color: #3498db;">GET /api/hello</a></li>
-            <li><a href="/api/users" style="color: #3498db;">GET /api/users</a></li>
-          </ul>
-        </div>
-        
-        <div style="background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
-          <h3 style="margin-top: 0; color: #e74c3c;">📄 Pages</h3>
-          <p>Create pages in <code>src/pages/</code></p>
-          <p style="font-size: 0.9rem; color: #666;">
-            Each .js file becomes a route automatically.
-          </p>
-        </div>
-        
-        <div style="background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
-          <h3 style="margin-top: 0; color: #27ae60;">🛠️ Development</h3>
-          <p>Edit files and see changes instantly.</p>
-          <p style="font-size: 0.9rem; color: #666;">
-            Server automatically reloads on file changes.
-          </p>
-        </div>
-      </div>
-      
-      <div style="margin-top: 2rem; padding: 1rem; background: #fff3cd; border-radius: 8px; border-left: 4px solid #ffc107;">
-        <p style="margin: 0; color: #856404;">
-          <strong>Next steps:</strong> Create your first page component in <code>src/pages/index.js</code>
-        </p>
-      </div>
-    </div>
-  `;
-  
-  return generateDocument(content, {
-    title: 'Welcome to Baraqex',
-    description: 'A fullstack application framework'
-  });
-}
-
-// Generate error page
-function generateErrorPage(statusCode, message) {
-  const content = `
-    <div style="text-align: center; padding: 2rem;">
-      <h1 style="font-size: 4rem; color: #e74c3c; margin: 0;">${statusCode}</h1>
-      <h2 style="color: #333; margin: 1rem 0;">Something went wrong</h2>
-      <p style="color: #666; font-size: 1.1rem;">${escapeHtml(message)}</p>
-      <a href="/" style="color: #3498db; text-decoration: none; font-weight: bold;">← Back to Home</a>
-    </div>
-  `;
-  
-  return generateDocument(content, {
-    title: `Error ${statusCode}`,
-    description: 'An error occurred'
-  });
-}
-
-// Escape HTML special characters
-function escapeHtml(text) {
-  return String(text)
-    .replace(/&/g, '&amp;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#039;');
-}
-
-// Handle graceful shutdown
-process.on('SIGINT', () => {
-  console.log('\n👋 Shutting down server...');
-  process.exit(0);
+const server = createDevServer({
+  port: 3000,
+  enableCors: true
 });
 
-process.on('SIGTERM', () => {
-  console.log('\n👋 Server terminated');
-  process.exit(0);
-});
+// Enable SSR with hydration
+server.enableSSR({ hydratable: true });
 
 // Start the server
-startServer();
+server.start().then(() => {
+  console.log('Full-stack server started!');
+  console.log('Visit http://localhost:3000');
+  console.log('API available at http://localhost:3000/api');
+});

package/templates/basic-app/public/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Baraqex Basic App</title>
-  <link rel="stylesheet" href="/styles.css">
-</head>
-<body>
-  <div id="app-root"></div>
-  <script src="/src/App.jsx" type="module"></script>
-</body>
-</html>