@levironexe/architect 0.1.0

package/skills/patterns/supabase.skill.yaml

@@ -0,0 +1,304 @@
+schema_version: "2.0.0"
+id: supabase
+name: "Supabase"
+version: "2.0.0"
+description: "Supabase as a backend — separate server/browser clients via @supabase/ssr, Row Level Security on every table, repository pattern for queries, and realtime subscriptions with cleanup."
+category: pattern
+language: javascript
+frameworks:
+  - supabase
+dependencies:
+  none:
+    - firebase
+    - "@firebase/app"
+    - mongodb
+detection:
+  dependencies:
+    any:
+      - "@supabase/supabase-js"
+      - "@supabase/ssr"
+  source_indicators:
+    - "createClient("
+    - "supabase.from("
+    - "from '@supabase/supabase-js'"
+    - "from '@supabase/ssr'"
+    - "createServerClient"
+    - "createBrowserClient"
+structure:
+  required_dirs:
+    - path: src/lib
+      purpose: "Supabase client factory files — supabase-server.ts for Server Components and API routes (reads session from cookies via @supabase/ssr), supabase-browser.ts for Client Components (createBrowserClient from @supabase/ssr). These two files must exist separately — mixing them causes session errors."
+  recommended_dirs:
+    - path: src/repositories
+      purpose: "Data access layer — one file per Supabase table (e.g., posts.repository.ts) containing all .from('posts') queries for that table. Services import repositories, never call supabase directly. This makes queries testable and keeps DB-specific code out of business logic."
+    - path: supabase
+      purpose: "Supabase project configuration — migrations/ (SQL files generated by supabase migrate), seed.sql (test data), and config.toml (local dev config). Run `supabase db push` to apply migrations."
+separation:
+  rules:
+    - concern: server_client
+      belongs_in: src/lib
+      rule_text: "Create a server-side Supabase client in src/lib/supabase-server.ts using createServerClient from @supabase/ssr. This client reads the auth session from cookies and must be used in Server Components, API routes, and middleware. Call it as a function (not a singleton) so each request gets a fresh cookie snapshot."
+      example: |
+        // src/lib/supabase-server.ts
+        import { createServerClient } from '@supabase/ssr';
+        import { cookies } from 'next/headers';
+        import type { Database } from '@/types/supabase';
+
+        export async function createClient() {
+          const cookieStore = await cookies();
+          return createServerClient<Database>(
+            process.env.NEXT_PUBLIC_SUPABASE_URL!,
+            process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+            {
+              cookies: {
+                getAll: () => cookieStore.getAll(),
+                setAll: (cookiesToSet) => {
+                  cookiesToSet.forEach(({ name, value, options }) =>
+                    cookieStore.set(name, value, options)
+                  );
+                },
+              },
+            }
+          );
+        }
+      indicators:
+        - "createServerClient"
+        - "@supabase/ssr"
+        - "cookies()"
+    - concern: browser_client
+      belongs_in: src/lib
+      rule_text: "Create a browser-side client in src/lib/supabase-browser.ts using createBrowserClient from @supabase/ssr. Export it as a module-level singleton — only one instance per browser page. Never import the browser client in Server Components or API routes; it cannot read server-side session cookies."
+      example: |
+        // src/lib/supabase-browser.ts
+        import { createBrowserClient } from '@supabase/ssr';
+        import type { Database } from '@/types/supabase';
+
+        // Module-level singleton — one client per browser session
+        export const supabase = createBrowserClient<Database>(
+          process.env.NEXT_PUBLIC_SUPABASE_URL!,
+          process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
+        );
+      anti_indicators:
+        - "createBrowserClient"
+    - concern: rls_policies
+      belongs_in: supabase/migrations
+      rule_text: "Enable Row Level Security on every table before writing any queries. Write RLS policies that tie row access to auth.uid() — without policies, authenticated users can read and write each other's data. Use USING clause for SELECT/DELETE, WITH CHECK for INSERT/UPDATE."
+      example: |
+        -- supabase/migrations/[timestamp]_add_rls_policies.sql
+        -- Enable RLS on all tables
+        ALTER TABLE posts ENABLE ROW LEVEL SECURITY;
+        ALTER TABLE comments ENABLE ROW LEVEL SECURITY;
+
+        -- Posts: full CRUD scoped to owner
+        CREATE POLICY "own posts" ON posts
+          FOR ALL
+          USING (auth.uid() = user_id)
+          WITH CHECK (auth.uid() = user_id);
+
+        -- Comments: anyone reads, only owner writes
+        CREATE POLICY "read comments" ON comments
+          FOR SELECT USING (true);
+        CREATE POLICY "own comments" ON comments
+          FOR ALL USING (auth.uid() = user_id);
+      indicators:
+        - "ENABLE ROW LEVEL SECURITY"
+        - "CREATE POLICY"
+        - "auth.uid()"
+        - "USING ("
+    - concern: data_access_layer
+      belongs_in: src/repositories
+      rule_text: "All Supabase queries go in repository files under src/repositories/. Services call repository functions — they never call supabase.from() directly. Repository files import the appropriate client (server or browser) based on where they run. This separation makes queries independently testable."
+      example: |
+        // src/repositories/posts.repository.ts
+        import { createClient } from '@/lib/supabase-server';
+
+        export async function listPostsByUser(userId: string) {
+          const supabase = await createClient();
+          const { data, error } = await supabase
+            .from('posts')
+            .select('id, title, created_at')
+            .eq('user_id', userId)
+            .order('created_at', { ascending: false });
+
+          if (error) throw new Error(`Failed to list posts: ${error.message}`);
+          return data;
+        }
+
+        export async function createPost(userId: string, title: string, content: string) {
+          const supabase = await createClient();
+          const { data, error } = await supabase
+            .from('posts')
+            .insert({ user_id: userId, title, content })
+            .select()
+            .single();
+
+          if (error) throw new Error(`Failed to create post: ${error.message}`);
+          return data;
+        }
+      indicators:
+        - "supabase.from("
+        - ".select("
+        - ".insert("
+        - ".update("
+    - concern: realtime_subscriptions
+      belongs_in: components
+      rule_text: "Set up Realtime subscriptions in useEffect in Client Components and unsubscribe in the cleanup function. A subscription that is not cleaned up leaks a WebSocket connection — in development with strict mode, this happens on every fast refresh."
+      example: |
+        // components/live-posts.tsx — Client Component
+        'use client';
+        import { useEffect, useState } from 'react';
+        import { supabase } from '@/lib/supabase-browser';
+
+        export function LivePosts({ userId }: { userId: string }) {
+          const [posts, setPosts] = useState<Post[]>([]);
+
+          useEffect(() => {
+            const channel = supabase
+              .channel('posts-changes')
+              .on(
+                'postgres_changes',
+                { event: '*', schema: 'public', table: 'posts', filter: `user_id=eq.${userId}` },
+                (payload) => {
+                  if (payload.eventType === 'INSERT') setPosts(prev => [payload.new as Post, ...prev]);
+                  if (payload.eventType === 'DELETE') setPosts(prev => prev.filter(p => p.id !== payload.old.id));
+                }
+              )
+              .subscribe();
+
+            // Cleanup: unsubscribe removes the WebSocket channel
+            return () => { supabase.removeChannel(channel); };
+          }, [userId]);
+
+          return <ul>{posts.map(p => <li key={p.id}>{p.title}</li>)}</ul>;
+        }
+      indicators:
+        - "supabase.channel("
+        - "postgres_changes"
+        - "removeChannel"
+        - ".subscribe()"
+patterns:
+  data_flow:
+    direction: "Client Component → Browser Client → RLS-enforced Query | Server Component → Server Client → RLS-enforced Query"
+    rules:
+      - "Server Components use the server client (createClient from supabase-server.ts) — reads session from cookies."
+      - "Client Components use the browser client (from supabase-browser.ts) — reads session from localStorage."
+      - "Service role key bypasses RLS — only use server-side for admin operations, never in browser code."
+      - "All .from() queries go through repository functions — services and components never call supabase.from() directly."
+      - "RLS is the primary security layer — policies enforce data isolation even if application code has bugs."
+      - "Realtime channels must be cleaned up in useEffect return function to prevent WebSocket leaks."
+  error_handling:
+    recommended: "Always destructure { data, error } from Supabase responses. If error is non-null, throw or return early — never access data when error is present. Log error.message and error.code for debugging. Code 42501 = RLS policy violation."
+  naming:
+    server_client: "src/lib/supabase-server.ts — createClient() factory using createServerClient from @supabase/ssr"
+    browser_client: "src/lib/supabase-browser.ts — singleton using createBrowserClient from @supabase/ssr"
+    repositories: "src/repositories/[resource].repository.ts — all .from('[resource]') queries for one table"
+    types: "src/types/supabase.ts — generated Database type from `supabase gen types typescript`"
+anti_patterns:
+  - id: service_role_in_browser
+    severity: critical
+    description: "Using SUPABASE_SERVICE_ROLE_KEY in browser-accessible code or exposing it via NEXT_PUBLIC_ prefix. The service role key bypasses all RLS policies — any user who obtains it can read, write, or delete any row in any table."
+    bad_example: |
+      // ❌ Service role key in browser — bypasses every RLS policy
+      // Next.js NEXT_PUBLIC_ variables are embedded in client-side JS bundle
+      const supabase = createClient(
+        process.env.NEXT_PUBLIC_SUPABASE_URL!,
+        process.env.NEXT_PUBLIC_SUPABASE_SERVICE_ROLE_KEY! // exposed in browser
+      );
+    good_example: |
+      // ✓ Service role key only in server-side code (no NEXT_PUBLIC_ prefix)
+      // src/lib/supabase-admin.ts — only imported by API routes and Server Actions
+      import { createClient } from '@supabase/supabase-js';
+      export const supabaseAdmin = createClient(
+        process.env.NEXT_PUBLIC_SUPABASE_URL!,
+        process.env.SUPABASE_SERVICE_ROLE_KEY! // private, server-only
+      );
+  - id: tables_without_rls
+    severity: critical
+    description: "Creating tables without enabling Row Level Security. In Supabase, tables with RLS disabled and the anon key give every unauthenticated request full read/write access. Tables with RLS enabled but no policies default to DENY — but relying on 'deny by default' without explicit intent is fragile."
+    bad_example: |
+      -- ❌ No RLS — authenticated users can see and modify all rows
+      CREATE TABLE orders (
+        id uuid PRIMARY KEY,
+        user_id uuid REFERENCES auth.users(id),
+        total numeric
+      );
+      -- Missing: ALTER TABLE orders ENABLE ROW LEVEL SECURITY
+      -- Any authenticated user: SELECT * FROM orders → sees all orders
+    good_example: |
+      -- ✓ RLS enabled with explicit per-user policy
+      CREATE TABLE orders (
+        id uuid PRIMARY KEY,
+        user_id uuid REFERENCES auth.users(id) NOT NULL,
+        total numeric NOT NULL
+      );
+      ALTER TABLE orders ENABLE ROW LEVEL SECURITY;
+      CREATE POLICY "own orders" ON orders
+        FOR ALL
+        USING (auth.uid() = user_id)
+        WITH CHECK (auth.uid() = user_id);
+  - id: browser_client_on_server
+    severity: warning
+    description: "Importing the browser Supabase client (from supabase-browser.ts) in Server Components or API routes. The browser client has no access to server-side cookie storage — supabase.auth.getUser() always returns null and all queries run as anonymous."
+    bad_example: |
+      // ❌ Browser client in a Server Component — no session
+      import { supabase } from '@/lib/supabase-browser';
+      // supabase.auth.getUser() → null (can't read server cookies)
+      const { data: posts } = await supabase.from('posts').select('*');
+      // RLS blocks this: auth.uid() = null → no rows returned (if policy exists)
+      // Or: all rows returned (if table has no RLS) — data leak!
+    good_example: |
+      // ✓ Server client in Server Component — reads session from cookies
+      import { createClient } from '@/lib/supabase-server';
+      const supabase = await createClient();
+      // auth.uid() = authenticated user → RLS applies correctly
+      const { data: posts } = await supabase.from('posts').select('*');
+  - id: unhandled_supabase_error
+    severity: warning
+    description: "Accessing the data field from a Supabase response without checking the error field first. When error is non-null, data is null or incomplete — accessing data properties on null causes runtime crashes."
+    bad_example: |
+      // ❌ Assuming success — data is null when error occurs
+      const { data } = await supabase.from('posts').select('*');
+      return data.map(post => post.title); // TypeError if data is null
+    good_example: |
+      // ✓ Always check error before using data
+      const { data, error } = await supabase.from('posts').select('*');
+      if (error) throw new Error(`Failed to fetch posts: ${error.message}`);
+      return data.map(post => post.title); // safe: data is non-null when error is null
+  - id: realtime_without_cleanup
+    severity: warning
+    description: "Setting up a Supabase Realtime subscription without cleaning up in useEffect's return function. Each leaked subscription holds an open WebSocket connection — 10 unmounted components without cleanup = 10 phantom WebSocket connections."
+    bad_example: |
+      // ❌ No cleanup — WebSocket connection leaks on unmount
+      useEffect(() => {
+        const channel = supabase
+          .channel('posts')
+          .on('postgres_changes', { event: '*', schema: 'public', table: 'posts' }, handler)
+          .subscribe();
+        // Missing: return () => supabase.removeChannel(channel);
+      }, []);
+    good_example: |
+      // ✓ Cleanup removes the WebSocket channel on unmount
+      useEffect(() => {
+        const channel = supabase
+          .channel('posts')
+          .on('postgres_changes', { event: '*', schema: 'public', table: 'posts' }, handler)
+          .subscribe();
+        return () => { supabase.removeChannel(channel); };
+      }, []);
+  - id: missing_generated_types
+    severity: warning
+    description: "Calling supabase.from('tablename') without using the generated Database type — loses all TypeScript type safety on the response. Column names, nullable fields, and return types are unknown, making the data layer impossible to refactor safely."
+    bad_example: |
+      // ❌ No Database type — from() returns 'any', no column type safety
+      import { createClient } from '@supabase/supabase-js';
+      const supabase = createClient(URL, KEY); // no generic type parameter
+      const { data } = await supabase.from('posts').select('*');
+      // data is any[] — typos in column names, wrong field shapes are undetected
+    good_example: |
+      // ✓ Generated types provide full type safety on queries and responses
+      // Generate with: supabase gen types typescript --local > src/types/supabase.ts
+      import type { Database } from '@/types/supabase';
+      import { createClient } from '@supabase/supabase-js';
+      const supabase = createClient<Database>(URL, KEY);
+      const { data } = await supabase.from('posts').select('id, title, created_at');
+      // data: { id: string; title: string; created_at: string }[] — fully typed

package/skills/patterns/vercel-deploy.skill.yaml

@@ -0,0 +1,219 @@
+schema_version: "2.0.0"
+id: vercel-deploy
+name: "Vercel"
+version: "2.0.0"
+description: "Vercel deployment — dashboard-managed secrets, serverless function bundle limits, edge runtime with Web APIs, cache headers, and environment-based URL construction."
+category: pattern
+language: javascript
+frameworks: []
+dependencies:
+  none: []
+detection:
+  files:
+    - vercel.json
+    - .vercel
+  source_indicators:
+    - "VERCEL_URL"
+    - "vercel.json"
+    - "@vercel/og"
+    - "NEXT_PUBLIC_VERCEL"
+structure:
+  required_dirs: []
+  recommended_dirs:
+    - path: .vercel
+      purpose: "Auto-generated Vercel project configuration — project.json links the local project to Vercel's project ID. Never edit manually; re-link with `vercel link` if corrupted."
+separation:
+  rules:
+    - concern: env_variables
+      belongs_in: vercel.json
+      rule_text: "Store all secrets (API keys, database URLs, auth secrets) in Vercel's environment variable dashboard — not in vercel.json or committed .env files. Use `vercel env add NAME production` to set them. Reference values as process.env.NAME in code. Use NEXT_PUBLIC_ prefix only for values that are intentionally safe to expose in the browser bundle."
+      example: |
+        // vercel.json — build config only, never secrets
+        {
+          "buildCommand": "npm run build",
+          "outputDirectory": ".next",
+          "framework": "nextjs"
+        }
+        // Set secrets via CLI:
+        // vercel env add DATABASE_URL production
+        // vercel env add NEXTAUTH_SECRET production
+        // vercel env add STRIPE_SECRET_KEY production
+        // Pull to local .env for development:
+        // vercel env pull .env.local
+      anti_indicators:
+        - "\"env\":"
+        - "\"DATABASE_URL\":"
+    - concern: serverless_function_limits
+      belongs_in: app/api
+      rule_text: "Vercel serverless functions have a 50 MB bundle limit, 1024 MB RAM, and 10s default / 30s Pro timeout. For long-running operations, use maxDuration to extend the timeout explicitly. For heavy dependencies (Puppeteer, FFmpeg, Sharp), use an external service or Vercel's native image transformation instead."
+      example: |
+        // app/api/report/route.ts — extend timeout for heavy computation
+        import { NextRequest } from 'next/server';
+        export const maxDuration = 30; // seconds — Pro plan allows up to 300s
+
+        export async function POST(req: NextRequest) {
+          const body = await req.json();
+          const report = await generateReport(body); // slow DB-heavy operation
+          return Response.json(report);
+        }
+
+        // app/api/quick/route.ts — lightweight, no override needed (uses 10s default)
+        export async function GET() {
+          const data = await fetchLightData();
+          return Response.json(data, {
+            headers: { 'Cache-Control': 's-maxage=60, stale-while-revalidate=300' },
+          });
+        }
+      indicators:
+        - "maxDuration"
+        - "export const config"
+        - "runtime"
+    - concern: edge_runtime
+      belongs_in: middleware.ts
+      rule_text: "Use the Edge Runtime (export const runtime = 'edge') for middleware and low-latency routes that don't need Node.js APIs. Edge functions run globally at every CDN PoP — ideal for auth middleware, redirects, A/B testing, and geo-routing. Edge functions cannot use Node.js built-ins (fs, crypto from 'crypto', Buffer) — use the equivalent Web APIs."
+      example: |
+        // middleware.ts — edge runtime, runs before every request
+        import { NextResponse } from 'next/server';
+        import type { NextRequest } from 'next/server';
+
+        export function middleware(request: NextRequest) {
+          const token = request.cookies.get('session')?.value;
+          if (!token && request.nextUrl.pathname.startsWith('/dashboard')) {
+            return NextResponse.redirect(new URL('/login', request.url));
+          }
+          return NextResponse.next();
+        }
+
+        export const config = {
+          matcher: ['/dashboard/:path*', '/api/protected/:path*'],
+        };
+      indicators:
+        - "export const runtime = 'edge'"
+        - "config.matcher"
+        - "NextResponse.redirect"
+    - concern: cache_headers
+      belongs_in: app/api
+      rule_text: "Set Cache-Control headers on API routes that return stable or slowly-changing data. Without cache headers, every request hits your serverless function — Vercel's CDN cannot cache the response. Use s-maxage for CDN TTL and stale-while-revalidate for background refresh."
+      example: |
+        // app/api/products/route.ts — CDN-cached for 60s, stale-revalidate for 5min
+        export async function GET() {
+          const products = await getProducts();
+          return Response.json(products, {
+            headers: {
+              'Cache-Control': 's-maxage=60, stale-while-revalidate=300',
+              // s-maxage: CDN caches for 60 seconds
+              // stale-while-revalidate: serve stale while revalidating in background
+            },
+          });
+        }
+
+        // For personalized responses — disable CDN caching
+        export async function GET(req: Request) {
+          const user = await getUser(req);
+          return Response.json(user, {
+            headers: { 'Cache-Control': 'private, no-store' },
+          });
+        }
+      indicators:
+        - "Cache-Control"
+        - "s-maxage"
+        - "stale-while-revalidate"
+patterns:
+  data_flow:
+    direction: "Git Push → Vercel Build → Serverless (regional) or Edge (global) → CDN Cache → Response"
+    rules:
+      - "Production secrets are set in Vercel dashboard — never in committed files."
+      - "Edge functions run globally at CDN PoP — use for auth middleware, redirects, geo."
+      - "Serverless functions are regional — use for DB queries and heavy computation."
+      - "Set Cache-Control headers on stable API responses — Vercel CDN caches them globally."
+      - "Use VERCEL_URL for dynamic URL construction — never hardcode domain names."
+  error_handling:
+    recommended: "Check VERCEL_ENV ('production' | 'preview' | 'development') to distinguish environments. Use NEXT_PUBLIC_VERCEL_URL for browser-side URL construction."
+  naming:
+    config: "vercel.json at project root — build config only, never secrets"
+    api_routes: "app/api/[resource]/route.ts for serverless; export const runtime = 'edge' for edge functions"
+    env_management: "Secrets via 'vercel env add [NAME] [scope]'; local copy via 'vercel env pull .env.local'"
+anti_patterns:
+  - id: secrets_in_vercel_json
+    severity: critical
+    description: "Putting secret values in vercel.json's env block. vercel.json is committed to the repository — secrets in it are visible to everyone with repo access and in git history permanently."
+    bad_example: |
+      // ❌ Secret in vercel.json — committed to git, leaked forever
+      {
+        "env": {
+          "DATABASE_URL": "postgresql://user:pass@db.example.com/prod",
+          "NEXTAUTH_SECRET": "my-production-secret"
+        }
+      }
+    good_example: |
+      // ✓ Set secrets via Vercel CLI — they go to the encrypted dashboard
+      // vercel env add DATABASE_URL production
+      // vercel env add NEXTAUTH_SECRET production
+      // vercel.json contains only non-secret build configuration
+  - id: heavy_deps_in_api_route
+    severity: warning
+    description: "Importing large native dependencies (Puppeteer, Sharp, FFmpeg) in serverless API routes — Puppeteer alone is ~350 MB (exceeds the 50 MB bundle limit). Results in build failures or extremely slow cold starts."
+    bad_example: |
+      // ❌ Puppeteer in a serverless function — 350 MB bundle → build fails
+      import puppeteer from 'puppeteer';
+      export async function GET() {
+        const browser = await puppeteer.launch();
+        const page = await browser.newPage();
+        // ... render screenshot
+      }
+    good_example: |
+      // ✓ Use Vercel's native OG image generation or an external screenshot service
+      import { ImageResponse } from 'next/og';
+      export const runtime = 'edge'; // OG works in edge runtime, tiny bundle
+      export async function GET() {
+        return new ImageResponse(<div>Hello</div>, { width: 1200, height: 630 });
+      }
+  - id: node_api_in_edge
+    severity: critical
+    description: "Using Node.js-only APIs (fs, path, Buffer, `import crypto from 'crypto'`) in edge functions or middleware. Edge runtime is based on V8 + Web APIs only — Node.js module imports throw at runtime."
+    bad_example: |
+      // ❌ Node.js crypto module in edge middleware — throws at runtime
+      import crypto from 'crypto'; // Node.js only
+      export function middleware(req: Request) {
+        const hash = crypto.createHash('sha256').update(req.url).digest('hex');
+      }
+    good_example: |
+      // ✓ Web Crypto API — available in edge runtime and browsers
+      export async function middleware(req: Request) {
+        const encoder = new TextEncoder();
+        const data = encoder.encode(req.url);
+        const hashBuffer = await crypto.subtle.digest('SHA-256', data);
+        const hashArray = Array.from(new Uint8Array(hashBuffer));
+        const hash = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
+      }
+  - id: hardcoded_base_url
+    severity: warning
+    description: "Hardcoding domain names in API routes or server-side code instead of using VERCEL_URL. Vercel creates unique deployment URLs for every preview — hardcoded URLs break OAuth callbacks, email confirmation links, and API redirects in preview deployments."
+    bad_example: |
+      // ❌ Hardcoded URL — breaks in Vercel preview deployments
+      const callbackUrl = 'https://myapp.com/api/auth/callback';
+      const emailLink = `https://myapp.com/verify?token=${token}`;
+    good_example: |
+      // ✓ Dynamic base URL from environment
+      const baseUrl = process.env.VERCEL_URL
+        ? `https://${process.env.VERCEL_URL}`
+        : 'http://localhost:3000';
+      const callbackUrl = `${baseUrl}/api/auth/callback`;
+      const emailLink = `${baseUrl}/verify?token=${token}`;
+  - id: missing_cache_headers
+    severity: warning
+    description: "API routes that return stable or reference data without Cache-Control headers. Without headers, every request hits the serverless function — you pay per invocation and users experience higher latency. Even a 60-second CDN cache can reduce function invocations by 90% for popular endpoints."
+    bad_example: |
+      // ❌ No cache headers — every request invokes the function
+      export async function GET() {
+        const categories = await db.category.findMany(); // same data for hours
+        return Response.json(categories); // bypasses Vercel CDN entirely
+      }
+    good_example: |
+      // ✓ CDN caches for 60s, serves stale for 5 min while revalidating
+      export async function GET() {
+        const categories = await db.category.findMany();
+        return Response.json(categories, {
+          headers: { 'Cache-Control': 's-maxage=60, stale-while-revalidate=300' },
+        });
+      }