create-jen-app 1.2.2 → 1.2.4

package/templates/ssr-isr/tsconfig.json

@@ -0,0 +1,39 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+
+    "strict": true,
+    "skipLibCheck": true,
+
+    "baseUrl": ".",
+    "paths": {
+      "@src/*": ["lib/*"]
+    },
+
+    "types": ["node"],
+
+    "outDir": "dist",
+    "rootDir": ".",
+
+    "allowJs": false,
+    "resolveJsonModule": true,
+
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": [
+    "site/**/*.ts",
+    "site/**/*.tsx",
+    "server.ts",
+    "build.ts",
+    "jen.config.ts"
+  ],
+  "exclude": ["node_modules", "dist"]
+}

package/templates/static/README.md

@@ -1,67 +1,63 @@
-
-# Jen.js Starter Kit: Static
-
-```sh
-npm create jen-app@latest
-````
-
-
-> ⚡ **Building something cool?** This is a static Jen.js starter template with file-based routing and fast builds.
-
-## 🚀 Project Structure
-
-Inside your Jen.js project, you'll see the following folders and files:
-
-```text
-/
-├── site/
-│   ├── assets/
-│   │   └── favicon.svg
-│   ├── components/
-│   │   └── Header.tsx
-│   ├── layouts/
-│   │   └── BaseLayout.tsx
-│   ├── pages/
-│   │   └── (index).tsx
-│   ├── styles/
-│   │   └── global.scss
-│   └── jen.config.ts
-├── dist/
-└── package.json
-```
-
-### Key Folders
-
-* **`site/pages/`** → Your routes (file-based routing)
-* **`site/components/`** → Reusable UI components
-* **`site/layouts/`** → Layout wrappers
-* **`site/assets/`** → Public static files
-* **`site/styles/`** → Global styles
-
-## 🧞 Commands
-
-All commands are run from the root of the project, from a terminal:
-
-| Command           | Action                                    |
-| :---------------- | :---------------------------------------- |
-| `npm install`     | Installs dependencies                     |
-| `npm run dev`     | Starts the dev server at `localhost:3001` |
-| `npm run build`   | Builds your static site into `./dist/`    |
-| `npm run preview` | Previews the production build locally     |
-
-## 📦 Deployment
-
-Jen.js outputs a fully static site into `dist/`.
-
-You can deploy it easily to:
-
-* GitHub Pages
-* Netlify
-* Vercel
-* Cloudflare Pages
-
-## 👀 Want to learn more?
-
-Check the Jen.js documentation (coming soon) or explore the source code to see how routing, builds, and rendering work.
-
-
+# Jen.js Starter Kit: Static
+
+```sh
+npm create jen-app@latest
+```
+
+> ⚡ **Building something cool?** This is a static Jen.js starter template with file-based routing and fast builds.
+
+## 🚀 Project Structure
+
+Inside your Jen.js project, you'll see the following folders and files:
+
+```text
+/
+├── site/
+│   ├── assets/
+│   │   └── favicon.svg
+│   ├── components/
+│   │   └── Header.tsx
+│   ├── layouts/
+│   │   └── BaseLayout.tsx
+│   ├── pages/
+│   │   └── (index).tsx
+│   ├── styles/
+│   │   └── global.scss
+│   └── jen.config.ts
+├── dist/
+└── package.json
+```
+
+### Key Folders
+
+- **`site/pages/`** → Your routes (file-based routing)
+- **`site/components/`** → Reusable UI components
+- **`site/layouts/`** → Layout wrappers
+- **`site/assets/`** → Public static files
+- **`site/styles/`** → Global styles
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command           | Action                                    |
+| :---------------- | :---------------------------------------- |
+| `npm install`     | Installs dependencies                     |
+| `npm run dev`     | Starts the dev server at `localhost:3001` |
+| `npm run build`   | Builds your static site into `./dist/`    |
+| `npm run preview` | Previews the production build locally     |
+
+## 📦 Deployment
+
+Jen.js outputs a fully static site into `dist/`.
+
+You can deploy it easily to:
+
+- GitHub Pages
+- Netlify
+- Vercel
+- Cloudflare Pages
+
+## 👀 Want to learn more?
+
+Check the Jen.js documentation (coming soon) or explore the source code to see how routing, builds, and rendering work.

package/templates/static/build.js

@@ -1,21 +1,3 @@
-/*
- * This file is part of Jen.js.
- * Copyright (C) 2026 oopsio
- * 
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- * 
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- * 
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- */
-
 import { dirname, join } from "node:path";
 import { fileURLToPath, pathToFileURL } from "node:url";
 import { readdir, stat, readFile, writeFile } from "node:fs/promises";
@@ -25,6 +7,30 @@ const __filename = fileURLToPath(import.meta.url);
 const currentDir = dirname(__filename);
 const rootDir = join(currentDir, ".");
 
+async function analyze() {
+  console.log("[ANALYZE] Loading bundle analyzer...");
+  const analyzerPath = pathToFileURL(
+    join(rootDir, "lib/build/bundle-analyzer.js"),
+  ).href;
+  const { runBundleAnalyzer } = await import(analyzerPath);
+  const configPath = join(currentDir, "jen.config.ts");
+  const outdir = join(currentDir, ".esbuild");
+  await esbuild.build({
+    entryPoints: [configPath],
+    outdir,
+    format: "esm",
+    platform: "node",
+    target: "es2022",
+    bundle: true,
+    loader: { ".ts": "ts" },
+    logLevel: "silent",
+  });
+  const configFile = join(outdir, "jen.config.js");
+  const config = (await import(pathToFileURL(configFile).href)).default;
+  await runBundleAnalyzer(config);
+  console.log("[ANALYZE] Bundle analysis complete!");
+}
+
 // Embedded Minifier Logic
 const Minifier = {
   html(input) {
@@ -47,6 +53,12 @@ const Minifier = {
 };
 
 async function main() {
+  const args = process.argv.slice(2);
+  if (args.includes("analyze")) {
+    await analyze();
+    return;
+  }
+
   console.log("[BUILD] Starting build...");
 
   const configPath = join(currentDir, "jen.config.ts");
@@ -68,9 +80,7 @@ async function main() {
   const configFile = join(outdir, "jen.config.js");
   const config = (await import(pathToFileURL(configFile).href)).default;
 
-  const buildPath = pathToFileURL(
-    join(rootDir, "lib/build/build.js"),
-  ).href;
+  const buildPath = pathToFileURL(join(rootDir, "lib/build/build.js")).href;
   const { buildSite } = await import(buildPath);
 
   await buildSite({ config });

package/templates/static/jen.config.ts

@@ -1,22 +1,3 @@
-/*
- * This file is part of Jen.js.
- * Copyright (C) 2026 oopsio
- * 
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- * 
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- * 
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- */
-
-
 const config: FrameworkConfig = {
   siteDir: "site",
   distDir: "dist",
@@ -51,7 +32,6 @@ const config: FrameworkConfig = {
 
 export default config;
 
-
 export type RenderMode = "ssg" | "ssr";
 
 export interface FrameworkConfig {

package/templates/static/jenjs.d.ts

@@ -1,21 +1,3 @@
-/*
- * This file is part of Jen.js.
- * Copyright (C) 2026 oopsio
- * 
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- * 
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- * 
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- */
-
 declare module "@jenjs/master" {
   export * from "@jenjs/master";
 }

package/templates/static/lib/api/(hello).js

@@ -1,26 +1,9 @@
-/*
- * This file is part of Jen.js.
- * Copyright (C) 2026 oopsio
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- */
 export default async function handler(ctx) {
-    return {
-        ok: true,
-        message: "Hello from API route",
-        method: ctx.method,
-        query: ctx.query,
-        body: ctx.body,
-    };
+  return {
+    ok: true,
+    message: "Hello from API route",
+    method: ctx.method,
+    query: ctx.query,
+    body: ctx.body,
+  };
 }

package/templates/static/lib/api/examples/files/[...slug].js

@@ -0,0 +1,22 @@
+/**
+ * Example Catch-All API Route: GET /api/files/[...slug]
+ *
+ * Example showing catch-all dynamic routes for file paths
+ * Matches: /api/files/a, /api/files/a/b, /api/files/a/b/c, etc.
+ */
+export default async function handler(req, res) {
+  const { slug } = req.params;
+  // slug will be an array of path segments
+  // /api/files/docs/readme.md -> slug = ['docs', 'readme.md']
+  // /api/files/a/b/c -> slug = ['a', 'b', 'c']
+  const filePath = Array.isArray(slug) ? slug.join("/") : slug;
+  if (req.method === "GET") {
+    res.status(200).json({
+      message: "File resource",
+      path: filePath,
+      segments: slug,
+    });
+  } else {
+    res.status(405).json({ error: "Method not allowed" });
+  }
+}

package/templates/static/lib/api/examples/hello.js

@@ -0,0 +1,11 @@
+/**
+ * Example API Route: GET /api/hello
+ *
+ * Basic example showing JSON response
+ */
+export default function handler(req, res) {
+  res.status(200).json({
+    message: "Hello from Jen.js API!",
+    timestamp: new Date().toISOString(),
+  });
+}

package/templates/static/lib/api/examples/posts/[id].js

@@ -0,0 +1,37 @@
+/**
+ * Example Dynamic API Route: GET|PUT|DELETE /api/posts/[id]
+ *
+ * Example showing dynamic route parameters
+ */
+const posts = [
+  { id: 1, title: "First Post", content: "Hello World" },
+  { id: 2, title: "Second Post", content: "Jen.js is awesome" },
+];
+export default async function handler(req, res) {
+  const { id } = req.params;
+  const postId = parseInt(String(id), 10);
+  if (isNaN(postId)) {
+    return res.status(400).json({ error: "Invalid post ID" });
+  }
+  const post = posts.find((p) => p.id === postId);
+  if (!post) {
+    return res.status(404).json({ error: "Post not found" });
+  }
+  if (req.method === "GET") {
+    // Get single post
+    res.status(200).json({ data: post });
+  } else if (req.method === "PUT") {
+    // Update post
+    const { title, content } = req.body;
+    if (title) post.title = title;
+    if (content) post.content = content;
+    res.status(200).json({ data: post });
+  } else if (req.method === "DELETE") {
+    // Delete post
+    const index = posts.findIndex((p) => p.id === postId);
+    posts.splice(index, 1);
+    res.status(200).json({ message: "Post deleted" });
+  } else {
+    res.status(405).json({ error: "Method not allowed" });
+  }
+}

package/templates/static/lib/api/examples/posts.js

@@ -0,0 +1,37 @@
+/**
+ * Example API Route: GET|POST /api/posts
+ *
+ * Example showing HTTP method handling and request body parsing
+ */
+const posts = [
+  { id: 1, title: "First Post", content: "Hello World" },
+  { id: 2, title: "Second Post", content: "Jen.js is awesome" },
+];
+export default async function handler(req, res) {
+  if (req.method === "GET") {
+    // Get all posts
+    res.status(200).json({ data: posts });
+  } else if (req.method === "POST") {
+    // Create new post
+    const { title, content } = req.body;
+    if (!title || !content) {
+      return res.status(400).json({ error: "Missing title or content" });
+    }
+    const newPost = {
+      id: posts.length + 1,
+      title,
+      content,
+    };
+    posts.push(newPost);
+    res.status(201).json({ data: newPost });
+  } else {
+    res.status(405).json({ error: "Method not allowed" });
+  }
+}
+// Optional configuration
+export const config = {
+  maxDuration: 30,
+  bodyParser: {
+    sizeLimit: "1mb",
+  },
+};

package/templates/static/lib/api/examples/search.js

@@ -0,0 +1,23 @@
+/**
+ * Example API Route: GET /api/search
+ *
+ * Example showing query parameter handling
+ */
+export default async function handler(req, res) {
+  const { q, limit = "10" } = req.query;
+  if (!q) {
+    return res.status(400).json({ error: "Missing search query parameter" });
+  }
+  const limitNum = Math.min(parseInt(String(limit), 10) || 10, 100);
+  // Simulate search results
+  const results = [
+    { id: 1, title: `Result for "${q}"`, relevance: 0.95 },
+    { id: 2, title: `Another match for "${q}"`, relevance: 0.85 },
+    { id: 3, title: `Third result`, relevance: 0.72 },
+  ].slice(0, limitNum);
+  res.status(200).json({
+    query: q,
+    count: results.length,
+    results,
+  });
+}

package/templates/static/lib/api/index.js

@@ -0,0 +1,41 @@
+/**
+ * Jen.js API Routes System
+ *
+ * File-based API routing system inspired by Next.js API Routes.
+ * All files in the `api/` directory are automatically mapped to `/api/*` routes.
+ *
+ * @example
+ * ```
+ * Directory structure:
+ * src/api/
+ *   hello.ts              -> GET /api/hello
+ *   posts.ts              -> GET|POST /api/posts
+ *   posts/[id].ts         -> GET /api/posts/123
+ *   files/[...slug].ts    -> GET /api/files/a/b/c
+ *   admin/[[...path]].ts  -> GET /api/admin or /api/admin/a/b
+ * ```
+ *
+ * @example Usage in handler
+ * ```ts
+ * // src/api/hello.ts
+ * import type { ApiRequest, ApiResponse } from '../api';
+ *
+ * export default function handler(req: ApiRequest, res: ApiResponse) {
+ *   res.status(200).json({ message: 'Hello from Jen.js!' });
+ * }
+ *
+ * // Optional config
+ * export const config = {
+ *   maxDuration: 60,
+ *   bodyParser: { sizeLimit: '10mb' }
+ * };
+ * ```
+ */
+export {
+  ApiRouter,
+  parseQuery,
+  parseCookies,
+  createApiRequest,
+  createApiResponse,
+} from "./router";
+export { ApiLoader, createApiMiddleware } from "./loader";