cosmolo 0.4.0 → 0.5.0

package/README.md

@@ -54,7 +54,7 @@ bun generate:article
 bun dev
 ```
 
-`cosmolo init` asks two questions — which mode (full UI or server-only) and which adapter (SSG or serverless) — then copies the appropriate route files into your project.
+`cosmolo init` asks two questions — which mode (Full or Slim) and which adapter (SSG, Cloudflare, or Serverless) — then copies the appropriate route files into your project.
 
 ---
 
@@ -273,6 +273,49 @@ Prompts for key (slug), label, and description. Appends the new entry to `config
 
 ---
 
+## Cloudflare
+
+Cosmolo works with any SvelteKit-compatible deployment platform, but it is purpose-built
+around the Cloudflare stack. SvelteKit and Cloudflare Workers are an unusually good fit —
+edge-native rendering, zero cold starts, globally distributed infrastructure, and a generous
+free tier. Cosmolo's CLI removes the usual setup friction so you can go from `init` to
+deployed in minutes.
+
+### One-command Cloudflare setup
+
+```bash
+bunx cosmolo init   # choose "Cloudflare" when prompted for adapter
+```
+
+This single command generates everything needed to deploy:
+
+| Generated file | Purpose |
+|---|---|
+| `svelte.config.js` | Pre-configured with `adapter-cloudflare` |
+| `wrangler.toml` | Project name, `nodejs_compat`, D1 template commented out |
+| `src/app.d.ts` | `App.Platform` with `Env`, `CfProperties`, `ExecutionContext` |
+| `.github/workflows/deploy.yml` | Optional — push-to-`main` deploy via `wrangler-action` |
+
+After init, two commands to go live:
+
+```bash
+bun install && bun add -D @sveltejs/adapter-cloudflare @cloudflare/workers-types
+bun run deploy   # bun run build + wrangler pages deploy
+```
+
+If you opted in to GitHub Actions during init, pushing to `main` triggers the deploy automatically.
+
+### Cloudflare services
+
+| Command | What it sets up |
+|---|---|
+| `cosmolo migrate:db` → option 3 | **D1** — Drizzle schema, CRUD helpers (`getArticlesByCategory`, `getArticlesByTag`, …), D1-backed `+page.server.ts` route files |
+| `cosmolo setup:r2` | **R2** — `wrangler.toml` binding, `src/lib/r2.ts` helper, `/assets/[...key]` edge serving route |
+
+Each command is self-contained — run only the ones you need.
+
+---
+
 ## Database Migration
 
 When a file-based Cosmolo site outgrows Markdown — multiple writers, mobile editing,
@@ -305,12 +348,22 @@ The command is interactive and offers three paths:
 After a preflight check (drizzle installed, wrangler.toml, table conflicts), the following files are generated:
 
 ```
-drizzle/schema.ts            ← Drizzle schema for articles and categories tables
-src/lib/db/articles.ts       ← getArticles, getArticle, createArticle, updateArticle, deleteArticle
-src/lib/db/categories.ts     ← getCategories, getCategory, createCategory, updateCategory, deleteCategory
-wrangler.toml                ← [[d1_databases]] binding added (merged if file exists)
-drizzle.config.ts            ← drizzle-kit config (dialect: sqlite)
-.dev.vars.example            ← Cloudflare environment variable reference
+drizzle/schema.ts                            ← Drizzle schema for articles and categories tables
+src/lib/db/articles.ts                       ← getArticles, getArticlesByCategory, getArticlesByTag,
+                                               getArticle, parseArticle, createArticle, updateArticle, deleteArticle
+src/lib/db/categories.ts                     ← getCategories, getCategory, createCategory, updateCategory, deleteCategory
+wrangler.toml                                ← [[d1_databases]] binding added (merged if file exists)
+drizzle.config.ts                            ← drizzle-kit config (dialect: sqlite)
+.dev.vars.example                            ← Cloudflare environment variable reference
+```
+
+Optionally (prompted during setup), the existing `+page.server.ts` route files are replaced with D1-backed versions that read from `platform.env.DB` instead of the Cosmolo virtual module:
+
+```
+src/routes/+page.server.ts                   ← Home page — getArticles + getCategories from D1
+src/routes/articles/[slug]/+page.server.ts   ← Article — getArticle from D1, Markdown rendered with marked
+src/routes/categories/[slug]/+page.server.ts ← Category — getArticlesByCategory from D1
+src/routes/tags/[tag]/+page.server.ts        ← Tag — getArticlesByTag from D1 (json_each query)
 ```
 
 The command prints step-by-step instructions after generation:
@@ -338,6 +391,42 @@ The upside: content edits take effect immediately — no rebuild or redeploy nee
 
 ---
 
+## R2 Asset Storage
+
+Add Cloudflare R2 object storage for article images and other binary assets:
+
+```bash
+bunx cosmolo setup:r2
+```
+
+The command asks for a bucket name and binding name, then generates:
+
+```
+src/lib/r2.ts                          ← getR2Asset(bucket, key) helper
+src/routes/assets/[...key]/+server.ts  ← Edge route — serves files directly from R2
+wrangler.toml                          ← [[r2_buckets]] binding appended
+```
+
+After setup:
+
+```bash
+# 1. Create the bucket
+bunx wrangler r2 bucket create <bucket-name>
+
+# 2. Upload an asset
+bunx wrangler r2 object put <bucket-name>/images/photo.jpg --file ./static/images/photo.jpg
+
+# 3. Reference it in templates as /assets/images/photo.jpg
+```
+
+Add the binding type to `src/app.d.ts` (one line):
+
+```ts
+interface Platform { env: { ASSETS: R2Bucket } }
+```
+
+---
+
 ## Headless CMS
 
 Cosmolo can expose your content as static JSON endpoints, making it usable as a
@@ -391,7 +480,7 @@ bun add -D vite @sveltejs/kit
 **1. Create `cosmolo.config.ts`** in your project root
 
 ```typescript
-import { resolveConfig } from 'cosmolo';
+import { resolveConfig } from 'cosmolo/plugin';
 
 export default resolveConfig({
   articlesDir: 'src/content/articles',    // default
@@ -439,10 +528,11 @@ The command asks two questions:
 
 **Adapter**
 
-| Adapter | Effect |
+| Adapter | Generated files |
 |---|---|
-| **SSG** (`adapter-static`) | Also creates `src/routes/+layout.ts` with `export const prerender = true` |
-| **Serverless / SSR** | No layout file — routes render on demand |
+| **SSG** (`adapter-static`) | `svelte.config.js` (adapter-static) + `src/routes/+layout.ts` (`prerender = true`) |
+| **Cloudflare** (`adapter-cloudflare`) | `svelte.config.js` (adapter-cloudflare) + `wrangler.toml` + `src/app.d.ts` (`Platform` type). Optionally `.github/workflows/deploy.yml`. |
+| **Serverless** | No extra files — bring your own adapter (Vercel, Node, etc.) |
 
 If any target file already exists, the command lists every conflict and exits without
 writing anything.

package/dist/cli/index.js

@@ -10,15 +10,19 @@ switch (cmd) {
     case 'migrate:db':
         await (await import('./migrate.js')).main();
         break;
+    case 'setup:r2':
+        await (await import('./setup/r2.js')).main();
+        break;
     default: {
         const isUnknown = Boolean(cmd);
         if (isUnknown)
             console.error(`Unknown command: ${cmd}\n`);
         console.log('Usage: cosmolo <command>\n');
         console.log('Commands:');
-        console.log('  init                             Scaffold routes into an existing SvelteKit project');
+        console.log('  init                             Scaffold routes and config into a SvelteKit project');
         console.log('  generate [article|page|category] Create content files');
-        console.log('  migrate:db                       Migrate content to a database');
+        console.log('  migrate:db                       Migrate file-based content to a database (D1)');
+        console.log('  setup:r2                         Add Cloudflare R2 bucket for asset storage');
         process.exit(isUnknown ? 1 : 0);
     }
 }

package/dist/cli/init.js

@@ -36,7 +36,21 @@ function destPath(relativePath, projectRoot) {
         .replace(/^lib\//, 'src/lib/');
     return path.join(projectRoot, mapped);
 }
-function injectPackageScripts(projectRoot) {
+function readProjectName(projectRoot) {
+    const pkgPath = path.join(projectRoot, 'package.json');
+    if (fs.existsSync(pkgPath)) {
+        try {
+            const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+            if (typeof pkg.name === 'string' && pkg.name)
+                return pkg.name;
+        }
+        catch {
+            // fall through
+        }
+    }
+    return 'my-cosmolo-site';
+}
+function injectPackageScripts(projectRoot, adapter) {
     const pkgPath = path.join(projectRoot, 'package.json');
     if (!fs.existsSync(pkgPath))
         return;
@@ -49,6 +63,9 @@ function injectPackageScripts(projectRoot) {
         'generate:page': 'cosmolo generate page',
         'generate:category': 'cosmolo generate category',
     };
+    if (adapter === 'cloudflare') {
+        scripts['deploy'] = 'bun run build && bunx wrangler pages deploy .svelte-kit/cloudflare';
+    }
     for (const [key, val] of Object.entries(scripts)) {
         if (!pkg.scripts[key]) {
             pkg.scripts[key] = val;
@@ -64,6 +81,40 @@ function injectPackageScripts(projectRoot) {
         console.log('  updated  package.json (added cosmolo dependency + generate:* scripts)');
     }
 }
+function svelteConfigContent(adapter) {
+    const pkg = adapter === 'ssg' ? '@sveltejs/adapter-static' : '@sveltejs/adapter-cloudflare';
+    return (`import adapter from '${pkg}';\n` +
+        `import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n` +
+        `/** @type {import('@sveltejs/kit').Config} */\n` +
+        `const config = {\n` +
+        `\tpreprocess: vitePreprocess(),\n` +
+        `\tkit: {\n` +
+        `\t\tadapter: adapter(),\n` +
+        `\t},\n` +
+        `};\n\n` +
+        `export default config;\n`);
+}
+function githubActionsContent(projectName) {
+    return (`name: Deploy to Cloudflare Pages\n\n` +
+        `on:\n` +
+        `  push:\n` +
+        `    branches: [main]\n\n` +
+        `jobs:\n` +
+        `  deploy:\n` +
+        `    runs-on: ubuntu-latest\n` +
+        `    permissions:\n` +
+        `      contents: read\n` +
+        `      deployments: write\n` +
+        `    steps:\n` +
+        `      - uses: actions/checkout@v4\n` +
+        `      - uses: oven-sh/setup-bun@v2\n` +
+        `      - run: bun install --frozen-lockfile\n` +
+        `      - run: bun run build\n` +
+        `      - uses: cloudflare/wrangler-action@v3\n` +
+        `        with:\n` +
+        `          apiToken: \${{ secrets.CF_API_TOKEN }}\n` +
+        `          command: pages deploy .svelte-kit/cloudflare --project-name=${projectName}\n`);
+}
 // ─── main ─────────────────────────────────────────────────────────────────────
 export async function main() {
     const PROJECT_ROOT = process.cwd();
@@ -82,15 +133,16 @@ export async function main() {
     const mode = modeRaw === '1' ? 'full' : 'slim';
     // ── Adapter selection ───────────────────────────────────────────────────
     console.log('\nChoose your deployment adapter:\n');
-    console.log('  1) SSG              — @sveltejs/adapter-static (Cloudflare Pages static, GitHub Pages, etc.)');
-    console.log('  2) Serverless/SSR   — Cloudflare Workers, Vercel, Node, etc.\n');
+    console.log('  1) SSG         — @sveltejs/adapter-static (GitHub Pages, Cloudflare Pages static, etc.)');
+    console.log('  2) Cloudflare  — @sveltejs/adapter-cloudflare (Workers / Pages SSR)');
+    console.log('  3) Serverless  — Vercel, Node, etc.\n');
     let adapterRaw = '';
-    while (!['1', '2'].includes(adapterRaw)) {
-        adapterRaw = (await ask(rl, 'Adapter [1/2]: ')).trim();
-        if (!['1', '2'].includes(adapterRaw))
-            console.log('  Please enter 1 or 2.');
+    while (!['1', '2', '3'].includes(adapterRaw)) {
+        adapterRaw = (await ask(rl, 'Adapter [1/2/3]: ')).trim();
+        if (!['1', '2', '3'].includes(adapterRaw))
+            console.log('  Please enter 1, 2, or 3.');
     }
-    const isSSG = adapterRaw === '1';
+    const adapter = adapterRaw === '1' ? 'ssg' : adapterRaw === '2' ? 'cloudflare' : 'serverless';
     // ── Collect files ───────────────────────────────────────────────────────
     const sharedFiles = collectFiles(path.join(TEMPLATE_DIR, 'shared'));
     const fullFiles = mode === 'full' ? collectFiles(path.join(TEMPLATE_DIR, 'full')) : [];
@@ -100,6 +152,16 @@ export async function main() {
     ];
     const layoutTsPath = path.join(PROJECT_ROOT, 'src/routes/+layout.ts');
     const layoutTsContent = 'export const prerender = true;\n';
+    const wranglerTomlPath = path.join(PROJECT_ROOT, 'wrangler.toml');
+    const appDtsPath = path.join(PROJECT_ROOT, 'src/app.d.ts');
+    const svelteConfigPath = path.join(PROJECT_ROOT, 'svelte.config.js');
+    const ghaWorkflowPath = path.join(PROJECT_ROOT, '.github', 'workflows', 'deploy.yml');
+    // ── GitHub Actions prompt (Cloudflare only, before conflict detection) ──
+    let generateGha = false;
+    if (adapter === 'cloudflare') {
+        const ans = (await ask(rl, '\nGenerate GitHub Actions deploy workflow? [y/N]: ')).toLowerCase();
+        generateGha = ans === 'y';
+    }
     // ── Conflict detection ──────────────────────────────────────────────────
     const conflicts = [];
     for (const [, rel] of allFiles) {
@@ -107,8 +169,21 @@ export async function main() {
         if (fs.existsSync(dest))
             conflicts.push(path.relative(PROJECT_ROOT, dest));
     }
-    if (isSSG && fs.existsSync(layoutTsPath)) {
-        conflicts.push(path.relative(PROJECT_ROOT, layoutTsPath));
+    if (adapter === 'ssg') {
+        if (fs.existsSync(layoutTsPath))
+            conflicts.push(path.relative(PROJECT_ROOT, layoutTsPath));
+        if (fs.existsSync(svelteConfigPath))
+            conflicts.push('svelte.config.js');
+    }
+    if (adapter === 'cloudflare') {
+        if (fs.existsSync(wranglerTomlPath))
+            conflicts.push('wrangler.toml');
+        if (fs.existsSync(appDtsPath))
+            conflicts.push('src/app.d.ts');
+        if (fs.existsSync(svelteConfigPath))
+            conflicts.push('svelte.config.js');
+        if (generateGha && fs.existsSync(ghaWorkflowPath))
+            conflicts.push('.github/workflows/deploy.yml');
     }
     if (conflicts.length > 0) {
         console.log('\nThe following files already exist:\n');
@@ -133,27 +208,104 @@ export async function main() {
         copyFile(src, dest);
         console.log(`  created  ${path.relative(PROJECT_ROOT, dest)}`);
     }
-    if (isSSG) {
+    if (adapter === 'ssg') {
         writeFile(layoutTsPath, layoutTsContent);
         console.log(`  created  src/routes/+layout.ts`);
+        writeFile(svelteConfigPath, svelteConfigContent('ssg'));
+        console.log(`  created  svelte.config.js`);
     }
-    injectPackageScripts(PROJECT_ROOT);
+    if (adapter === 'cloudflare') {
+        writeFile(svelteConfigPath, svelteConfigContent('cloudflare'));
+        console.log(`  created  svelte.config.js`);
+        const projectName = readProjectName(PROJECT_ROOT);
+        const wranglerToml = [
+            `name = "${projectName}"`,
+            `compatibility_date = "${new Date().toISOString().slice(0, 10)}"`,
+            `compatibility_flags = ["nodejs_compat"]`,
+            ``,
+            `# Uncomment to add Cloudflare D1 (run: bunx cosmolo migrate:db)`,
+            `# [[d1_databases]]`,
+            `# binding = "DB"`,
+            `# database_name = "${projectName}-db"`,
+            `# database_id   = ""  # fill in after: bunx wrangler d1 create ${projectName}-db`,
+        ].join('\n') + '\n';
+        writeFile(wranglerTomlPath, wranglerToml);
+        console.log(`  created  wrangler.toml`);
+        const appDts = [
+            `// See https://svelte.dev/docs/kit/types#app.d.ts`,
+            `// Install @cloudflare/workers-types for full type support:`,
+            `//   bun add -D @cloudflare/workers-types`,
+            `declare global {`,
+            `\tnamespace App {`,
+            `\t\tinterface Platform {`,
+            `\t\t\tenv: Env;`,
+            `\t\t\tcf: CfProperties;`,
+            `\t\t\tctx: ExecutionContext;`,
+            `\t\t}`,
+            `\t}`,
+            `}`,
+            ``,
+            `export {};`,
+        ].join('\n') + '\n';
+        writeFile(appDtsPath, appDts);
+        console.log(`  created  src/app.d.ts`);
+        if (generateGha) {
+            writeFile(ghaWorkflowPath, githubActionsContent(projectName));
+            console.log(`  created  .github/workflows/deploy.yml`);
+        }
+    }
+    injectPackageScripts(PROJECT_ROOT, adapter);
     // ── Next steps ──────────────────────────────────────────────────────────
     console.log('\nDone! Next steps:\n');
     console.log('  1. Run:              bun install');
-    if (isSSG) {
+    if (adapter === 'ssg') {
         console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-static');
+        if (mode === 'full') {
+            console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+            console.log('  4. Run:              bun dev');
+        }
+        else {
+            console.log('  3. Add your own +page.svelte files for each route.');
+            console.log('  4. Run:              bun dev');
+        }
     }
-    else {
-        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-cloudflare  (or your adapter)');
-    }
-    if (mode === 'full') {
-        console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
-        console.log('  4. Run:              bun dev');
+    else if (adapter === 'cloudflare') {
+        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-cloudflare');
+        console.log('  3. Install types:    bun add -D @cloudflare/workers-types');
+        if (generateGha) {
+            console.log('  4. Add secret to GitHub repo:  CF_API_TOKEN  (Cloudflare API token)');
+            if (mode === 'full') {
+                console.log('  5. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+                console.log('  6. Push to main — GitHub Actions will build and deploy automatically.');
+            }
+            else {
+                console.log('  5. Add your own +page.svelte files for each route.');
+                console.log('  6. Push to main — GitHub Actions will build and deploy automatically.');
+            }
+        }
+        else {
+            if (mode === 'full') {
+                console.log('  4. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+                console.log('  5. Run:              bunx wrangler dev  (or bun dev for local Vite)');
+                console.log('  6. Deploy:           bun run deploy');
+            }
+            else {
+                console.log('  4. Add your own +page.svelte files for each route.');
+                console.log('  5. Run:              bunx wrangler dev  (or bun dev for local Vite)');
+                console.log('  6. Deploy:           bun run deploy');
+            }
+        }
     }
     else {
-        console.log('  3. Add your own +page.svelte files for each route.');
-        console.log('  4. Run:              bun dev');
+        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-vercel  (or your adapter)');
+        if (mode === 'full') {
+            console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+            console.log('  4. Run:              bun dev');
+        }
+        else {
+            console.log('  3. Add your own +page.svelte files for each route.');
+            console.log('  4. Run:              bun dev');
+        }
     }
     console.log('\n  See https://github.com/alcogy/cosmolo for full documentation.\n');
 }

package/dist/cli/migrate/drizzle-setup.js

@@ -38,13 +38,21 @@ function generateDrizzleSchema() {
 // ─── CRUD file generation ─────────────────────────────────────────────────────
 function generateArticlesCrud() {
     return `import { drizzle } from 'drizzle-orm/d1';
-import { desc, eq } from 'drizzle-orm';
+import { and, desc, eq, sql } from 'drizzle-orm';
 import { articles } from '../../drizzle/schema';
 
 export function createDb(d1: D1Database) {
   return drizzle(d1);
 }
 
+export function parseArticle<T extends { tags: string | null; related: string | null }>(row: T) {
+  return {
+    ...row,
+    tags: JSON.parse(row.tags ?? '[]') as string[],
+    related: JSON.parse(row.related ?? '[]') as string[],
+  };
+}
+
 export async function getArticles(d1: D1Database) {
   return createDb(d1)
     .select()
@@ -53,6 +61,27 @@ export async function getArticles(d1: D1Database) {
     .orderBy(desc(articles.sort));
 }
 
+export async function getArticlesByCategory(d1: D1Database, category: string) {
+  return createDb(d1)
+    .select()
+    .from(articles)
+    .where(and(eq(articles.draft, 0), eq(articles.category, category)))
+    .orderBy(desc(articles.sort));
+}
+
+export async function getArticlesByTag(d1: D1Database, tag: string) {
+  return createDb(d1)
+    .select()
+    .from(articles)
+    .where(
+      and(
+        eq(articles.draft, 0),
+        sql\`EXISTS (SELECT 1 FROM json_each(\${articles.tags}) WHERE value = \${tag})\`
+      )
+    )
+    .orderBy(desc(articles.sort));
+}
+
 export async function getArticle(d1: D1Database, slug: string) {
   const [row] = await createDb(d1).select().from(articles).where(eq(articles.slug, slug));
   return row ?? null;
@@ -110,6 +139,81 @@ export async function deleteCategory(d1: D1Database, key: string) {
 }
 `;
 }
+// ─── Route file generation ────────────────────────────────────────────────────
+function generateHomeRoute() {
+    return `import type { PageServerLoad } from './$types';
+import { getArticles, parseArticle } from '$lib/db/articles';
+import { getCategories } from '$lib/db/categories';
+import siteConfig from '../../config/site.json';
+
+export const load: PageServerLoad = async ({ platform }) => {
+  const db = platform!.env.DB;
+  const [rawArticles, categories] = await Promise.all([getArticles(db), getCategories(db)]);
+  return {
+    articles: rawArticles.map(parseArticle),
+    categories,
+    articlesPerPage: siteConfig.articlesPerPage ?? 10,
+  };
+};
+`;
+}
+function generateArticleRoute() {
+    return `import type { PageServerLoad } from './$types';
+import { error } from '@sveltejs/kit';
+import { marked } from 'marked';
+import { getArticle, parseArticle } from '$lib/db/articles';
+import { getCategories } from '$lib/db/categories';
+
+export const load: PageServerLoad = async ({ params, platform }) => {
+  const db = platform!.env.DB;
+  const [raw, categories] = await Promise.all([getArticle(db, params.slug), getCategories(db)]);
+  if (!raw) error(404, 'Article not found');
+  const article = {
+    ...parseArticle(raw),
+    body: await marked(raw.body ?? ''),
+  };
+  return { article, categories };
+};
+`;
+}
+function generateCategoryRoute() {
+    return `import type { PageServerLoad } from './$types';
+import { error } from '@sveltejs/kit';
+import { getArticlesByCategory, parseArticle } from '$lib/db/articles';
+import { getCategory } from '$lib/db/categories';
+import siteConfig from '../../../../config/site.json';
+
+export const load: PageServerLoad = async ({ params, platform }) => {
+  const db = platform!.env.DB;
+  const [rawArticles, category] = await Promise.all([
+    getArticlesByCategory(db, params.slug),
+    getCategory(db, params.slug),
+  ]);
+  if (!category) error(404, 'Category not found');
+  return {
+    articles: rawArticles.map(parseArticle),
+    category,
+    articlesPerPage: siteConfig.articlesPerPage ?? 10,
+  };
+};
+`;
+}
+function generateTagRoute() {
+    return `import type { PageServerLoad } from './$types';
+import { getArticlesByTag, parseArticle } from '$lib/db/articles';
+import siteConfig from '../../../../config/site.json';
+
+export const load: PageServerLoad = async ({ params, platform }) => {
+  const db = platform!.env.DB;
+  const rawArticles = await getArticlesByTag(db, params.tag);
+  return {
+    articles: rawArticles.map(parseArticle),
+    tag: params.tag,
+    articlesPerPage: siteConfig.articlesPerPage ?? 10,
+  };
+};
+`;
+}
 function generateDrizzleConfig() {
     return `import type { Config } from 'drizzle-kit';
 
@@ -208,7 +312,25 @@ async function preflight(root, rl) {
     }
     // D1 database name
     const dbName = await ask(rl, 'D1 database name', 'cosmolo');
-    return { dbName };
+    // Generate D1-backed routes?
+    const routePaths = [
+        path.join('src', 'routes', '+page.server.ts'),
+        path.join('src', 'routes', 'articles', '[slug]', '+page.server.ts'),
+        path.join('src', 'routes', 'categories', '[slug]', '+page.server.ts'),
+        path.join('src', 'routes', 'tags', '[tag]', '+page.server.ts'),
+    ];
+    const existingRoutes = routePaths.filter((p) => fs.existsSync(path.join(root, p)));
+    let generateRoutes = true;
+    if (existingRoutes.length > 0) {
+        console.log(`\n  The following route files will be replaced with D1-backed versions:`);
+        for (const p of existingRoutes)
+            console.log(`    ${p}`);
+        generateRoutes = await confirm(rl, 'Replace with D1-backed route files?');
+    }
+    else {
+        generateRoutes = await confirm(rl, 'Generate D1-backed route files?');
+    }
+    return { dbName, generateRoutes };
 }
 // ─── main ─────────────────────────────────────────────────────────────────────
 export async function drizzleSetup(_config) {
@@ -218,7 +340,7 @@ export async function drizzleSetup(_config) {
     rl.close();
     if (!result)
         return;
-    const { dbName } = result;
+    const { dbName, generateRoutes } = result;
     // Generate drizzle/schema.ts
     const drizzleDir = path.join(root, 'drizzle');
     fs.mkdirSync(drizzleDir, { recursive: true });
@@ -236,6 +358,20 @@ export async function drizzleSetup(_config) {
     }
     // wrangler.toml
     const wranglerAction = updateWranglerToml(root, dbName);
+    // D1-backed route files
+    if (generateRoutes) {
+        const routesDir = path.join(root, 'src', 'routes');
+        const routeFiles = [
+            [path.join(routesDir, '+page.server.ts'), generateHomeRoute()],
+            [path.join(routesDir, 'articles', '[slug]', '+page.server.ts'), generateArticleRoute()],
+            [path.join(routesDir, 'categories', '[slug]', '+page.server.ts'), generateCategoryRoute()],
+            [path.join(routesDir, 'tags', '[tag]', '+page.server.ts'), generateTagRoute()],
+        ];
+        for (const [filePath, content] of routeFiles) {
+            fs.mkdirSync(path.dirname(filePath), { recursive: true });
+            fs.writeFileSync(filePath, content);
+        }
+    }
     console.log('\n✓ Files generated:');
     console.log('  drizzle/schema.ts');
     console.log('  src/lib/db/articles.ts');
@@ -243,21 +379,33 @@ export async function drizzleSetup(_config) {
     console.log('  drizzle.config.ts');
     console.log('  .dev.vars.example');
     console.log(`  wrangler.toml  (${wranglerAction})`);
+    if (generateRoutes) {
+        console.log('  src/routes/+page.server.ts');
+        console.log('  src/routes/articles/[slug]/+page.server.ts');
+        console.log('  src/routes/categories/[slug]/+page.server.ts');
+        console.log('  src/routes/tags/[tag]/+page.server.ts');
+    }
+    let step = 1;
     console.log('\nNext steps:\n');
-    console.log(`  1. Create the D1 database (if not done yet):`);
+    console.log(`  ${step++}. Create the D1 database (if not done yet):`);
     console.log(`       bunx wrangler d1 create ${dbName}`);
     console.log(`     Copy the database_id into wrangler.toml.\n`);
-    console.log(`  2. Generate migration files:`);
+    console.log(`  ${step++}. Generate migration files:`);
     console.log(`       bunx drizzle-kit generate\n`);
-    console.log(`  3. Apply migrations locally:`);
+    console.log(`  ${step++}. Apply migrations locally:`);
     console.log(`       bunx wrangler d1 migrations apply ${dbName} --local\n`);
-    console.log(`  4. Seed content from Markdown files:`);
+    console.log(`  ${step++}. Seed content from Markdown files:`);
     console.log(`       bunx cosmolo migrate:db  → choose Option 1 to export SQL`);
     console.log(`       bunx wrangler d1 execute ${dbName} --local --file=cosmolo-migration/002_seed_categories.sql`);
     console.log(`       bunx wrangler d1 execute ${dbName} --local --file=cosmolo-migration/003_seed_articles.sql\n`);
-    console.log(`  5. Install Cloudflare Workers types for TypeScript:`);
+    if (generateRoutes) {
+        console.log(`  ${step++}. Install marked for Markdown rendering in routes:`);
+        console.log(`       bun add marked\n`);
+    }
+    console.log(`  ${step++}. Install Cloudflare Workers types for TypeScript:`);
     console.log(`       bun add -d @cloudflare/workers-types\n`);
-    console.log(`  6. Add D1Database to src/app.d.ts:`);
+    console.log(`  ${step++}. Ensure src/app.d.ts declares the DB binding:`);
     console.log(`       interface Platform { env: { DB: D1Database } }`);
-    console.log(`\n  See docs/DB_MIGRATION.md for full details.`);
+    console.log(`       (cosmolo init --cloudflare does this automatically)\n`);
+    console.log(`  See docs/DB_MIGRATION.md for full details.`);
 }

package/dist/cli/setup/r2.d.ts

@@ -0,0 +1 @@
+export declare function main(): Promise<void>;

package/dist/cli/setup/r2.js

@@ -0,0 +1,90 @@
+import * as fs from 'fs';
+import * as path from 'path';
+import * as readline from 'readline';
+function ask(rl, question, fallback = '') {
+    const hint = fallback ? ` [${fallback}]` : '';
+    return new Promise((resolve) => rl.question(`  ${question}${hint}: `, (ans) => resolve(ans.trim() || fallback)));
+}
+function r2HelperContent() {
+    return (`// Helper for serving assets stored in Cloudflare R2.\n` +
+        `// Usage: import in a +server.ts route and call getR2Asset.\n\n` +
+        `export async function getR2Asset(bucket: R2Bucket, key: string): Promise<Response> {\n` +
+        `  const obj = await bucket.get(key);\n` +
+        `  if (!obj) return new Response('Not found', { status: 404 });\n` +
+        `  const headers = new Headers();\n` +
+        `  obj.writeHttpMetadata(headers);\n` +
+        `  headers.set('etag', obj.httpEtag);\n` +
+        `  headers.set('cache-control', 'public, max-age=31536000, immutable');\n` +
+        `  return new Response(obj.body as ReadableStream, { headers });\n` +
+        `}\n`);
+}
+function r2RouteContent(binding) {
+    return (`import type { RequestHandler } from './$types';\n` +
+        `import { getR2Asset } from '$lib/r2';\n\n` +
+        `export const GET: RequestHandler = async ({ params, platform }) => {\n` +
+        `  return getR2Asset(platform!.env.${binding}, params.key);\n` +
+        `};\n`);
+}
+function appendR2Binding(wranglerPath, binding, bucketName) {
+    const existing = fs.readFileSync(wranglerPath, 'utf-8');
+    const section = `\n[[r2_buckets]]\n` +
+        `binding = "${binding}"\n` +
+        `bucket_name = "${bucketName}"\n`;
+    fs.writeFileSync(wranglerPath, existing + section);
+}
+export async function main() {
+    const root = process.cwd();
+    const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
+    console.log('\ncosmolo setup:r2\n');
+    // wrangler.toml check
+    const wranglerPath = path.join(root, 'wrangler.toml');
+    if (!fs.existsSync(wranglerPath)) {
+        console.error('  wrangler.toml not found.\n' +
+            '  Run `cosmolo init` with the Cloudflare adapter first.\n');
+        rl.close();
+        process.exit(1);
+    }
+    const bucketName = await ask(rl, 'R2 bucket name', 'assets');
+    const binding = await ask(rl, 'Binding name (used in platform.env.*)', 'ASSETS');
+    // Conflict checks
+    const helperPath = path.join(root, 'src', 'lib', 'r2.ts');
+    const routePath = path.join(root, 'src', 'routes', 'assets', '[...key]', '+server.ts');
+    const conflicts = [];
+    if (fs.existsSync(helperPath))
+        conflicts.push('src/lib/r2.ts');
+    if (fs.existsSync(routePath))
+        conflicts.push('src/routes/assets/[...key]/+server.ts');
+    if (conflicts.length > 0) {
+        console.log('\n  The following files already exist:');
+        for (const f of conflicts)
+            console.log(`    ${f}`);
+        const ans = await new Promise((resolve) => rl.question('\n  Overwrite? [y/N]: ', (a) => resolve(a.trim().toLowerCase() || 'n')));
+        if (ans !== 'y') {
+            console.log('\n  Aborted. No files were written.\n');
+            rl.close();
+            process.exit(0);
+        }
+    }
+    rl.close();
+    // Write helper
+    fs.mkdirSync(path.dirname(helperPath), { recursive: true });
+    fs.writeFileSync(helperPath, r2HelperContent());
+    // Write route
+    fs.mkdirSync(path.dirname(routePath), { recursive: true });
+    fs.writeFileSync(routePath, r2RouteContent(binding));
+    // Update wrangler.toml
+    appendR2Binding(wranglerPath, binding, bucketName);
+    console.log('\n✓ Files generated:');
+    console.log('  src/lib/r2.ts');
+    console.log('  src/routes/assets/[...key]/+server.ts');
+    console.log('  wrangler.toml  (r2_buckets appended)');
+    console.log('\nNext steps:\n');
+    console.log(`  1. Create the R2 bucket (if not done yet):`);
+    console.log(`       bunx wrangler r2 bucket create ${bucketName}\n`);
+    console.log(`  2. Add the binding to src/app.d.ts:`);
+    console.log(`       interface Platform { env: { ${binding}: R2Bucket } }\n`);
+    console.log(`  3. Upload assets (e.g. from static/images/):`);
+    console.log(`       bunx wrangler r2 object put ${bucketName}/<key> --file <path>\n`);
+    console.log(`  4. Reference assets via /assets/<key> in your templates.\n`);
+    console.log(`  See https://developers.cloudflare.com/r2/ for full R2 docs.`);
+}

package/dist/markdown.js

@@ -7,6 +7,9 @@ function slugifyHeading(text) {
         .trim()
         .replace(/\s+/g, '-');
 }
+function escapeAttr(val) {
+    return val.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
 marked.use({
     extensions: [
         {
@@ -22,7 +25,8 @@ marked.use({
             },
             renderer(token) {
                 const { videoId } = token;
-                return `<div class="youtube-embed"><iframe src="https://www.youtube.com/embed/${videoId}" title="YouTube video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>\n`;
+                const safeId = videoId.replace(/[^a-zA-Z0-9_-]/g, '');
+                return `<div class="youtube-embed"><iframe src="https://www.youtube.com/embed/${safeId}" title="YouTube video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>\n`;
             },
         },
     ],
@@ -32,8 +36,8 @@ marked.use({
         link({ href, title, text }) {
             const isExternal = /^https?:\/\//.test(href ?? '');
             const rel = isExternal ? ' target="_blank" rel="noopener noreferrer"' : '';
-            const titleAttr = title ? ` title="${title}"` : '';
-            return `<a href="${href}"${titleAttr}${rel}>${text}</a>`;
+            const titleAttr = title ? ` title="${escapeAttr(title)}"` : '';
+            return `<a href="${escapeAttr(href ?? '')}"${titleAttr}${rel}>${text}</a>`;
         },
         heading({ text, depth }) {
             const id = slugifyHeading(text);

package/dist/types.d.ts

@@ -49,7 +49,4 @@ export interface SiteConfig {
     twitterHandle: string;
     fallbackCategoryLabel: string;
     articlesPerPage: number;
-    ogImage: {
-        mode: 'static' | 'generated';
-    };
 }

package/package.json

@@ -1,9 +1,9 @@
 {
 	"name": "cosmolo",
-	"version": "0.4.0",
+	"version": "0.5.0",
 	"type": "module",
 	"bin": {
-		"cosmolo": "./dist/cli/index.js"
+		"cosmolo": "dist/cli/index.js"
 	},
 	"exports": {
 		".": {

package/templates/shared/config/site.json

@@ -4,6 +4,5 @@
 	"description": "A content site built with Cosmolo.",
 	"twitterHandle": "@yourhandle",
 	"fallbackCategoryLabel": "Other",
-	"articlesPerPage": 10,
-	"ogImage": { "mode": "static" }
+	"articlesPerPage": 10
 }