[{"slug":"changelog","publishSlug":"changelog","title":"Changelog","name":"Plank","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A calm product changelog in the Linear / Stripe style — dated New/Improved/Fixed entries, live tag filtering, inline screenshots, and an RSS feed.","order":1,"liveUrl":"https://changelog.view.fast/","previewUrl":"https://changelog.view.fast/","setupQuestions":["What's the product name and a one-line description of what it does?","Give me 3-4 recent release notes — version, date, category, and what changed.","What's your brand accent color?","Where should \"subscribe to updates\" point (email signup URL or just RSS)?"],"photoTerms":["macbook on minimal desk workspace","app interface ui mockup screenshot","abstract gradient background soft","clean product screenshot on laptop"],"prompt":"Build me a **product changelog** — a calm, dated \"what's new\" page in the Linear /\nStripe / Clerk style, with New / Improved / Fixed badges, tag filtering, and an RSS\nfeed — as a self-contained static site (one `index.html` plus a CSS and a JS file\nand a `feed.xml`, no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the product name and a one-line description of what it does?\n2. Give me 3–4 recent release notes — version, date, category (New / Improved / Fixed), and what changed.\n3. What's your brand accent color?\n4. Where should \"subscribe to updates\" point — an email signup URL, or just the RSS feed?\n\n**Then build a complete, polished, responsive changelog with:**\n\n- A **header**: product name, a one-line description, and Subscribe actions (an email\n  prompt and an RSS link), with a sticky top bar.\n- A **filter bar** that toggles the timeline by **New / Improved / Fixed** (plus\n  \"All\"), highlights the active filter, and shows a live \"showing X of Y\" count.\n- A **release timeline**, newest first: each entry has its date, a relative \"x days\n  ago\" stamp, the version number, a colored category badge, a title, a short\n  description (bullets are good), and — for the bigger releases — an inline\n  screenshot or UI mockup.\n- **Per-entry permalink anchors**: each release has an `id`, and a link icon that\n  copies a deep link to the clipboard and shows a small \"copied\" toast.\n- A **footer subscribe block**: an email field that shows a friendly \"you're on the\n  list\" success state on submit (no backend), plus a prominent RSS link.\n- A valid **`feed.xml`** (RSS 2.0) that mirrors the same entries, linked from the\n  page `<head>` so feed readers discover it.\n\n**Design & content notes:**\n\n- Calm and restrained, like a well-run SaaS changelog: a near-white (or warm paper)\n  background, a single confident accent color, a refined serif for headings and a\n  clean sans for body, generous whitespace, and a subtle two-column timeline (date on\n  the left, content on the right). Include a tasteful light/dark toggle that remembers\n  the choice.\n- Three quiet badge colors — a green for **New**, a blue for **Improved**, an amber\n  for **Fixed** — used as small pills, never loud.\n- Use realistic content based on my answers — never \"lorem ipsum\". Write believable\n  release copy with real version numbers and dates; invent a couple more plausible\n  past releases so the timeline looks lived-in.\n- Use real images. For the per-release screenshots, prefer clean inline-SVG UI mockups\n  of the product (they read as real product shots and stay crisp); for any photos, pull\n  free images that fit, e.g. from Unsplash\n  (`https://images.unsplash.com/...`) or `https://picsum.photos/seed/product-changelog-1/1200/800`,\n  with descriptive `alt` text.\n- Persist the active filter to the URL (`?filter=new`) and `localStorage` so a shared\n  link opens pre-filtered. Compute the \"x days ago\" stamps in JS from each entry's\n  `datetime`. All of it runs in the browser — no backend, no account.\n- Keep it accessible: semantic `<article>` entries, real `<label>`s, the filter as a\n  labelled button group with `aria-pressed`, keyboard-operable controls, visible focus,\n  and good contrast in both themes.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"changelog\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/changelog"},{"slug":"dashboard","publishSlug":"brightside-growth-dashboard","title":"Growth dashboard","name":"Brightside Coffee — Growth Dashboard","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A single-screen, auto-refreshing growth dashboard for an online store — live KPI tiles with sparklines, a revenue trend, traffic sources, top products, and a channel leaderboard.","order":1,"liveUrl":"https://brightside-growth-dashboard.view.fast/","previewUrl":"https://brightside-growth-dashboard.view.fast/","setupQuestions":["What's the brand name and what do you sell?","Which 4-6 metrics matter most to your team day to day?","What's your monthly revenue target?","What's your brand's primary accent color?"],"photoTerms":["specialty coffee bag product flat lay","coffee roastery interior warm light","ecommerce packaging on wooden table","barista pouring latte overhead shot"],"prompt":"Build me a **single-screen growth dashboard for my online store** — the kind a small\nteam pins to the office TV and glances at all day — as a self-contained static site\n(one `index.html` plus a CSS and a JS file, no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the brand name and what do you sell?\n2. Which 4–6 metrics matter most to your team day to day?\n3. What's your monthly revenue target?\n4. What's your brand's primary accent color?\n\n**Then build a complete, polished, responsive dashboard with:**\n\n- A header bar with the brand, a \"Live\" pill, a ticking clock, and a \"last updated\"\n  timestamp.\n- A row of KPI tiles — revenue today, revenue MTD vs. target (with a progress bar),\n  orders, average order value, and conversion rate — each with a sparkline and an\n  up/down delta vs. yesterday.\n- A revenue trend chart for the last 30 days: daily bars plus a 7-day moving-average\n  line, with date labels.\n- A \"Traffic by source\" donut (organic / paid / email / social / direct) with a\n  legend showing sessions and share.\n- A \"Top products\" table — five products with units sold and a revenue bar.\n- A \"Marketing channels\" leaderboard with spend and ROAS, color-coded by performance.\n- An \"Email list\" panel: total subscribers, new-today counter, and a daily-signups\n  sparkline.\n- Auto-refresh every several seconds: the numbers tick to new values with a subtle\n  animation and the \"last updated\" stamp resets.\n\n**Design & content notes:**\n\n- \"Wall TV\" mood: dark, calm background; one warm accent color; a serif for big\n  numbers and headings, a clean sans for labels; tabular figures so digits don't\n  jiggle. Make it dense but legible from across the room.\n- Build the charts with inline SVG (or a tiny CDN charting lib) — no heavy framework.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  product names, channel names, and a month of revenue history with weekend dips and\n  a couple of campaign spikes.\n- Use real images for the product thumbnails. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/<product>/80/80` (vary the seed per product), with\n  descriptive `alt` text.\n- Drive everything from a small data model at the top of the JS file, with clearly\n  named functions, so it's easy to swap in a real analytics/commerce API later.\n- Keep it accessible: semantic HTML, a skip link, labelled regions, good contrast,\n  and respect `prefers-reduced-motion` (no animation when it's set).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"dashboard\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/dashboard"},{"slug":"tip","publishSlug":"tip","title":"Tip splitter","name":"Even Split","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"A fast bill-and-tip splitter — enter the bill, tap a tip, set the people, and get a clean per-person amount with tip figured on the pre-tax total.","order":1,"liveUrl":"https://tip.view.fast/","previewUrl":"https://tip.view.fast/","setupQuestions":["What's your default tip percentage and which presets should the buttons show (e.g. 15 / 18 / 20 / 25)?","What currency and locale should amounts use (e.g. USD $, EUR €)?","Should tip be calculated on the pre-tax or post-tax amount by default?","Typical party size to default to, and should it offer a \"round up each person\" option?"],"photoTerms":["friends splitting bill at restaurant table","hands with credit card and receipt cafe","dinner table from above with plates and glasses","group of friends laughing over dinner"],"prompt":"Build me a **fast bill-and-tip splitter** — a single-page calculator that takes a\nrestaurant bill, a tip percentage, and a number of people, and instantly shows a\nclean per-person amount — as a self-contained static site (one `index.html` plus a\nCSS and a JS file, no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your default tip percentage, and which presets should the buttons show (e.g. 15 / 18 / 20 / 25)?\n2. What currency and locale should amounts use (e.g. USD `$`, EUR `€`)?\n3. Should tip be calculated on the pre-tax or post-tax amount by default?\n4. What's a typical party size to default to, and should it offer a \"round up each person\" option?\n\n**Then build a complete, polished, responsive calculator with:**\n\n- A **bill amount** field (the subtotal, before tax) with a big, easy-to-tap money input.\n- A **tip selector**: preset percentage buttons plus a custom-percent input, with the active choice clearly highlighted.\n- A **separate tax field**, so by default the tip is figured on the **pre-tax** bill — with a toggle to tip on the post-tax total instead.\n- A **split-by-people** control: a − / + stepper _and_ a slider, kept in sync, showing the count live.\n- A **live breakdown** that updates on every keystroke: the big per-person number up top, then bill, tip, tax, and total on a receipt-style card.\n- A **round-up-per-person** toggle that rounds each person to the next whole unit and shows the small extra \"cushion\" that lands on the tip.\n- A **\"Copy the split\"** button that copies a tidy text summary to the clipboard, and a **\"New bill\"** reset.\n- A short hero up top and a quick \"why tip on the pre-tax bill\" explainer below.\n\n**Design & content notes:**\n\n- Warm, friendly, \"restaurant receipt\" mood: cream/paper background, a confident\n  green accent, a coral highlight, a monospace typeface for the dollar figures so\n  numbers feel like a printed check. Serif display headings, clean sans body.\n- Use realistic content based on my answers — never \"lorem ipsum\". Seed the\n  calculator with a believable sample bill so it looks alive on first load.\n- Use a real image. Pull a free photo that fits, e.g.\n  `https://picsum.photos/seed/dinner-1/1200/800` or\n  Pexels, with descriptive `alt` text.\n- All the math runs in the browser — no backend, no account. Compute on every input\n  change; format currency with `Intl.NumberFormat`.\n- Keep it accessible: semantic HTML, real `<label>`s, a labelled radio group for the\n  tip buttons, keyboard-operable stepper and slider, visible focus, and good contrast.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"tip\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/tip"},{"slug":"calories","publishSlug":"calories","title":"Calorie tracker","name":"Plateful","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"A browser-only daily macro tracker — log meals, watch calorie and protein/carb/fat rings fill toward your goals, and keep quick-add favorites, all saved locally.","order":2,"liveUrl":"https://calories.view.fast/","previewUrl":"https://calories.view.fast/","setupQuestions":["What's your daily calorie goal, and your protein/carb/fat targets (in grams or percentages)?","What should the app be called, and whose diary is it (a name for the header)?","Any dietary style to theme it around — e.g. high-protein, keto, vegetarian, balanced?","List 4–6 go-to foods or meals you eat often so we can preload them as quick-add favorites (with rough calories/macros)."],"photoTerms":["healthy meal prep containers overhead flat lay","colorful protein bowl on wooden table","grilled chicken and vegetables plate","person logging food on phone at table"],"prompt":"Build me a **single-page daily macro tracker** — a food diary that logs meals and\ntracks calories plus protein/carbs/fat against my goals — as a **vanilla-JS app**\n(one `index.html`, one CSS file, one JS file, no build step, no framework). Persist\neverything in `localStorage` so my diary is still there when I come back.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your daily calorie goal, and your protein/carb/fat targets (in grams or percentages)?\n2. What should the app be called, and whose diary is it (a name for the header)?\n3. Any dietary style to theme it around — e.g. high-protein, keto, vegetarian, balanced?\n4. List 4–6 go-to foods or meals you eat often so we can preload them as quick-add favorites (with rough calories/macros).\n\n**Then build a complete, polished, responsive app with:**\n\n- A **Today dashboard**: a big animated calorie ring (eaten vs. goal, showing\n  calories remaining in the center) and protein/carbs/fat progress bars that fill\n  toward each target and flag when I go over.\n- A **meal diary** split into Breakfast, Lunch, Dinner, and Snacks. Each meal shows\n  its running calorie subtotal; each logged item shows its calories and P/C/F, with\n  a one-tap delete.\n- An **add-food form** (in a dialog) with name, meal, calories, protein, carbs, fat,\n  and a **servings multiplier** slider so I can log 1.5× of something. Typing the\n  name of a known favorite autofills its macros.\n- A **quick-add favorites** list of my go-to foods — one tap logs them into the meal\n  that fits the time of day. The add form can also save a new food as a favorite.\n- A **date switcher** (prev/next + a date picker, plus left/right arrow keys) so I\n  can review or back-fill previous days. Each day keeps its own entries.\n- A **goals & settings** dialog to edit my name, dietary style, and calorie + macro\n  targets, with a live check that my macros add up to my calorie goal.\n- A **weekly summary**: a 7-day calorie bar chart (today highlighted, on-target days\n  in green) with average calories, average protein, and days-logged.\n\n**Design & content notes:**\n\n- Calm, modern dark UI: near-black background, warm coral as the primary/calorie\n  accent, blue for carbs and gold for fat, a serif display face (e.g. Fraunces) for\n  headings and a clean sans (e.g. Inter) for everything else. Rounded cards, soft\n  shadows, smooth ring/bar animations.\n- Preload the diary with realistic seed data for the named person and dietary style\n  (a partly-logged \"today\" so the rings look alive, a full \"yesterday,\" and a few\n  prior days of plausible totals). Use believable food names and macro numbers —\n  never \"lorem ipsum.\"\n- Food photos aren't required (the UI is data-first), but if you add any imagery use\n  real free photos that fit, e.g.\n  `https://picsum.photos/seed/meal-prep-1/1200/800` (vary the seed) with descriptive\n  `alt` text. Emoji food icons are great for the favorites list.\n- Persist all state in `localStorage` and keep it robust: write synchronously so\n  nothing is lost if I close the tab right after logging.\n- Keep it accessible (semantic HTML, real `<label>`s on every field, a\n  `<dialog>`-based modal, keyboard support, good contrast, and `prefers-reduced-motion`\n  respected).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"calories\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/calories"},{"slug":"invitation","publishSlug":"invitation","title":"Wedding invite","name":"Maya & Daniel","vertical":"Personal & creative","tech":"Astro","summary":"An elegant multi-section wedding site — live countdown, our story, details, travel, gallery, registry, a validating RSVP form, and an FAQ.","order":2,"liveUrl":"https://invitation.view.fast/","previewUrl":"https://invitation.view.fast/","setupQuestions":["What are both your names, your wedding date, and the venue/city?","Where and when are the ceremony and reception, and is there a dress code?","Where should guests stay/fly into, and do you have a hotel block?","Which registry links should we include, and what meal options should the RSVP form offer?"],"photoTerms":["engaged couple vineyard golden hour","outdoor wedding ceremony arch string lights","wedding table setting florals candles","couple holding hands walking countryside"],"prompt":"Build me an **elegant multi-section wedding website** as an **Astro site** (a real\nminimal Astro project — `package.json`, `astro.config.mjs`, `src/pages/index.astro`,\nsmall components, no SSR adapter — that builds to static files with `astro build`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What are both your names, your wedding date, and the venue/city?\n2. Where and when are the ceremony and reception, and is there a dress code?\n3. Where should guests stay/fly into, and do you have a hotel block?\n4. Which registry links should we include, and what meal options should the RSVP form offer?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed **hero** with our names, the date, the venue, and a **live countdown**\n  that ticks down to the exact ceremony date/time (and switches to a sweet \"We're\n  married!\" message once the date has passed).\n- A sticky top **nav** that smooth-scrolls to each section, collapsing to a hamburger\n  menu on mobile, with an always-visible RSVP button.\n- **Our Story** — how we met, the proposal, told as a vertical timeline with a few\n  dated milestones and a portrait photo.\n- **The Details** — ceremony and reception times, the venue name and address with an\n  \"Open in Maps\" link, and a dress-code note.\n- **Travel & Stay** — nearest airports, the hotel room block (with a booking code and\n  cutoff date), and directions/parking/shuttle info.\n- **Photo gallery** — a tidy mosaic of 5–6 images with good `alt` text.\n- **Registry** — a few linked registry cards (store registries plus a honeymoon fund),\n  each with a short personal note.\n- **RSVP form** — full name, email, accept/decline, guest count, meal preference, and\n  a song request. It must **validate** (required fields, real email), reveal the\n  meal/guest/song fields only when someone is attending, and show a warm **success\n  state** that echoes their choices. No backend — handle it client-side.\n- **FAQ** — an accordion answering plus-ones, kids, parking, weather, and the RSVP\n  deadline.\n- A **footer** with our names, the date, and our hashtag.\n\n**Design & content notes:**\n\n- Warm editorial wedding aesthetic: ivory/cream background, deep olive green, a\n  terracotta accent, and thin gold rules. An elegant serif (e.g. Cormorant Garamond)\n  for headings paired with a clean humanist sans (e.g. Mulish) for body. Generous\n  whitespace, a quiet ornament divider, subtle hover motion.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  copy: a real story, plausible travel logistics, specific meal names, real FAQ\n  answers.\n- Use real images. Pull free photos that fit, e.g. from Picsum\n  (`https://picsum.photos/seed/our-wedding-1/1200/800`, varying the seed per image) or\n  real Unsplash direct URLs (`https://images.unsplash.com/...`) matching terms like\n  _engaged couple vineyard golden hour_, _outdoor wedding ceremony arch string\n  lights_, _wedding table setting florals candles_, _couple holding hands walking\n  countryside_ — with descriptive `alt` text.\n- Keep dependencies minimal (just `astro`). Put all the wedding content in one\n  `src/data/wedding.ts` file so a single edit updates the whole site. Persist nothing\n  server-side; the RSVP success state is purely client-side.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, visible\n  focus, good contrast) and mobile-first.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"invitation\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/invitation"},{"slug":"links","publishSlug":"links","title":"Link-in-bio","name":"Jess Park — Link in Bio","vertical":"Personal & creative","tech":"Plain HTML & CSS","summary":"A mobile-first link-in-bio page for a food creator — avatar and bio, a highlighted primary CTA, a stack of link buttons, a featured video, and social icons.","order":2,"liveUrl":"https://links.view.fast/","previewUrl":"https://links.view.fast/","setupQuestions":["What's your name, what do you make/create, and a one-line bio?","What's the single most important thing you want visitors to click right now (the primary CTA)?","List 4–6 links you want as buttons, with their labels and URLs.","Which social platforms should show, and do you have a recent video to feature?"],"photoTerms":["food creator portrait kitchen natural light","overhead colorful healthy meal prep bowls","hands plating food styled flat lay","cozy kitchen herbs cutting board"],"prompt":"Build me a **mobile-first \"link in bio\" page for a food creator** as a single,\nself-contained HTML file with CSS (no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your name, what do you make/create, and a one-line bio?\n2. What's the single most important thing you want visitors to click right now (the primary CTA)?\n3. List 4–6 links you want as buttons, with their labels and URLs.\n4. Which social platforms should show, and do you have a recent video to feature?\n\n**Then build a complete, polished, responsive one-pager with:**\n\n- A centered profile header: round avatar (with a tasteful gradient ring), name with a small verified check, handle, a short bio, and a couple of topic \"tags\".\n- One **highlighted primary CTA** card at the top that stands out from everything else (e.g. \"Get my free meal-prep guide\") with a kicker, title, and one-line subtitle.\n- A vertical **stack of tappable link buttons** — each with a small thumbnail or icon, a title, a meta line, and a chevron. Add small \"New\" / \"Pre-order\" pills where it helps.\n- A **featured latest video/reel** card: a 16:9 thumbnail with a play button overlay, a title, and a short caption, linking out.\n- A row of **social icons** (Instagram, TikTok, YouTube, Pinterest — whichever I pick) as inline SVG, no icon library.\n- A small **newsletter signup** (just an email field) that validates the address and shows a friendly \"You're on the list\" success state, and remembers it in `localStorage`.\n- A subtle **footer** with a contact email.\n\n**Design & content notes:**\n\n- Warm, appetizing, editorial mood: cream background, a terracotta accent with a sage secondary, a serif display face (e.g. Fraunces) for headings and a clean sans (e.g. Inter) for body. Soft cards with gentle shadows and rounded corners; tasteful hover lift and a subtle entrance animation.\n- Mobile-first: it should feel made for a phone — a single narrow column, big tap targets, then look great centered on desktop too.\n- Write real-sounding copy from my answers — never \"lorem ipsum\". Invent believable recipe titles, link labels, follower counts, and a real-feeling bio voice.\n- Use real images. Pull free food photos that fit from Unsplash, e.g. `https://images.unsplash.com/...` (food creator portrait, healthy meal-prep bowls, hands plating food, cozy kitchen herbs) or `https://picsum.photos/seed/food-links-1/240/240`, each with descriptive `alt` text.\n- Keep it accessible (semantic HTML, a labelled email field, keyboard support, good contrast, `prefers-reduced-motion`). No build step — one `index.html`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"links\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/links"},{"slug":"listing","publishSlug":"listing","title":"Real-estate listing","name":"1428 Vista Del Mar","vertical":"Local & small business","tech":"Vite + React","summary":"An interactive single-listing site for one home — a photo gallery with lightbox, key stats, a live mortgage estimator, floor plan, and a tour-request form.","order":2,"liveUrl":"https://listing.view.fast/","previewUrl":"https://listing.view.fast/","setupQuestions":["What's the property address, list price, and beds/baths/square footage?","What are 4–6 standout features (e.g. \"chef's kitchen, ocean-view primary suite, pool\")?","Who's the listing agent — name, brokerage, phone, email?","Roughly what neighborhood/lifestyle should the copy lean into?"],"photoTerms":["modern luxury home exterior dusk twilight","open concept living room large windows","primary bedroom suite ocean view","backyard pool patio sunset"],"prompt":"Build me a **single-property listing microsite for a home that's for sale** as a\nVite + React app.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the property address, list price, and beds/baths/square footage?\n2. What are 4–6 standout features (e.g. \"chef's kitchen, ocean-view primary suite, pool\")?\n3. Who's the listing agent — name, brokerage, phone, email?\n4. Roughly what neighborhood/lifestyle should the copy lean into?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed hero with the address, city/state, list price, and a beds / baths /\n  sqft / price-per-sqft stat row over a twilight exterior photo, plus \"Schedule a\n  tour\" and \"View photos\" buttons.\n- A short \"story\" intro paragraph that sells the home in the agent's voice.\n- A \"Highlights\" grid (one card per standout feature, with a small icon).\n- A photo gallery: a tiled grid where clicking any image opens a full-screen\n  lightbox with caption, prev/next, and keyboard arrows + Esc.\n- A \"Facts & features\" table (bedrooms, baths, lot size, year built, garage, HOA…).\n- An **interactive mortgage estimator**: sliders for price, down-payment %, and\n  interest rate, plus a 15/20/30-year toggle, that live-updates the estimated\n  monthly payment with a principal / interest / tax / insurance breakdown.\n- A simple SVG floor plan with a level switcher (main / upper / lower) next to a\n  neighborhood blurb with a Walk Score and nearby points of interest.\n- A \"Schedule a tour\" form (name, phone, email, preferred date + time, message)\n  that shows a friendly confirmation state on submit, beside an agent contact card.\n- A footer with an MLS-style detail block and a \"deemed reliable but not\n  guaranteed / Equal Housing Opportunity\" disclaimer.\n\n**Design & content notes:**\n\n- Coastal-luxury, editorial mood: warm ivory/sand background, deep ocean-ink text,\n  a single brass accent, a serif display face (Cormorant Garamond) over a clean\n  sans (Inter). Generous whitespace, soft shadows, no clutter.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  copy, room names, neighborhood landmarks, and an MLS number.\n- Use real images. Pull free photos that fit, e.g. from Unsplash\n  (`https://images.unsplash.com/photo-…?auto=format&fit=crop&w=1600&q=80`) or Pexels,\n  for the exterior, living room, kitchen, primary suite, and pool, with descriptive\n  `alt` text.\n- Keep all the listing content in one `data.js` module so the site is easy to\n  re-skin for another property. Persist nothing to a backend — the form and\n  calculator are client-side only.\n- Mortgage math: monthly P&I from the standard amortization formula; estimate tax\n  (~1.18%/yr of price) and insurance (~0.35%/yr) so the total is realistic.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support for the\n  lightbox, good contrast) and mobile-first.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"listing\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/listing"},{"slug":"revenue-review","publishSlug":"revenue-review","title":"Revenue analysis","name":"Lumen Analytics — FY2025 Revenue Review","vertical":"Data, internal & startup","tech":"Vite + React","summary":"An interactive year-end SaaS revenue review — an executive KPI strip, an ARR bridge waterfall that sums, MRR movement, cohort retention, revenue mix, churn, and a base/bull/bear forecast.","order":2,"liveUrl":"https://revenue-review.view.fast/","previewUrl":"https://revenue-review.view.fast/","setupQuestions":["What's your company name and what does the product do?","What's your current ARR (or MRR) and net revenue retention, roughly?","What plan tiers and customer segments do you sell to?","What fiscal period should this cover (e.g. calendar 2025, FY ending June)?"],"photoTerms":["abstract financial chart blue gradient background","professional headshot woman finance executive neutral","minimal data dashboard ui dark mode","corporate office boardroom presentation screen"],"prompt":"Build me an **interactive end-of-year revenue review for my SaaS company** — a single-page\nboard dashboard with KPIs, an ARR bridge, retention cohorts, churn, and a next-year\nforecast — as a **Vite + React app**.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your company name and what does the product do?\n2. What's your current ARR (or MRR) and net revenue retention, roughly?\n3. What plan tiers and customer segments do you sell to?\n4. What fiscal period should this cover (e.g. calendar 2025, FY ending June)?\n\n**Then build a complete, polished, responsive dashboard with:**\n\n- A masthead with the company name, the fiscal period, a \"Confidential / Board materials\"\n  tag, and a \"Prepared by\" byline with a small photo.\n- An **executive summary strip**: ARR, Net Revenue Retention, gross logo churn, blended ACV,\n  and CAC payback months — each with a value, a YoY delta chip, and a one-line note.\n- An **ARR bridge / waterfall**: Starting ARR + New + Expansion − Contraction − Churned =\n  Ending ARR. The gains and losses must actually sum to the ending number — float the bars\n  off the running total and connect them.\n- An **MRR movement** chart: a stacked bar per month (new + expansion up, contraction +\n  churned down), with an optional \"net new\" line overlay. The twelve months should net to\n  the year's ARR change.\n- A **cohort retention heatmap**: rows are signup cohorts, columns are months-since-signup,\n  cells are net revenue retention % — red below 100, green above, with hover tooltips.\n- A **revenue mix** panel with a toggle between \"by plan tier\" and \"by customer segment\",\n  shown as labelled horizontal bars with ARR, share %, customer count and ACV.\n- A **churn analysis**: a ranked list of stated churn reasons (summing to 100%) next to a\n  \"logos at risk\" table (account, segment, ARR, health score, renewal date, reason).\n- A **FY-next forecast** with a **base / bull / bear** scenario toggle that swaps a quarterly\n  ARR area chart, the projected ending ARR, the YoY growth, and the key assumptions.\n\n**Design & content notes:**\n\n- Dark analyst-dashboard mood: near-black navy background, soft panels with hairline borders,\n  one accent per series (blue / violet for gains, amber / red for losses, green for balance),\n  a clean sans for text and a monospace for every number. Calm, precise, board-ready — not flashy.\n- The numbers have to reconcile. Pick a starting ARR and a set of new / expansion /\n  contraction / churned figures that actually add up to your ending ARR, and derive NRR and\n  gross retention from them. Invent believable account names for the at-risk table.\n- Use realistic content based on my answers — never \"lorem ipsum\".\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/byline-1/240/240` for the byline photo (and\n  an abstract blue gradient for the masthead), or Pexels, and add descriptive `alt` text.\n- Build the charts yourself with inline SVG (waterfall, stacked bars, area line) and CSS for\n  the heatmap and bars — keep dependencies to just React. Use `base: \"./\"` in the Vite config\n  so it works from any path, and add `<meta name=\"robots\" content=\"noindex\">` since it's internal.\n- Keep it accessible (semantic HTML, labelled controls, keyboard-focusable chart bars, good contrast).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"revenue-review\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/revenue-review"},{"slug":"band","publishSlug":"band","title":"Band site","name":"The Tidal Wolves","vertical":"Personal & creative","tech":"Vanilla JS","summary":"A bold one-page band site with a working sticky audio player, tour dates, a merch shelf, and a mailing-list signup.","order":3,"liveUrl":"https://band.view.fast/","previewUrl":"https://band.view.fast/","setupQuestions":["What's your band name and genre, and the one-line vibe you want the hero to say?","What's your latest single, and where can people stream it?","List three to five upcoming shows (city, venue, date) — or say you have none yet.","Give two or three merch items with prices, plus three song titles."],"photoTerms":["indie folk band performing on stage moody lighting","four piece band group portrait outdoors film grain","live concert crowd silhouette warm stage lights","vinyl record and band tee flat lay merch"],"prompt":"Build me a **bold, full-bleed one-page website for my band** as a vanilla-JS app\n(a single `index.html` plus a small CSS and JS file — no framework, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your band name and genre, and the one-line vibe you want the hero to say?\n2. What's your latest single or release, and where can people stream it (Spotify/Apple/Bandcamp links)?\n3. List 3–5 upcoming shows (city, venue, date) — or say you have none yet and we'll show a \"tour TBA\" state.\n4. Give me 2–3 merch items with names and prices, plus 3 song titles for the music section.\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed hero with the band photo, the band name big, a logo mark, and the latest-single tagline.\n- A **sticky bottom audio player** that streams the new single — play/pause, a seek bar with elapsed/total time, and previous/next track buttons. Clicking any song in the music list loads it into the player.\n- A \"Music\" section: the songs as a clickable tracklist, plus links out to Spotify / Apple Music / Bandcamp / YouTube.\n- A \"Tour\" section: each show with city, venue, date, and a ticket button — including \"Sold out\" and \"Few left\" states.\n- A merch shelf (vinyl, tee, tote) with photo, description, price, and a buy button.\n- A mailing-list signup (first name + email) that validates and shows a friendly \"You're on the list\" confirmation, and remembers the visitor on return via localStorage.\n- A short \"About\" blurb in the band's voice with the member lineup.\n- A \"Booking & press\" contact block with email addresses and social links.\n\n**Design & content notes:**\n\n- Moody, coastal, gig-poster mood: a near-black base, a deep teal, and one warm amber accent; a big serif display face (e.g. Fraunces) for headings and a clean sans (e.g. Inter) for body.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable show dates, song descriptions, and bios if I leave gaps.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/indie-band-1/1200/800` (vary the seed) or Pexels, and add\n  descriptive `alt` text.\n- No build step — a single `index.html` with a linked CSS and JS file that opens straight in a browser. Make the player actually work (real `<audio>` element); persist the mailing-list state in localStorage.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support including space-to-play, and good contrast).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"band\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/band"},{"slug":"barber","publishSlug":"barber","title":"Barbershop","name":"Ironclad Barber Co.","vertical":"Local & small business","tech":"Plain HTML & CSS","summary":"A sharp, masculine single-page barbershop site — services and prices, barber profiles, a cuts gallery, and hours with a prominent book-now button.","order":3,"liveUrl":"https://barber.view.fast/","previewUrl":"https://barber.view.fast/","setupQuestions":["What's the shop name and style (e.g. \"old-school straight-razor, modern fades\")?","What services and prices do you offer?","Who are your barbers and what's each one known for?","Address, hours, and your online booking link?"],"photoTerms":["barber giving fade haircut clippers","vintage barbershop interior leather chairs","hot towel straight razor shave close up","barbershop pole storefront classic"],"prompt":"Build me a **single-page website for my barbershop** as a plain HTML & CSS site (no\nbuild step, no framework — just `index.html`, `styles.css`, and a little `script.js`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the shop name and style (e.g. \"old-school straight-razor, modern fades\")?\n2. What services and prices do you offer?\n3. Who are your barbers and what's each one known for?\n4. What's your address, hours, and online booking link (or phone)?\n\n**Then build a complete, polished, responsive one-pager with:**\n\n- A full-bleed hero with a shop-interior photo, the name big, a short tagline, and a\n  prominent \"Book a chair\" button.\n- A \"Services & prices\" section as a clean grid (cut, skin fade, beard trim,\n  hot-towel straight-razor shave, full service, buzz, kids', senior), each with a\n  price and a one-line description. Highlight one as the house favorite.\n- A \"Meet the barbers\" section with a photo, name, chair number, specialty chips, and\n  a short bio for each barber.\n- A gallery of cuts and shop atmosphere (a tidy masonry-style grid).\n- A \"Hours & location\" block: the week's hours with **today highlighted** and a live\n  \"Open now / Closed\" status computed in JS, a walk-in policy note, address, phone,\n  and transit directions.\n- A booking form (name, phone, service, barber, preferred time) that validates and\n  shows a friendly, personalized \"You're on the books\" success state — no backend.\n- A footer with phone, directions, booking link, and socials.\n\n**Design & content notes:**\n\n- Masculine, classic-meets-modern barbershop mood: near-black charcoal background,\n  warm cream paper, one brass/amber accent. Condensed uppercase display type\n  (Oswald) for headings, clean sans (Inter) for body. Subtle hover lifts, no slop.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  barber names, bios, prices, and a couple of real-sounding reviews.\n- Use real images. Pull free photos that fit, e.g. grayscale shots from\n  `https://picsum.photos/seed/ironclad-barbershop-1/1200/800?grayscale` (vary the\n  seed per image) or fitting Unsplash photos of a barbershop interior, a fade\n  in progress, a hot-towel shave, and a classic barber pole — all with descriptive\n  `alt` text.\n- Keep it accessible (semantic HTML, labelled form fields, good contrast, keyboard\n  support, a skip link) and mobile-first with a working hamburger menu.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"barber\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/barber"},{"slug":"foodtruck","publishSlug":"foodtruck","title":"Food truck","name":"Kimchi Taco Co.","vertical":"Local & small business","tech":"Vanilla JS","summary":"A mobile-first food-truck site whose centerpiece is a weekly schedule that auto-highlights where the truck is parked today, with one-tap map directions and a live \"we're here now\" banner.","order":3,"liveUrl":"https://foodtruck.view.fast/","previewUrl":"https://foodtruck.view.fast/","setupQuestions":["What's the truck's name and cuisine / signature item?","What are 3–5 menu items with prices?","Where will you be each day this week (day, place, hours)?","Instagram handle and a catering contact email?"],"photoTerms":["colorful food truck street parked daytime","korean bbq beef tacos kimchi close up","food truck service window customers line","loaded burrito unwrapped overhead"],"prompt":"Build me a **mobile-first website for my food truck whose centerpiece is a weekly schedule that auto-highlights where the truck is parked today** as a vanilla-JS app (single `index.html` plus `styles.css` and `app.js` — no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the truck's name and cuisine / signature item?\n2. What are 3–5 menu items with prices?\n3. Where will you be each day this week (day, place, hours)?\n4. Instagram handle and a catering contact email?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed hero with a truck photo, the name big, a tagline, and a **live \"We're at … today\" banner** that JavaScript fills in from the schedule (and shows \"Open now / Opens at … / next stop on …\" depending on the current day and time).\n- A **\"This week's route\"** section: a list of day → location → hours, ordered so today comes first and today's row is visually highlighted. Each open day has a one-tap **Directions** link that opens Google Maps to that address. Day-off rows read as closed.\n- A **Menu** grouped into tacos, burritos/bowls, sides, and drinks, each item with a price and a one-line description; mark veg options.\n- A **Catering / private events** blurb with perks and a **quote-request form** that validates name + email and shows a friendly success state on submit (plus a `mailto:` and `tel:` fallback).\n- A **gallery strip** of food/truck photos.\n- A footer with contact info and Instagram / TikTok links.\n\n**Design & content notes:**\n\n- Bright, appetizing food-truck mood: warm cream paper background, a bold chili-red primary with gochujang-orange and sesame-gold accents, near-black warm ink for text. Big condensed display type (e.g. Anton) for headings, clean Inter for body.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable LA-style stops, menu copy, and prices if I'm vague.\n- Use real images. Pull free photos that fit, e.g. `https://picsum.photos/seed/kimchi-taco-truck-1/1200/800` (vary the seed per image), with descriptive `alt` text.\n- Put the schedule as data in `app.js` (days indexed Sun=0…Sat=6, open/close as minutes from midnight) and compute \"today\" + \"open now\" client-side. Build the Google Maps links with `https://www.google.com/maps/dir/?api=1&destination=`.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, good contrast) and mobile-first.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"foodtruck\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/foodtruck"},{"slug":"report","publishSlug":"report","title":"Annual report","name":"State of Indie Web 2025","vertical":"Data, internal & startup","tech":"Astro","summary":"A long-form annual community survey report — methodology, demographic charts, tool rankings, sentiment scales, and an editor's takeaways.","order":3,"liveUrl":"https://report.view.fast/","previewUrl":"https://report.view.fast/","setupQuestions":["What community or audience is this survey for?","How many people responded, and when did the survey run?","What are the 3–4 headline questions or findings you want to feature?","What tools, platforms, or options should appear in the ranking charts?"],"photoTerms":["diverse developers coworking laptops candid","abstract colorful bar chart illustration","person coding at desk dual monitors","conference audience tech meetup crowd"],"prompt":"Build me a **long-form annual community survey report** — a scrollable “State of …”\nwrite-up full of charts, rankings, and commentary, in the lineage of State of JS\nand the Stack Overflow Developer Survey — as an **Astro site** (static, no SSR).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What community or audience is this survey for?\n2. How many people responded, and when did the survey run?\n3. What are the 3–4 headline questions or findings you want to feature?\n4. What tools, platforms, or options should appear in the ranking charts?\n\n**Then build a complete, polished, responsive report with:**\n\n- A bold hero: the report title, a one-line summary, and three headline numbers\n  (respondents, countries, days in the field), over a faint coworking photo.\n- **Intro + methodology** — how many responded, how they were sampled, the dates\n  the survey ran, and an honest note that the audience self-selects.\n- **Demographics** — years of experience (vertical bar chart), team size and\n  primary role (donut charts), and country of residence (horizontal bars).\n- **Tools & frameworks** — a usage-vs-satisfaction chart: two bars per tool, one\n  for “used it” and one for “would use again,” sorted by satisfaction.\n- **Hosting & deployment popularity** — a horizontal bar “race” with a\n  year-over-year delta chip next to each platform, and a “new this year” badge.\n- **Biggest pain points** — a ranked list with vote counts and bars (respondents\n  could pick up to three).\n- **Sentiment** — a set of agree/disagree statements as a five-point Likert\n  diverging-bar chart, fanning out from a shared centre line.\n- **Key takeaways** — the editor’s commentary on what changed since last year,\n  each with a small up/down delta.\n- **Appendix** — full respondent-count tables behind every chart, plus a\n  “share this report” footer.\n\n**Design & content notes:**\n\n- Dark, editorial “survey results” aesthetic: deep ink background, a curated\n  multi-color chart palette, a characterful display font for headings over a clean\n  reading sans, and a monospace for every number on the page. A floating\n  table-of-contents that highlights the current section is a nice touch.\n- Render every chart as **server-side inline SVG or CSS bars** — no client-side\n  charting library to download. Keep one source-of-truth data file so all the\n  numbers stay internally consistent (the demographic breakdowns should sum to\n  the total respondent count).\n- Use realistic content based on my answers — never “lorem ipsum.” Invent\n  believable figures, rankings, and quotable write-in comments.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/coworking-1/1200/800` (vary the seed) or\n  Pexels, and add descriptive `alt` text.\n- Keep it accessible (semantic HTML, labelled charts with text alternatives,\n  keyboard support, good contrast) and respect `prefers-reduced-motion`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"report\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/report"},{"slug":"savings","publishSlug":"savings","title":"Savings calculator","name":"Milestone","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"A savings-goal calculator — set a target and a deadline, and it solves your monthly contribution and charts the compound growth toward the goal.","order":3,"liveUrl":"https://savings.view.fast/","previewUrl":"https://savings.view.fast/","setupQuestions":["What are you saving for and how much do you need (e.g. $20,000 for a house down payment)?","By when do you want to reach it, and how much do you already have saved?","What annual interest/return rate should we assume (e.g. 4% HYSA, 7% investments)?","Currency and a name/title for the goal to show on the page?"],"photoTerms":["glass jar full of coins savings plant growing","piggy bank on desk with calculator","stack of coins increasing growth chart"],"prompt":"Build me a **savings-goal calculator** as a vanilla-JS app (a single static site —\n`index.html`, `styles.css`, `app.js` — no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What are you saving for and how much do you need (e.g. $20,000 for a house down payment)?\n2. By when do you want to reach it, and how much do you already have saved?\n3. What annual interest/return rate should we assume (e.g. 4% HYSA, 7% investments)?\n4. What currency, and a name/title for the goal to show on the page?\n\n**Then build a complete, polished, responsive site with:**\n\n- A short hero: the headline promise (\"Know exactly what to save each month\"), a one-line\n  explainer, and a warm savings photo (coins jar with a plant, or a piggy bank).\n- A **goal form**: target amount, \"already saved\" starting balance, a target month,\n  an expected-annual-return picker (0% cash / ~4.5% HYSA / ~7% investing / custom), and a\n  currency selector.\n- A **headline result card** that solves the one number that matters — the **required\n  monthly contribution** — plus the per-week equivalent, the months remaining, total you'll\n  contribute, and total interest earned. Round the monthly figure up to a clean auto-pay number.\n- A **compound-growth area chart** (inline SVG): the balance climbing toward a dashed goal\n  line, with the lighter band showing contributions and a glow on top showing interest. Add a\n  hover readout for any month.\n- A **\"where the final balance comes from\"** stacked bar: head start vs contributions vs interest.\n- A **what-if explorer** with sliders for monthly amount and annual return that keep the target\n  fixed and tell me the new date I'd actually hit the goal (faster/slower than my deadline).\n- A **year-by-year milestone table**: contributed, interest, balance, and % toward the goal at\n  the end of each year, with the final row marked as the goal.\n- A short \"why\" section and a footer with a \"not financial advice / runs in your browser\" note.\n- A **\"Copy my plan\"** button that puts a clean text summary on the clipboard.\n\n**Design & content notes:**\n\n- Calm, trustworthy fintech mood: warm paper background, deep-teal ink, a confident green for\n  growth and a soft gold for interest. A serif display face (e.g. Fraunces) for headings, a clean\n  sans (Inter) for body, and a monospace (Space Mono) for the numbers.\n- Get the math exactly right. Contributions are end-of-month and interest compounds monthly:\n  `FV = PV·(1+i)^n + PMT·((1+i)^n − 1)/i`, where `i` is the monthly rate and `n` the number of\n  months. Solve that for `PMT` to get the required monthly contribution; invert it (solve for `n`)\n  for the what-if \"when would I hit it\" date. Handle the easy edge cases too: a 0% rate, a start\n  balance that already meets the goal, and interest alone reaching the goal before the deadline.\n- Use realistic content based on my answers — never \"lorem ipsum\". Use my goal name, amounts, and\n  currency throughout, and format money with `Intl.NumberFormat`.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/savings-jar-1/1200/800` (vary the seed) or Pexels, and add descriptive\n  `alt` text.\n- Persist my inputs in `localStorage` so my plan is still here when I come back, and recompute\n  everything live as I type or drag.\n- Keep it accessible (semantic HTML, labelled fields, keyboard-friendly sliders and buttons, good\n  contrast) and mobile-first.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"savings\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/savings"},{"slug":"arcade","publishSlug":"arcade","title":"Arcade","name":"Quarter Up Barcade","vertical":"Local & small business","tech":"HTML5 canvas game","summary":"A neon barcade site whose hero is a playable retro brick-breaker game, wrapped around a real cabinets list, draft beer menu, events, and hours.","order":4,"liveUrl":"https://arcade.view.fast/","previewUrl":"https://arcade.view.fast/","setupQuestions":["What's the bar's name and era/theme (e.g. \"'80s arcade, all-neon\")?","Name a few signature cabinets/games you have on the floor.","What are 4–6 drinks on your draft/cocktail list?","Address, weekly hours, and any recurring event night (e.g. \"Tuesday Tetris tournament\")?"],"photoTerms":["retro arcade bar neon glow cabinets row","vintage arcade machine joystick buttons close up","craft beer taps bar nightlife","neon sign arcade bar interior"],"prompt":"Build me a **website for my retro arcade bar, with a playable mini-game as the hero**, as an **HTML5 canvas game** wrapped in a self-contained static site (a single `index.html` plus `styles.css` and a couple of small JS files — no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the bar's name and era/theme (e.g. \"'80s arcade, all-neon\")?\n2. Name a few signature cabinets/games you have on the floor.\n3. What are 4–6 drinks on your draft/cocktail list?\n4. Address, weekly hours, and any recurring event night (e.g. \"Tuesday Tetris tournament\")?\n\n**Then build a complete, polished, responsive site with:**\n\n- A **playable canvas hero mini-game** — a Breakout/Pong-style game inside a glowing arcade-cabinet frame, with a \"PRESS START\" overlay, a live HUD (score, high score, balls, wave), keyboard **and** mouse **and** touch controls, lives, rising difficulty per wave, a game-over/restart flow, and a high score that persists in `localStorage`.\n- **The cabinets** — a grid of your featured arcade games with year, a one-line description, and a genre tag.\n- **On tap** — a rotating draft-beer list (name, brewery, style, ABV, price) plus a few house cocktails.\n- **Events** — a week of tournament nights and happy-hour specials with prizes.\n- **Visit** — address, a weekly hours table, age policy, and a map/photo with a link out to Google Maps.\n- **Book a party** — a private-event request form (name, email, date, guest count, notes) that shows a friendly success message on submit.\n- A footer with social links and the address.\n\n**Design & content notes:**\n\n- Neon-and-CRT mood: near-black/deep-violet background, hot-pink + cyan + lime accents, a pixel display font (e.g. \"Press Start 2P\") for headings and a clean sans (e.g. \"Space Grotesk\") for body. Add subtle scanlines and glow, plus a scrolling marquee strip — but keep text high-contrast and readable.\n- Make the game genuinely fun: smooth 60fps loop with delta timing, the ball's bounce angle depends on where it hits the paddle, the paddle shrinks and the ball speeds up on later waves, and a launch-on-Space/tap mechanic.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable brewery names, prices, tournament prizes, and hours.\n- Use real images. Pull free photos that fit, e.g. `https://picsum.photos/seed/retro-arcade-1/1200/800` (vary the seed) or Pexels, and add descriptive `alt` text.\n- No build step: a single `index.html` plus `styles.css`, `game.js`, and a tiny `ui.js`. Persist the high score in `localStorage`.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, good contrast, a skip link, and `prefers-reduced-motion` respected).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"arcade\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/arcade"},{"slug":"habits","publishSlug":"habits","title":"Habit tracker","name":"Tally","vertical":"Tools, apps & games","tech":"Vite + React","summary":"A habit tracker with GitHub-style year heatmaps, one-tap daily check-offs, and streak stats — all saved in your browser.","order":4,"liveUrl":"https://habits.view.fast/","previewUrl":"https://habits.view.fast/","setupQuestions":["Which habits do you want to track to start (e.g. Workout, Read, Meditate, Drink water)?","For each habit, is it daily or X times per week?","Pick an accent color or vibe for the heatmaps (e.g. classic green, sunset, ocean).","Whose tracker is this — a name or title for the top of the app?"],"photoTerms":["person running at sunrise athletic","open book and coffee morning routine","yoga meditation at home minimal","calendar planner with checkmarks desk"],"prompt":"Build me a **habit tracker with GitHub-style contribution heatmaps** as a **Vite + React app** that saves everything in the browser (no backend, no accounts).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. Which habits do you want to track to start (e.g. Workout, Read, Meditate, Drink water)?\n2. For each habit, is it daily or X times per week?\n3. Pick an accent color or vibe for the heatmaps (e.g. classic green, sunset, ocean).\n4. Whose tracker is this — a name or title for the top of the app?\n\n**Then build a complete, polished, responsive app with:**\n\n- A **Today** panel: a checklist of every habit that I can tap to mark done today, with a progress ring showing how much of today is complete.\n- A combined **\"Your year\"** heatmap (GitHub contribution style) whose intensity is how many habits I finished each day — last ~12 months.\n- A **per-habit card** for each habit showing its own heatmap, current streak, longest streak, and 30-day completion rate, plus a \"Mark today\" toggle.\n- An **Add / edit habit** form (name, emoji, accent color, daily vs. X-times-per-week).\n- A **habit detail view** with the full 12-month heatmap (tap any square to toggle that day), big stat tiles, and a month calendar I can click through.\n- A **Settings** panel: week-start day (Mon/Sun), light/dark theme, tracker title, and a reset-all-data option.\n\n**Design & content notes:**\n\n- Calm, focused, GitHub-meets-Things look: dark by default with a clean light mode, rounded cards, one accent color per habit driving its heatmap gradient, Inter for type.\n- The current streak must include today only once I've checked it off; until then it stays \"alive\" from yesterday so checking today visibly extends it. Get the streak and completion-rate math right — these are the whole point.\n- Seed the app with a believable year of history on first load so the heatmaps look lived-in, and use realistic habit names from my answers — never \"lorem ipsum\".\n- Persist all state to `localStorage` so my data survives refreshes; everything stays on my device.\n- Use real images only if a marketing/empty state needs them — pull free photos that fit, e.g. `https://picsum.photos/seed/planner-1/1200/800`, with descriptive `alt` text.\n- Keep it accessible (semantic HTML, labelled controls, keyboard support, good contrast) and mobile-first. Keep dependencies minimal (just React + Vite).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"habits\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/habits"},{"slug":"photos","publishSlug":"photos","title":"Photo portfolio","name":"Eliot Vance Photography","vertical":"Personal & creative","tech":"Astro","summary":"A calm, image-first portfolio for a landscape and travel photographer, with named photo series, a full-screen lightbox, an about page, and a contact form.","order":4,"liveUrl":"https://photos.view.fast/","previewUrl":"https://photos.view.fast/","setupQuestions":["What's the photographer's name and one-line specialty (e.g. landscape, weddings, editorial)?","What are 3–4 photo series you want as galleries, and their names?","What's your contact email and Instagram handle?","Do you sell prints, or is this portfolio-and-inquiry only?"],"photoTerms":["misty mountain landscape fine art","black and white studio portrait","coastal cliffs golden hour wide shot","minimalist desert dunes aerial"],"prompt":"Build me a **calm, image-first portfolio for a landscape & travel photographer** as a\nsmall static **Astro site** (no SSR, no adapters — just `astro build`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the photographer's name and one-line specialty (e.g. landscape, weddings, editorial)?\n2. What are 3–4 photo series you want as galleries, and their names?\n3. What's your contact email and Instagram handle?\n4. Do you sell prints, or is this portfolio-and-inquiry only?\n\n**Then build a complete, polished, responsive site with:**\n\n- A **full-bleed hero** image with the photographer's name set large, the tagline, and\n  the specialty + home base — a dark gradient keeps the type legible over the photo.\n- A **work index** — a thumbnail grid of the named series (cover image, title, place,\n  year, and a one-line blurb), each linking to its own gallery page.\n- A **series gallery page** per series (`/series/<slug>`) with a **masonry grid** and a\n  full-screen **lightbox** that is keyboard-navigable: click any frame to open, ← → to\n  move between photos, `Esc` to close, with a caption and a `n / total` counter.\n- An **About** page: bio in the photographer's voice, a headshot, a selected-client list,\n  and a short recognition/press list.\n- A **Prints / shop teaser**: a few open-edition sizes and prices, with a note that\n  orders go through the contact form.\n- A **Contact** section: a validating form (name, email, topic, message) that shows a\n  warm, personalized success state on submit, plus direct email and Instagram links.\n\n**Design & content notes:**\n\n- Quiet, editorial, gallery-white mood: a warm ivory paper background, near-black ink,\n  one muted oxblood accent used sparingly, lots of whitespace. An elegant serif\n  (e.g. Fraunces) for the name and headings over a clean sans (e.g. Inter) for body.\n  Let the photographs carry the page.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  series blurbs, photo captions, a bio, a client list, and print prices.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/<your-seed>/1200/800` (vary the seed per image), with\n  descriptive `alt` text. Use the black-and-white treatment for any portrait series.\n- Keep all the content (photographer, series, photos, about, prints) in a single\n  `src/data/portfolio.ts` file so one edit updates the whole site. Use Astro's\n  `getStaticPaths` to generate one page per series.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, good\n  contrast). Lazy-load below-the-fold images; preload the hero.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"photos\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/photos"},{"slug":"technical-plan","publishSlug":"technical-plan","title":"Technical planning","name":"Northstar Sync — Technical Plan","vertical":"Data, internal & startup","tech":"Plain HTML & CSS","summary":"A decision-ready technical plan for a cross-platform offline sync initiative — problem and scope, system architecture, milestones, risks, decisions, and open questions.","order":4,"liveUrl":"https://technical-plan.view.fast/","previewUrl":"https://technical-plan.view.fast/","setupQuestions":["What are you planning, who is it for, and what user or business problem should it solve?","What systems, teams, constraints, and non-negotiable requirements are already known?","What delivery window or milestone dates matter, and how should success be measured?","Which decisions are already made, and which questions still need an owner?"],"photoTerms":[],"prompt":"Build me a **decision-ready technical plan website** — a clear, credible artifact a\nteam can use to agree on scope, architecture, delivery, risks, and unresolved\ndecisions — as a **plain HTML & CSS** site with no framework and no build step.\n\n**Before you build, ask me these questions in one message and wait for my answers.\nIf I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What are we planning, who is it for, and what user or business problem should it solve?\n2. What systems, teams, constraints, and non-negotiable requirements are already known?\n3. What delivery window or milestone dates matter, and how should success be measured?\n4. Which decisions are already made, and which questions still need an owner?\n\n**Then build a complete, polished, responsive plan with:**\n\n- An **executive readout**: a one-paragraph recommendation plus compact metadata for\n  status, owner, reviewers, target window, and confidence. Follow it with 3–4\n  measurable success criteria.\n- A precise **problem statement** and a scope section that separates goals,\n  non-goals, target users, constraints, assumptions, and explicit boundaries.\n- A readable **architecture section**: system context, named components, data flow,\n  storage and trust boundaries, failure behavior, observability, and a diagram made\n  with semantic HTML/CSS or accessible inline SVG. Make every label consistent with\n  the prose.\n- A phased **milestone plan** with target dates, owners, dependencies, concrete\n  deliverables, and exit criteria. Include discovery/prototyping, foundations,\n  rollout, and hardening rather than pretending everything ships at once.\n- A ranked **risk register** with likelihood, impact, mitigation, trigger, and a\n  named owner for every risk. Include product, technical, security/privacy, and\n  delivery risks where relevant.\n- A **decision log** that records the option chosen, alternatives considered,\n  rationale, consequences, and the condition that would justify revisiting it.\n- An **open-questions queue** with an owner, due date, and a note on what each answer\n  unblocks. Distinguish real unknowns from decisions that have already been made.\n- A short **review checklist** and next-step footer so a meeting can end with clear\n  actions instead of another round of vague comments.\n\n**Design & content notes:**\n\n- Treat it like a high-quality engineering RFC, not a marketing landing page:\n  restrained warm-neutral canvas, deep ink, one calm green accent, crisp typography,\n  subtle dividers, and generous whitespace. Use color for meaning, never decoration.\n- Add a compact document navigation that stays useful on desktop and becomes a\n  touch-friendly, horizontally scrollable section index on small screens.\n- Use internally consistent, realistic content based on my answers — never \"lorem\n  ipsum.\" Pick one plausible product initiative and keep component names, dates,\n  owners, metrics, dependencies, and risks consistent across every section.\n- Make the recommendation opinionated. Surface tradeoffs and rejected alternatives;\n  do not present every option as equally good.\n- Use tables only where comparison matters (milestones and risks). Keep them\n  responsive without shrinking text below a readable size, and include captions and\n  proper row/column headers.\n- Keep it accessible: semantic landmarks and headings, a skip link, visible keyboard\n  focus, descriptive link text, strong contrast, no color-only status signals, and a\n  print stylesheet that preserves the plan's structure.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"technical-plan\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account,\ninstall, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. Put only the finished public files there.\n   Confirm it has `index.html` at its root and no secrets, source-only files, `.git`,\n   or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block\n   preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`,\n   `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`.\n   Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored,\n   mode-600 `.spacefast/state.json`). For an update, rebuild the `publish_files`\n   array and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`,\n   exchange the saved claim token once at\n   `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save\n   `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed,\n`sf publish ./site --wait` does the same job. A zip of the publish folder is also\nsupported, but neither the CLI nor a zip is required. Docs:\n[agent setup](https://spacefast.com/setup) ·\n[files and folders](https://spacefast.com/help/publishing) ·\n[claiming](https://spacefast.com/help/anonymous-publish) ·\n[updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/technical-plan"},{"slug":"game","publishSlug":"game","title":"Brick-breaker game","name":"Prism Breaker","vertical":"Tools, apps & games","tech":"HTML5 canvas game","summary":"A fully playable neon-synthwave brick-breaker — bounce a glowing ball to smash brick walls across five levels, catching falling power-ups.","order":5,"liveUrl":"https://game.view.fast/","previewUrl":"https://game.view.fast/","setupQuestions":["What should the game be called, and what's the vibe — neon synthwave, candy pastel, or retro CRT green?","What's your accent/primary color for the ball and paddle glow?","How many levels should the first run have (e.g. 5), and should difficulty ramp by speed, brick rows, or both?","Name 2–3 power-ups you'd like (or use the defaults — multi-ball, wide paddle, slow-mo)."],"photoTerms":["synthwave neon grid horizon background","retro arcade cabinet glow","abstract dark gradient with neon particles","CRT scanline texture overlay"],"prompt":"Build me a **playable neon brick-breaker arcade game** (paddle, bouncing ball, destructible brick walls, falling power-ups, multiple levels) as an **HTML5 canvas game** — a self-contained static site with no build step.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What should the game be called, and what's the vibe — neon synthwave, candy pastel, or retro CRT green?\n2. What's your accent/primary color for the ball and paddle glow?\n3. How many levels should the first run have (e.g. 5), and should difficulty ramp by speed, brick rows, or both?\n4. Name 2–3 power-ups you'd like (or use the defaults: multi-ball, wide paddle, slow-mo).\n\n**Then build a complete, polished, responsive game with:**\n\n- A **title / start screen** with a big logo, a PLAY button, a \"How to play\" button, and a high-score badge.\n- A **canvas gameplay scene**: a paddle, ball physics with real wall/paddle/brick collisions, a colored brick grid, and a live HUD showing score, lives, and level.\n- **Falling power-ups** that drop from broken bricks and are caught with the paddle — multi-ball, wide paddle, slow-mo, and a laser the player can fire.\n- **Level progression** with distinct brick layouts and ball speed that increases each level.\n- A **game-over / level-clear overlay** showing the score, the best score, and a Play Again button.\n- A **how-to-play modal** explaining the controls (arrow keys / A-D / mouse / touch to move, Space or tap to launch and fire).\n\n**Design & content notes:**\n\n- Neon synthwave arcade mood: near-black violet background, a glowing perspective grid horizon, scanlines, and bright cyan/magenta neon. Use a display font (e.g. Orbitron) for the logo/HUD and a clean condensed sans (e.g. Rajdhani) for body. Lean into juice: ball trails, particle bursts when bricks shatter, screen shake, and short synth blips via the Web Audio API (no audio files).\n- Write real, specific copy — level names, power-up labels, on-screen hints — never \"lorem ipsum\".\n- Use real images only where they help (e.g. a subtle synthwave backdrop). Pull free photos that fit, e.g. from Unsplash (`https://images.unsplash.com/...`) or Pexels, with descriptive `alt` text. The playfield itself should be drawn on the canvas, not a photo.\n- Make it **actually playable**: a real game loop at ~60fps, keyboard + mouse + touch controls, on-screen buttons on mobile, a working pause, and a restart. Persist the best score in `localStorage` so it survives reloads. Substep the ball so it never tunnels through bricks at high speed.\n- Keep it accessible (semantic HTML for the menus/modal, labelled buttons, good contrast, keyboard support) and mobile-first (the canvas scales to fit, touch controls appear on small screens).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"game\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/game"},{"slug":"generative-art","publishSlug":"generative-art","title":"Generative art","name":"Driftfield","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"A generative art toy — particles drift through a noise flow field painting ever-evolving line art, with live palette, density and speed controls, reseed, and one-click PNG export.","order":5,"liveUrl":"https://generative-art.view.fast/","previewUrl":"https://generative-art.view.fast/","setupQuestions":["What should the toy be called, and what palette mood do you want — sunset warm, ocean cool, monochrome ink, or pastel?","What background — light paper, deep black, or a soft gradient?","How busy should the default piece feel (sparse and elegant vs. dense and painterly)?","Should pieces auto-evolve forever, or settle into a finished still you can export?"],"photoTerms":["generative flow field art print","abstract swirling particle lines","marbled ink paper texture","soft gradient color palette abstract"],"prompt":"Build me a **generative flow-field art toy** — a single full-bleed canvas where\nthousands of particles drift through a Perlin-noise vector field, painting layered\norganic line work I can tune, reseed, and export — as a **plain HTML & CSS + vanilla-JS\napp** with no build step (a single `index.html` plus a couple of `.js`/`.css` files,\nzero dependencies).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What should the toy be called, and what palette mood do you want — sunset warm, ocean cool, monochrome ink, or pastel?\n2. What background — light paper, deep black, or a soft gradient?\n3. How busy should the default piece feel (sparse and elegant vs. dense and painterly)?\n4. Should pieces auto-evolve forever, or settle into a finished still I can export?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed animated canvas that continuously paints the flow field in real time (a proper `requestAnimationFrame` loop).\n- A control panel with: a color-palette picker, a particle-count (density) slider, a flow-speed slider, a line-width (stroke) slider, and a background-tone selector.\n- A \"New piece\" button that reseeds the noise field from a fresh seed, so every press is a brand-new composition.\n- Clear (wipe the ink) and Pause / Resume controls.\n- Export-to-PNG that downloads the current canvas, with the seed string baked into the filename so a piece can be saved or reproduced exactly.\n- A short \"What is a flow field?\" note explaining the idea in one friendly paragraph.\n\n**Design & content notes:**\n\n- Gallery-studio mood: a dark, refined chrome that gets out of the canvas's way — a glassy floating control panel, a serif display face for the title (e.g. Fraunces), a clean sans for UI, and a monospace seed readout. One warm accent (a soft coral) against cool neutrals.\n- Implement the flow field for real: a seedable PRNG plus Perlin/value noise so the **same seed always reproduces the same artwork**. Draw particle trails as translucent strokes (use `lighter` blending on dark backdrops, `multiply` on paper) so the line work layers into rich, marbled color.\n- Make the seed shareable: show it in the UI, sync it to the URL hash, let me paste a seed in to reload a piece, and persist my control settings in `localStorage`.\n- Add an auto-evolve toggle: on, the field keeps breathing and never settles; off, the particles trace a fixed field until the piece resolves into a finished still.\n- Mobile-first and accessible: semantic HTML, labelled controls, keyboard support (Space = pause, R = reseed, S = save, C = clear), visible focus rings, good contrast, and a `prefers-reduced-motion` fallback. Make it responsive — the panel becomes a bottom sheet with a floating action dock on phones.\n- Use realistic content — never \"lorem ipsum\". Write the real microcopy, palette names, and the about paragraph.\n- Use real images where appropriate (e.g. an Open Graph cover) — pull free photos that fit, such as `https://picsum.photos/seed/flow-field-cover/1200/630` or Unsplash (`https://images.unsplash.com/...`) matching terms like _generative flow field art print_ or _soft gradient color palette abstract_, with descriptive `alt` text.\n- No build step: it must run by just opening `index.html`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"generative-art\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/generative-art"},{"slug":"menu","publishSlug":"menu","title":"Restaurant menu","name":"Kaze Ramen House","vertical":"Local & small business","tech":"Plain HTML & CSS","summary":"A single-page site for a neighborhood ramen shop — a photographed menu, the broth story, hours, and a map that makes you hungry on first scroll.","order":5,"liveUrl":"https://menu.view.fast/","previewUrl":"https://menu.view.fast/","setupQuestions":["What's the shop's name and one-line vibe (e.g. \"rich 18-hour tonkotsu, counter seating\")?","What's your signature ramen plus 3-4 other menu items with prices?","What neighborhood/address are you in and what are your weekly hours?","Phone number and any Instagram or reservation link?"],"photoTerms":["tonkotsu ramen bowl chashu soft egg overhead","steaming ramen bowl dark moody close up","pork gyoza dumplings on plate","japanese ramen shop interior wood counter lanterns"],"prompt":"Build me a **one-page website for my neighborhood ramen shop** as plain HTML & CSS\nwith a touch of vanilla JavaScript (no build step, no framework — just an\n`index.html`, a stylesheet, and a small script).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the shop's name and one-line vibe (e.g. \"rich 18-hour tonkotsu, counter seating\")?\n2. What's your signature ramen plus 3–4 other menu items with prices?\n3. What neighborhood/address are you in and what are your weekly hours?\n4. Phone number and any Instagram or reservation link?\n\n**Then build a complete, polished, responsive one-pager with:**\n\n- A full-bleed hero: a big steaming bowl of tonkotsu behind the shop name, a short\n  appetizing tagline, and two buttons — \"View the menu\" and \"Find us & hours\".\n- A **menu** section grouped into Ramen, Small Plates / Gyoza, and Rice Bowls &\n  Drinks, each item with a name, a one-line description, and a price (use a dotted\n  leader line between name and price like a real menu). Star the house favorite and\n  pull the signature bowl out into a featured card with its own photo. Include a\n  small \"build your bowl\" toppings list with add-on prices.\n- An **\"Our Story\"** section about the broth — who the chef is, how long the\n  tonkotsu simmers, why the room feels the way it does — with a photo and a signature.\n- A **photo gallery** of dishes and the room as a responsive grid, where tapping a\n  photo opens it larger in a lightbox (keyboard + arrow-key navigation, Esc to close).\n- A **Hours + Location** section: a styled hours table that highlights _today_ and\n  shows a live \"Open now / Closed now · opens at…\" badge computed in the browser, the\n  full address, an embedded Google map, and a \"Get directions\" button.\n- A **footer** with phone, email, a \"walk-ins only / call ahead for big parties\"\n  reservations note, and Instagram / TikTok / map links.\n\n**Design & content notes:**\n\n- Warm izakaya mood: near-black charcoal-brown, washi-paper cream, one bold\n  persimmon-red accent and a soft lantern-gold. An elegant serif (e.g. Shippori\n  Mincho) for headings and the brand, a clean sans (e.g. Inter) for body. A small\n  kanji/lantern flourish is welcome.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  dish descriptions, a chef backstory, and plausible hours.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/ramen-1/1200/800` (vary the seed) or Pexels, with\n  descriptive `alt` text. Good search terms: tonkotsu ramen bowl chashu soft egg\n  overhead; steaming ramen bowl dark moody close up; pork gyoza dumplings on plate;\n  japanese ramen shop interior wood counter lanterns.\n- No build step — a single `index.html` plus a `styles.css` and a small `app.js`.\n  Keep the JavaScript a progressive enhancement (the page must read fine if JS\n  doesn't run) and persist nothing — it's a static site.\n- Keep it accessible (semantic HTML, labelled controls, keyboard support for the\n  menu and lightbox, good contrast, respects reduced-motion).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"menu\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/menu"},{"slug":"recipes","publishSlug":"recipes","title":"Recipe blog","name":"The Copper Skillet","vertical":"Personal & creative","tech":"Vite + React","summary":"A weeknight recipe blog with a searchable, filterable index and recipe pages that scale servings and print a clean card.","order":5,"liveUrl":"https://recipes.view.fast/","previewUrl":"https://recipes.view.fast/","setupQuestions":["What's your name and the blog's name?","What cuisine or style is the focus (e.g. Mediterranean weeknight, baking, one-pot)?","Give me 3–5 starter recipes, including one signature dish, with ingredients and steps.","Which dietary tags should the filters support (e.g. vegetarian, gluten-free, 30-minute)?"],"photoTerms":["overhead flatlay pasta dish rustic","kitchen ingredients on wooden cutting board","homemade dessert close up macro","cook plating food in home kitchen"],"prompt":"Build me a **weeknight recipe blog with a filterable recipe index and printable, scalable recipe pages** as a **Vite + React app** (keep dependencies minimal — just React; no UI kit).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your name and the blog's name?\n2. What cuisine or style is the focus (e.g. Mediterranean weeknight, baking, one-pot)?\n3. Give me 3–5 starter recipes, including one signature dish, with ingredients and steps.\n4. Which dietary tags should the filters support (e.g. vegetarian, gluten-free, 30-minute)?\n\n**Then build a complete, polished, responsive site with:**\n\n- **Home** — a full-bleed hero featuring this week's signature recipe (big title, blurb, \"Get the recipe\" button) plus a \"Fresh from the kitchen\" grid of the latest recipes.\n- **Recipe index** — every recipe as a card, with a live search box (matches title and ingredients) and chip filters for course, cuisine, and dietary tags. The result count updates as I filter, and there's a friendly empty state and a \"clear filters\" button.\n- **Recipe page** — hero photo, intro in the cook's voice, a prep / cook / total / serves stat bar, an **ingredients list with a serving-size scaler** (a slider plus +/− that recomputes every quantity into nice kitchen fractions like ¾ and 1½), checkable ingredients, a numbered step-by-step method, and a \"Nora's tip\" callout.\n- **Print card** — a \"Print card\" button that opens the browser print dialog showing a clean, single-page card (title, scaled ingredients, numbered method, tip) with all the site chrome hidden via a print stylesheet.\n- **About the cook** — a warm, personal bio with a photo and a few playful stats.\n- **Newsletter / save-this-recipe signup** — name + email that validates the email and shows a friendly \"You're on the list!\" success state on submit.\n\n**Design & content notes:**\n\n- Warm, appetizing editorial feel: cream paper background, a copper/terracotta accent, a deep-olive secondary, an elegant serif (e.g. Fraunces) for headings and a clean sans (e.g. Inter) for body. Generous whitespace, rounded cards, soft shadows.\n- Write real, specific recipe copy from my answers — never \"lorem ipsum\". Invent believable intros, quantities, steps, and tips. Make the signature dish genuinely appealing.\n- Use real images. Pull free food photos that fit each recipe, e.g.\n  `https://picsum.photos/seed/pasta-1/1200/800` (vary the seed for ingredients, dessert, and a cook-in-the-kitchen shot), with descriptive `alt` text.\n- Use a small client-side hash router so Home / Recipes / each recipe / About are real shareable URLs, and keep the serving scaler state on each recipe page.\n- Keep it accessible (semantic HTML, labelled form fields and filters, keyboard support, good contrast) and mobile-first (collapsing nav, filters stack above results on small screens).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"recipes\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/recipes"},{"slug":"garden","publishSlug":"garden","title":"Community garden","name":"Maple Street Community Garden","vertical":"Local & small business","tech":"Plain HTML & CSS","summary":"A welcoming one-pager for a neighborhood community garden — plots and pricing, a waitlist signup, volunteer workdays, rules, and seasonal events.","order":6,"liveUrl":"https://garden.view.fast/","previewUrl":"https://garden.view.fast/","setupQuestions":["What's the garden's name and which neighborhood or street is it on?","What plot sizes do you rent and what's the annual fee for each?","How many volunteer hours are members expected to contribute (e.g. 2 hours/month)?","What's the best contact email or person for the waitlist?"],"photoTerms":["community garden raised beds vegetables volunteers","hands planting seedlings in soil close up","ripe tomatoes and leafy greens garden harvest","community potluck outdoor table garden"],"prompt":"Build me a **one-page website for my neighborhood community garden** as plain HTML &\nCSS with a touch of vanilla JavaScript (no build step, no framework — just an\n`index.html`, a stylesheet, and a small script).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the garden's name and which neighborhood or street is it on?\n2. What plot sizes do you rent and what's the annual fee for each?\n3. How many volunteer hours are members expected to contribute (e.g. 2 hours/month)?\n4. What's the best contact email or person for the waitlist?\n\n**Then build a complete, polished, responsive one-pager with:**\n\n- A full-bleed **hero**: the garden's name big over a sunny raised-beds photo, the\n  neighborhood and \"since {year}\" as a tagline, and two buttons — \"Join the plot\n  waitlist\" and \"See plots & pricing\".\n- An **About** section: the garden's mission and a short origin story (an empty lot\n  turned into beds), who tends it (volunteer-run, a steering committee), and a little\n  stat strip (number of beds, member households, volunteer hours, % organic).\n- A **Plots & pricing** section: a card per bed size (e.g. 4×4, 4×8, 4×12, plus a\n  waist-high accessible bed) with dimensions, the annual fee, and a one-line pitch —\n  flag the most popular — followed by an \"every plot includes\" list (water, shared\n  tools, compost, seed library, gate access) and a quiet note about a scholarship\n  fund.\n- A **How to join** section: a 3-step explainer and a **waitlist signup form** (name,\n  email, street/block, preferred bed size, optional note). On submit it validates and\n  shows a friendly \"You're on the list\" success state — and remembers the visitor with\n  `localStorage` so a return visit greets them. State the **48-hour response policy**.\n- A **Volunteer workdays** section: explain the required hours, list the ways to\n  contribute, and show a live \"next drop-in workday\" badge computed in the browser\n  (e.g. the 2nd Saturday of the month, 9 am–12 pm).\n- A **Garden rules** section: five or six friendly rule cards — organic-only, tend\n  your plot, share the commons, be a good neighbor, water wisely, log your hours.\n- An **Events** section: a dated list of seasonal events — a seed swap, a spring\n  kickoff, summer potlucks, and a harvest festival — each with a date chip, time, and\n  a sentence of flavor.\n- A **Find us** section: address, gate-access notes (members keyed in, visitors\n  welcome on workdays, accessible entrance), an embedded Google map, and a \"Get\n  directions\" button.\n- A **photo gallery** of the beds across the seasons as a responsive grid, where\n  tapping a photo opens it larger in a lightbox (keyboard + arrow-key navigation, Esc\n  to close).\n- A **footer** with the address, email, quick links, and Instagram / email / map\n  icons.\n\n**Design & content notes:**\n\n- Warm, growing mood: deep leaf-green and soil-brown with a terracotta accent and a\n  touch of sun-gold, all on a cream-paper background. A friendly serif (e.g. Fraunces)\n  for headings and the brand, a clean sans (e.g. Inter) for body. Small leaf/sprout\n  flourishes are welcome.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  bed descriptions, an origin story, plausible event dates, and a coordinator's name.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/community-garden-1/1200/800` (vary the seed) or Pexels,\n  with descriptive `alt` text. Good search terms: community garden raised beds\n  vegetables volunteers; hands planting seedlings in soil close up; ripe tomatoes and\n  leafy greens garden harvest; community potluck outdoor table garden.\n- No build step — a single `index.html` plus a `styles.css` and a small `app.js`.\n  Keep the JavaScript a progressive enhancement (the page must read fine if JS\n  doesn't run); the only thing it persists is the visitor's own \"I joined\" flag.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support for the\n  form and lightbox, good contrast, respects reduced-motion).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"garden\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/garden"},{"slug":"hackathon","publishSlug":"hackathon","title":"Hackathon","name":"RamHacks 2026","vertical":"Local & small business","tech":"Vanilla JS","summary":"An energetic landing site for a 36-hour student hackathon — a live countdown to kickoff, a Saturday/Sunday schedule toggle, prize tracks, tiered sponsors, and an FAQ.","order":6,"liveUrl":"https://hackathon.view.fast/","previewUrl":"https://hackathon.view.fast/","setupQuestions":["What's the hackathon called and which school or org is hosting?","When does it start, and how long does it run (e.g. 36 hours starting Sat 10am)?","What are the prize amounts and any sponsor track names?","Who are your sponsors (a few names is fine)?"],"photoTerms":["students coding at hackathon late night laptops","hackathon team brainstorming sticky notes whiteboard","hackathon winners holding oversized check on stage","university auditorium opening ceremony crowd"],"prompt":"Build me an **energetic landing page for a student hackathon** as a vanilla-JS app\n(a single `index.html` plus `styles.css` and `app.js`, no framework, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the hackathon called and which school or org is hosting?\n2. When does it start, and how long does it run (e.g. 36 hours starting Sat 10am)?\n3. What are the prize amounts and any sponsor track names?\n4. Who are your sponsors (a few names is fine)?\n\n**Then build a complete, polished, responsive site with:**\n\n- A bold hero with the event name, host school, dates, and a **live countdown timer**\n  that ticks down to kickoff (days / hours / minutes / seconds). Handle the moment it\n  goes live (\"Hacking is live!\") and after it ends (\"That's a wrap — see you next year\").\n- An **About** section explaining what a hackathon is, who can join, team size (1–4),\n  and that it's free — beginners explicitly welcome.\n- A **Schedule** with a Saturday / Sunday day toggle that swaps the agenda: opening\n  ceremony, workshops, meals, a midnight snack, judging, and the closing ceremony.\n- A **Prizes & tracks** section: a hero grand prize plus sponsor category tracks\n  (Best Beginner Hack, Best Use of AI, Best Hardware Hack, Best Design, etc.).\n- A **Sponsors** section with tiered logos (Title / Gold / Startup) and a \"Sponsor us\" CTA.\n- An **FAQ accordion** (do I need experience, what to bring, is travel reimbursed, can I come alone).\n- A **Register** banner with a short form (name + email) that validates and shows a\n  friendly \"You're in!\" success state.\n- A footer with the **MLH Code of Conduct** link and Discord / Instagram / X links.\n\n**Design & content notes:**\n\n- Dark, high-energy hackathon mood: near-black indigo background, an electric-lime\n  accent with a violet secondary and a coral pop, a faint dot-grid behind the hero,\n  geometric display type (e.g. Space Grotesk) with a mono face (JetBrains Mono) for\n  the countdown digits and timestamps.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  schedule items, prize tracks, sponsor names, and FAQ answers.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/ramhacks-2026-1/1200/800` (vary the seed per image),\n  with descriptive `alt` text.\n- The countdown, the day toggle, the FAQ accordion, and the form all run in plain\n  vanilla JS — no framework, no build step, just three static files.\n- Keep it accessible (semantic HTML, labelled fields, keyboard-operable tabs and\n  accordion, good contrast, a skip link).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"hackathon\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/hackathon"},{"slug":"portfolio","publishSlug":"portfolio","title":"Portfolio","name":"Avery Chen's Room","vertical":"Personal & creative","tech":"HTML5 canvas game","summary":"An explorable pixel-art portfolio — walk a little avatar around a cozy room and step up to the desk, bookshelf, poster, and mailbox to reveal projects, an about, a resume, and contact links.","order":6,"liveUrl":"https://portfolio.view.fast/","previewUrl":"https://portfolio.view.fast/","setupQuestions":["What's your name and the one-line title you want under it (e.g. \"frontend engineer\")?","Which 3-5 projects should the desk reveal — name, one-line description, tech stack, and link for each?","What's the short \"about me\" the bookshelf should tell, and what are your top skills for the resume poster?","What contact and social links should the mailbox open (email, GitHub, LinkedIn)?"],"photoTerms":["pixel art cozy room game asset","16-bit interior tileset desk bookshelf","retro game character sprite walk cycle","isometric pixel workspace plants lamp"],"prompt":"Build me an **explorable pixel-art portfolio — a little room I can walk around where\neach object reveals part of my work** as an **HTML5 canvas game** (a single,\nself-contained `index.html` with all the JavaScript inline — no build step, no\nframework, no image files; draw every sprite procedurally on a `<canvas>`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your name and the one-line title you want under it (e.g. \"frontend engineer\")?\n2. Which 3–5 projects should the desk reveal — name, one-line description, tech stack, and link for each?\n3. What's the short \"about me\" the bookshelf should tell, and what are your top skills for the resume poster?\n4. What contact and social links should the mailbox open (email, GitHub, LinkedIn)?\n\n**Then build a complete, polished, responsive canvas game with:**\n\n- A cozy, tile-based room drawn in pixel art on a `<canvas>`: warm wood floor, a sage\n  wall with a window, a rug, a plant, and a soft floor lamp. Keep a fixed low\n  internal resolution (e.g. 320×208) and scale it up crisply with\n  `image-rendering: pixelated`.\n- A movable avatar with a real game loop: **arrow keys or WASD** to walk, a 4-direction\n  walk-cycle animation, and AABB collision so it can't walk through furniture or walls.\n- Four interactable objects, each with a \"stand near it\" trigger zone, a floating\n  prompt, and **press E (or tap the object)** to open a panel:\n  - **Desk / computer → Projects** — a card per project with description, tech tags, and a link.\n  - **Bookshelf → About me** — the short story in my voice.\n  - **Framed poster → Resume / skills** — skill bars plus a tiny work-history timeline.\n  - **Mailbox → Contact** — email + social links as real, clickable rows.\n- An intro overlay that explains the controls, with an \"Enter the room\" button.\n- A mobile fallback: an on-screen D-pad + an action button, and tappable hotspots so\n  the whole thing works by touch.\n\n**Design & content notes:**\n\n- Cozy 16-bit game mood: warm woods and a calm sage wall, one orange accent and one\n  teal accent, a rounded display font for headings and a clean sans for body, plus a\n  monospace for little code/label details. Dark frame around the canvas.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  project blurbs and a plausible work history if I'm light on detail.\n- The panels are HTML overlays on top of the canvas, so the project links and contact\n  rows are real, focusable, accessible links — not pixels.\n- Optional polish: a tiny WebAudio \"blip\" when a panel opens, and a gentle bob on the\n  interaction prompt.\n- Keep it accessible: a descriptive `aria-label` on the canvas, real `<button>`s,\n  labelled links, good contrast, Escape to close a panel, and keyboard support\n  throughout. Respect `prefers-reduced-motion`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"portfolio\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/portfolio"},{"slug":"word-game","publishSlug":"word-game","title":"Word game","name":"Lexicle","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"A daily five-letter word game — six guesses, green/yellow/gray tiles, streak stats, and a shareable emoji grid.","order":6,"liveUrl":"https://word-game.view.fast/","previewUrl":"https://word-game.view.fast/","setupQuestions":["What should the game be named, and is there a theme for the word list?","What accent color should the correct (green) tiles use?","What hashtag or site name should appear when players share their result?","Fresh word every day, or an unlimited practice mode?"],"photoTerms":["scrabble letter tiles flat lay","clean typographic poster bold letters","green and yellow color swatch palette"],"prompt":"Build me a **daily five-letter word-guessing game** (a Wordle-style puzzle) as a\nself-contained **vanilla-JS app** — plain `index.html`, `style.css`, and JS files,\nno framework and no build step.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What should the game be named, and is there a theme for the word list (general English, movies, food, or your own custom word pack)?\n2. What accent color should the correct (green) tiles use to match your brand?\n3. What hashtag or site name should appear when players share their result grid?\n4. Should it be a fresh word every day, or an unlimited \"play again\" practice mode?\n\n**Then build a complete, polished, responsive game with:**\n\n- A **6×5 guess board** with flip-reveal tile animations — type a five-letter word,\n  press Enter, and each tile flips to reveal green (right letter, right spot),\n  yellow (right letter, wrong spot), or gray (not in the word).\n- An **on-screen QWERTY keyboard** that recolors each key by its best-known status,\n  plus full physical-keyboard support (letters, Enter, Backspace).\n- **Daily-word logic**: a deterministic word-of-the-day derived from the date, so\n  everyone gets the same puzzle each day. (Also offer the unlimited practice mode if\n  I asked for it.)\n- A **stats modal**: games played, win %, current streak, max streak, and a\n  guess-distribution bar chart that highlights today's result.\n- A **share button** that produces the spoiler-free emoji grid (🟩🟨⬛) and copies it\n  to the clipboard (use the Web Share API where available).\n- A **how-to-play modal** with example tiles, shown automatically on a player's first\n  visit.\n- **`localStorage` persistence** so refreshing keeps the in-progress board, stats,\n  streak, and theme, and a countdown to the next puzzle.\n\n**Design & content notes:**\n\n- Clean, modern, mobile-first: a calm dark theme by default with a light-mode toggle,\n  a serif display face for the wordmark and headings, a crisp sans for the UI, and the\n  green/yellow/gray tile palette as the visual signature.\n- Get the **duplicate-letter scoring right** — this is the part most clones get wrong.\n  Color greens first, then hand out yellows only while unused copies of a letter remain\n  in the answer, so a guessed letter never shows more times than it actually appears.\n- Use a real, curated five-letter word list (a few hundred answers is plenty) and a\n  larger set of accepted guesses; reject anything that isn't a valid word with a gentle\n  \"Not in word list\" shake. Never use \"lorem ipsum\".\n- Decorative imagery (the how-to-play card, social preview) can pull free photos that\n  fit, e.g. from Unsplash (`https://images.unsplash.com/...`) with scrabble-tile or bold\n  typographic themes and descriptive `alt` text.\n- Keep it accessible: semantic HTML, ARIA on the board and keys, labelled buttons, good\n  contrast in both themes, full keyboard play, and a `prefers-reduced-motion` fallback.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"word-game\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/word-game"},{"slug":"conference","publishSlug":"conference","title":"Conference site","name":"DevHorizon 2026","vertical":"Local & small business","tech":"Astro","summary":"A one-day, single-track web-dev conference site — hero with live countdown, speaker lineup, hour-by-hour schedule, ticket tiers, venue, and sponsors.","order":7,"liveUrl":"https://conference.view.fast/","previewUrl":"https://conference.view.fast/","setupQuestions":["What's the conference name, tagline, and one-line theme?","What date is it, and in which city / at which venue?","Name 4–6 speakers with their talk titles (and companies, if you have them).","What are your ticket tiers and prices (e.g. Early Bird $199 / Standard $299)?"],"photoTerms":["conference keynote speaker on stage with microphone","tech conference audience seated in auditorium","conference networking coffee break attendees talking","modern convention center glass exterior"],"prompt":"Build me a **marketing-and-schedule site for a one-day, single-track web development\nconference** as an **Astro site** (static output, no SSR, no backend).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the conference name, tagline, and one-line theme?\n2. What date is it, and in which city / at which venue?\n3. Name 4–6 speakers with their talk titles (and companies, if you have them).\n4. What are your ticket tiers and prices (e.g. Early Bird $199 / Standard $299)?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-bleed hero with the conference name, tagline, date, city/venue, a live\n  countdown to the first talk, and a \"Get tickets\" call to action.\n- An \"About\" section: the format, who it's for, and what to expect.\n- A \"Speakers\" grid with photos, names, companies, and talk titles — each card\n  expands to reveal the talk abstract.\n- A \"Schedule\" — a single-track vertical timeline of talks, breaks, lunch, and the\n  after-party, with times, speakers, and short notes.\n- \"Tickets\" — Early Bird / Standard / Team pricing cards with feature lists, a\n  highlighted \"most popular\" tier, and a sold-out state for early bird.\n- \"Venue & travel\" — the venue with address and a map link, how to get there, and a\n  few nearby hotels at different price points.\n- \"Sponsors\" — a tiered logo wall (Platinum / Gold / Community) with a \"Become a\n  sponsor\" link.\n- \"FAQ\" plus a short \"Code of Conduct\" panel.\n- A footer with social links and a newsletter signup that shows a friendly success\n  message on submit.\n\n**Design & content notes:**\n\n- Modern, technical, confident: a near-black background, an electric teal→violet\n  gradient as the one signature accent, a geometric display face for headings\n  (e.g. Space Grotesk), a clean sans for body (Inter), and a mono face\n  (JetBrains Mono) for labels, times, and the countdown.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  talk titles, abstracts, session times, hotel names, and sponsor names.\n- Use real images. Pull free photos that fit — e.g. `https://picsum.photos/seed/<unique-seed>/1200/800`\n  (vary the seed per image) or Unsplash direct URLs fitting \"conference keynote\n  speaker on stage\", \"tech conference audience in auditorium\", \"networking coffee\n  break\", and \"modern convention center glass exterior\" — each with descriptive\n  `alt` text.\n- Keep all content in a single `src/data/conf.ts` file so any detail is easy to\n  change. Build the countdown, the mobile nav, the speaker-card expand, and the\n  newsletter signup as small inline scripts — no heavy dependencies.\n- Mobile-first and accessible: semantic HTML, labelled form fields, good contrast,\n  keyboard support, and a visible focus style.\n\n**Add this exact line right before `</body>` (in your layout) so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"conference\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/conference"},{"slug":"newsletter","publishSlug":"newsletter","title":"Newsletter","name":"Offcuts","vertical":"Personal & creative","tech":"Plain HTML & CSS","summary":"A typographic home and archive for a curated weekly newsletter — featured issue, a full back catalogue, readable issue pages, and a working subscribe form.","order":7,"liveUrl":"https://newsletter.view.fast/","previewUrl":"https://newsletter.view.fast/","setupQuestions":["What's the newsletter's name and a one-line tagline?","What topic or niche does it cover?","Who's the author, and what's their short bio?","Give me 2-3 recent issue titles with a sentence of what each covered."],"photoTerms":["minimal desk workspace flatlay","stack of design books on table","abstract textured paper background","author portrait at desk window light"],"prompt":"Build me a **typographic home and archive for my curated weekly newsletter** as a\nsmall set of plain HTML & CSS pages (no build step, no framework). It should list\nevery numbered issue with a one-line blurb and render past issues as clean, readable\nweb pages with a prominent subscribe form.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the newsletter's name and a one-line tagline?\n2. What topic or niche does it cover?\n3. Who's the author, and what's their short bio?\n4. Give me 2–3 recent issue titles with a sentence of what each covered.\n\n**Then build a complete, polished, responsive site with:**\n\n- A **home page**: a short \"what it is\" intro, a featured/sample issue card, and an\n  email subscribe form. Make the value obvious in one screen.\n- An **issue archive**: a reverse-chronological list of numbered issues, each with\n  its number, date, title, and a one-line summary. Make the rows feel like a real\n  back catalogue (a dozen or so), linking to the full issues you write out.\n- **Issue pages** (write out the recent ones in full): a numbered, dated header, a\n  short intro/essay, a \"hand-picked links\" list with a sentence on each, and a\n  \"Tool of the week\" callout. Add prev/next navigation between issues.\n- An **about page** with the author's photo, bio, the why-behind-the-letter, and a\n  couple of honest stats (issues sent, readers, cadence).\n- A **subscribe page** with the email capture front-and-centre plus a short, plain\n  \"fine print\" (cadence, privacy, how to leave).\n\n**Design & content notes:**\n\n- Editorial and typography-led: a warm paper background, near-black ink, one\n  restrained accent colour, a characterful serif for display (e.g. Fraunces or\n  Newsreader), a readable serif for body, and a small mono for labels and dates.\n  Think Dense Discovery / The Browser — generous whitespace, real reading hierarchy,\n  numbered issues, a drop cap on issue pages.\n- Write real, specific copy from my answers — never \"lorem ipsum\". Invent believable\n  issue titles, link blurbs, and a plausible issue number and dates.\n- Use real images. Pull free photos that fit, e.g. from Picsum\n  (`https://picsum.photos/seed/newsletter-issue-1/1200/800`, varying the seed), for the\n  sample issue, issue headers, and an author portrait — all with descriptive `alt`\n  text matching: minimal desk workspace flatlay, stack of design books on a table,\n  abstract textured paper background, author portrait at desk window light.\n- The subscribe form should work client-side: validate the email and show a friendly,\n  personalised \"You're on the list\" success state (no backend). Persist the\n  subscriber in `localStorage` so returning readers see the confirmed state.\n- Keep it accessible (semantic HTML, a skip link, labelled fields, keyboard support,\n  good contrast).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"newsletter\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/newsletter"},{"slug":"cli","publishSlug":"cli","title":"Dev-tool landing","name":"Drift","vertical":"Data, internal & startup","tech":"Astro","summary":"A homepage for an open-source database-migration CLI, built for developers: a hero with a one-line install command and copy button, GitHub star count, a syntax-highlighted code example, feature grid, and links to docs and Discord.","order":8,"liveUrl":"https://cli.view.fast/","previewUrl":"https://cli.view.fast/","setupQuestions":["What's the project name and the one-line description of what it does?","What's the install command and which ecosystem/language is it for (npm, pip, brew, cargo)?","What are the 3-4 key selling points (speed, type-safety, zero-config)?","What's the GitHub repo URL and do you have a Discord/community link?"],"photoTerms":["terminal code editor dark theme screenshot","developer keyboard closeup low light","abstract isometric tech illustration nodes","geometric gradient mesh tech background"],"prompt":"Build me a **landing page for an open-source developer tool** — a CLI with a one-line\ninstall command, a star badge, and syntax-highlighted code samples — as a small static\n**Astro site** (no SSR, no adapters — just `astro build`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the project name and the one-line description of what it does?\n2. What's the install command and which ecosystem/language is it for (npm, pip, brew, cargo)?\n3. What are the 3–4 key selling points (speed, type-safety, zero-config)?\n4. What's the GitHub repo URL and do you have a Discord/community link?\n\n**Then build a complete, polished, responsive site with:**\n\n- A sticky **nav** with the logo, a version pill, section links, a GitHub star count, and\n  a \"Get started\" button.\n- A **hero**: the project name, a sharp tagline, a short blurb, and — front and center — a\n  **copy-to-clipboard install command** (a `$ npm i …` box with a Copy button that flips\n  to \"Copied ✓\"). Below it: \"Get started\" + \"Star on GitHub\" buttons and a row of the\n  databases/platforms it supports.\n- A **quick code example**: a terminal block showing the core four-command workflow, then\n  a side-by-side \"you write the schema → the tool writes the migration\" pair, all\n  **syntax-highlighted** (use Astro's built-in `<Code>` / Shiki — highlighted at build\n  time, zero runtime JS).\n- A **feature grid** (e.g. fast, type-safe, zero-config, framework-agnostic, reviewable\n  output, safe rollbacks) — each with an icon, title, and a real sentence of detail.\n- A **\"How it works\"** three-step flow (connect → generate → apply), each step showing the\n  exact command.\n- A **benchmark / comparison band**: horizontal bars comparing the tool to the status quo,\n  with your tool highlighted, plus a short caveat note and a developer testimonial.\n- A **\"Used by\" / sponsors logo wall** of plausible companies.\n- A **community section**: GitHub, Discord, and Contributing cards, then a grid of docs\n  link cards.\n- A **footer** with product / docs / community / supported-DB columns and a license line.\n\n**Design & content notes:**\n\n- Developer-tool aesthetic: near-black background, one bright accent (a teal/mint that\n  reads as \"in sync\"), a violet secondary for gradients, a faint grid in the hero. Use a\n  geometric display face (e.g. Space Grotesk) for headings, a clean sans (Inter) for body,\n  and a monospace (JetBrains Mono) for commands, code chrome, and labels.\n- Write realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  code samples, feature copy, benchmark numbers, company names, and a testimonial.\n- The install command and the code blocks are the heart of the page — make the copy button\n  actually work (write to the clipboard, show a \"Copied\" state for ~2s, with a fallback for\n  browsers without the async clipboard API).\n- Use real images where they help. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/<your-seed>/1200/800` (vary the seed per image, e.g. for the\n  testimonial avatar and the OG image), with descriptive `alt` text.\n- Keep **all** the content (project, install command, features, steps, benchmark rows,\n  logo wall, docs cards) in a single `src/data/site.ts` file so one edit updates the whole\n  page. Split the page into small Astro components.\n- Keep it accessible: semantic HTML, a skip link, labelled controls, keyboard support,\n  visible focus rings, and good contrast. Preconnect the fonts; lazy-load below-the-fold\n  images.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"cli\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/cli"},{"slug":"saas","publishSlug":"saas","title":"SaaS landing","name":"Tideline","vertical":"Data, internal & startup","tech":"Astro","summary":"A dark-mode B2B SaaS landing page for an issue tracker — hero screenshot, logo cloud, feature deep-dives, testimonials, pricing, and FAQ.","order":8,"liveUrl":"https://saas.view.fast/","previewUrl":"https://saas.view.fast/","setupQuestions":["What's the product name and the one-sentence outcome it delivers (e.g. \"plan, track, and ship product work in one place\")?","Who is the target customer — what kind of team or role?","What are your 3-4 core features to highlight?","Do you have customer or company names to use as social proof, or should I use realistic placeholders?"],"photoTerms":["saas dashboard ui screenshot dark mode","product team standup meeting candid","kanban board project management interface","abstract gradient mesh background purple"],"prompt":"Build me a **marketing site for a B2B SaaS product** (a Linear-style dark-mode\nlanding page) as an **Astro site** (static, no SSR — just `astro build` to plain\nHTML/CSS).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the product name and the one-sentence outcome it delivers (e.g. \"plan, track, and ship product work in one place\")?\n2. Who is the target customer — what kind of team or role?\n3. What are your 3–4 core features to highlight?\n4. Do you have customer or company names to use as social proof, or should I use realistic placeholders?\n\n**Then build a complete, polished, responsive site with:**\n\n- A sticky nav with product / pricing / customers / docs links and a \"Start free\" CTA.\n- A hero: a one-line outcome headline, a sub-headline, an email-only signup, and a hero product screenshot.\n- A logo cloud / \"trusted by\" social-proof strip.\n- Three or four feature deep-dives, alternating image + copy (e.g. issues, sprints/cycles, roadmap, keyboard-driven workflow), each with a short bulleted list of specifics.\n- A metric / stat band (\"Ship 30% faster\") with three or four big numbers.\n- Customer testimonial quotes with avatars, names, and companies.\n- A pricing table — Free / Team / Enterprise — with a featured plan and a feature list per tier.\n- An FAQ accordion (use native `<details>`).\n- A footer CTA card plus a sitemap footer.\n\n**Design & content notes:**\n\n- Restrained, modern dark mode — near-black background, a single violet→cyan accent gradient, clean sans (Inter), tight letter-spacing on headings, generous whitespace. Think Linear / Vercel / Height.\n- For the product \"screenshots\", build a stylised app UI mock in HTML/CSS (a window with a sidebar, an issues board, a burndown chart, a roadmap, a command menu) rather than a stock photo — it looks far sharper and stays fast. Use real avatar photos for testimonials.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable issue titles, company names, testimonials, and pricing.\n- Use real images where photos make sense (testimonial avatars, any team shots). Pull free photos that fit, e.g. from Unsplash (`https://images.unsplash.com/...`) or `https://picsum.photos/seed/yourseed/96/96`, and add descriptive `alt` text.\n- Put copy in an Astro data module and loop over it in the page; split the product mock into its own component.\n- Keep it accessible (semantic HTML, a labelled email field, keyboard support, good contrast) and mobile-first (sidebar hides on small screens, plans stack, the featured plan floats to the top).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"saas\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/saas"},{"slug":"status","publishSlug":"status","title":"Status page","name":"Northwind API — System Status","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A public status page for an API product — overall-status banner, per-component 90-day uptime bars, an incident timeline, scheduled maintenance, and a subscribe box.","order":14,"liveUrl":"https://status.view.fast/","previewUrl":"https://status.view.fast/","setupQuestions":["What's the service or company name?","Which components or subsystems should be listed (e.g. API, Dashboard, Webhooks, CDN)?","What's your brand accent color and support email?","Is there a current incident or upcoming maintenance to show, or should it read all-clear?"],"photoTerms":["server room data center blue lights","green checkmark status indicator ui","minimal tech logo monochrome","network operations dark monitoring screen"],"prompt":"Build me a **public status page for my API / hosting product** — the kind of page linked from a footer and watched during an outage (think Stripe, Slack, or OpenAI status) — as a single self-contained static site (`index.html` + `styles.css` + `app.js`, no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the service or company name?\n2. Which components or subsystems should be listed (e.g. API, Dashboard, Webhooks, CDN, Database)?\n3. What's your brand accent color and support email?\n4. Is there a current incident or upcoming maintenance to show, or should it read all-clear?\n\n**Then build a complete, polished, responsive status page with:**\n\n- A sticky header with the brand and a big **overall-status banner** (\"All systems operational\" / \"Some systems degraded\" / \"Partial system outage\") with a live \"last updated\" timestamp and a headline 90-day uptime figure. The banner color and wording should be derived from the worst component state, not hard-coded.\n- A **components list** (one row per subsystem) where each row shows a colored status dot, the component name + short description, a status label, and a **90-day uptime bar graph** (90 thin cells, green for healthy with yellow/red/indigo for degraded/outage/maintenance days) plus the computed uptime percentage. Each cell has a tooltip with its date and state.\n- An **active-incident block** with a posted-update **timeline** that reads newest-first through the standard lifecycle: Investigating → Identified → Monitoring → Resolved, each entry timestamped in UTC.\n- A **scheduled maintenance** section with one or two upcoming windows (date chip, what's happening, and the maintenance window in UTC + a local timezone).\n- A **past-incidents history** grouped by date, each incident with a severity pill, a duration, and its own compact resolution timeline.\n- A **subscribe-to-updates** box: an email field that validates, shows an inline error for bad input, and on success swaps to a friendly \"You're subscribed\" confirmation (persist it in `localStorage` so it stays confirmed on reload). Include alternate channels — a Twitter/X handle, an RSS feed, and a status-webhook link.\n- A footer with the marketing site, docs, and support email.\n\n**Design & content notes:**\n\n- Calm, trustworthy NOC/dashboard aesthetic: dark navy background, generous whitespace, a single green \"operational\" accent plus amber/red/indigo for the other states, Inter for text and a monospace (e.g. JetBrains Mono) for timestamps and numbers. Status pages have a strict visual grammar — keep it clean and unambiguous.\n- Write real-sounding incident copy from my answers — never \"lorem ipsum\". Invent believable, specific incidents (e.g. \"a bad config push removed a connection-pool limit and saturated the primary database\"), realistic UTC timestamps, durations, and uptime numbers like 99.98%.\n- Generate the 90-day bars in JavaScript from per-component data so they're stable across reloads (a deterministic seed, with a few realistic blips), and compute each uptime percentage and the overall banner state from that data.\n- Use real images only where they help (this page is mostly UI). If you add any, pull free photos that fit, e.g. `https://picsum.photos/seed/server-room-1/1200/800`, with descriptive `alt` text.\n- Keep it accessible (semantic HTML, a labelled form, keyboard support, good contrast, `aria-label`s on the uptime bars and a polite live region on the banner) and mobile-first (the bars and timeline should reflow cleanly on a phone).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"status\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/status"},{"slug":"studio","publishSlug":"studio","title":"Design studio","name":"Northbound Studio","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A work-first portfolio for a brand & web design studio — statement hero, a JS-filtered project grid, a before/after case study, and a contact form.","order":22,"liveUrl":"https://studio.view.fast/","previewUrl":"https://studio.view.fast/","setupQuestions":["What's the studio name and your one-line positioning?","What disciplines do you offer (branding, web, motion, packaging)?","Name 3-4 projects and their clients to feature as work.","What's the contact email and where are you based?"],"photoTerms":["branding mockup flatlay stationery","design studio workspace moodboard","bold typographic poster design","packaging design product photography"],"prompt":"Build me a **portfolio site for my brand &amp; web design studio** as a vanilla-JS app\n(no build step, no framework — just `index.html`, `styles.css`, and a little `app.js`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the studio name and your one-line positioning?\n2. What disciplines do you offer (branding, web, motion, packaging)?\n3. Name 3–4 projects and their clients to feature as work.\n4. What's the contact email and where are you based?\n\n**Then build a complete, polished, responsive site with:**\n\n- A bold, full-bleed statement hero — a big confident headline (e.g. \"We build brands\n  people remember\"), a one-line studio description, two calls to action, and a few\n  proof-point stats (founded year, brands shipped, team size).\n- A **Selected work** section: a project grid where each card has a cover image,\n  discipline tags, project name, and a one-line description. Add filter chips\n  (All / Branding / Web / Motion) that **toggle the grid in JavaScript**, with a\n  graceful empty state.\n- A **featured case study** highlight on a dark band — short narrative, a few result\n  stats, a client quote, and a **before/after** image you can toggle in JS.\n- A **Services** list (brand identity, web design &amp; build, art direction, motion),\n  numbered, each with a short description and a tag of sub-deliverables.\n- An **About / studio philosophy** section with a couple of paragraphs in the studio's\n  voice and a small team grid (photo, name, role).\n- A **client logo strip** as a row of wordmarks.\n- A **contact form** (name, email, project type, message) that validates inline and\n  shows a friendly, personalized success state — no backend.\n- A footer with the studio email, social links, and location.\n\n**Design &amp; content notes:**\n\n- Editorial boutique-studio mood: warm paper/cream background, near-black ink, and one\n  bold accent (a vermilion/coral). Pair a high-contrast serif display (Fraunces) for\n  headlines with a clean grotesque (Space Grotesk) for body. Generous whitespace, a\n  thin running marquee of disciplines, subtle hover lifts and image zooms — no slop.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  project names, client quotes, result numbers, team members, and bios.\n- Use real images. Pull free photos that fit, e.g. from\n  `https://picsum.photos/seed/northbound-studio-1/1200/800` (vary the seed per image)\n  or fitting Unsplash photos of branding mockup flatlays, a design-studio workspace,\n  bold typographic posters, and packaging — all with descriptive `alt` text.\n- Keep it accessible (semantic HTML, labelled form fields, good contrast, keyboard\n  support, a skip link) and mobile-first with a working hamburger menu. Persist nothing\n  to a server; do all interactivity (filter, before/after, form) in plain JS.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"studio\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/studio"},{"slug":"wp-astro","publishSlug":"wp-astro","title":"WordPress + Astro","name":"Headless WordPress + Astro","vertical":"Developers & integrations","tech":"Astro + WP REST API","summary":"A static editorial blog whose posts are pulled from a public WordPress REST API at build time and rendered to flat HTML with Astro — headless WordPress, no server at request time.","order":200,"liveUrl":"https://wp-astro.view.fast/","previewUrl":"https://wp-astro.view.fast/","setupQuestions":["What's the WordPress site to pull from (the REST API base, e.g. https://wordpress.org/news/wp-json/wp/v2)?","What should the blog be called?","Which categories, authors, or content types should be featured or excluded?","What's the accent color (a hex like"],"photoTerms":["wordpress dashboard on laptop screen","developer writing code editor closeup","abstract content management network nodes"],"prompt":"Build me a **headless WordPress blog** as an **Astro site** that fetches posts from a public WordPress REST API **at build time** and renders them to static HTML. WordPress stays the place I write; Astro is the renderer; Spacefast hosts the result. No server, no PHP, and no database run when a visitor loads the page.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the WordPress site you want to pull from? Give me the site URL — I'll use its REST API at `<url>/wp-json/wp/v2` (any public WordPress.org-hosted or self-hosted site works; if you're not sure, use `https://wordpress.org/news`).\n2. What should the blog be called (the title in the header and browser tab)?\n3. Which categories, authors, or content types should be featured or excluded?\n4. What's the accent color (a hex like `#0b6e4f`), and should the visual tone feel\n   like a newspaper, magazine, or personal blog?\n\n**Then build a complete, polished, responsive site with:**\n\n- A small build-time data layer that fetches `/<api>/posts?_embed&per_page=12` once, during `astro build`, and normalizes each post (title, date, author, featured image, categories, rendered HTML) into a tidy shape the pages consume. Use `?_embed` so the author and featured image come back in the same request — no N+1 follow-ups.\n- A blog index: a full-width lead story followed by a responsive grid of post cards, each with featured image, category tags, title, excerpt, author + avatar, date, and reading time.\n- A static page per post (`/<slug>/`) generated with `getStaticPaths`: title, category tags, author + avatar, date, reading time, a featured-image banner, and the post's rendered HTML styled as clean editorial \"prose\" (headings, figures, blockquotes, lists, code).\n- A short header strip that explains: **\"Content from WordPress, rendered statically with Astro, hosted on Spacefast.\"** plus a small \"Source: <site>\" link.\n- A footer crediting the WordPress REST API source, Astro, and Spacefast.\n\n**Design & content notes:**\n\n- Editorial-magazine feel: a serif display face for headings (a system serif stack is fine — no heavy web fonts needed), a clean sans for body, generous whitespace, warm off-white background, and the one accent color used for tags, links, and buttons.\n- Real content only — every post comes from the live WordPress API, never \"lorem ipsum\".\n- **Handle missing featured images** with a tasteful placeholder (a soft tinted panel with the post's first initial), not a broken image. Some WordPress posts have no featured image — prefer the `_embedded` featured media, fall back to `jetpack_featured_media_url` if present, otherwise show the placeholder.\n- Keep WordPress's rendered HTML safe to drop in, and make sure images inside post content keep their aspect ratio (`height: auto`) so nothing stretches.\n- Use Astro's static output (`astro build` → `dist/`). No SSR adapter, no runtime fetch.\n- Keep it accessible: semantic HTML, a skip link, alt text on images, labelled landmarks, visible focus states, and good contrast (auto-pick black/white text on the accent).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"wp-astro\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/wp-astro"},{"slug":"wp-react","publishSlug":"wp-react","title":"WordPress + React","name":"WordPress + React SPA","vertical":"Developers & integrations","tech":"Vite + React + WP REST API","summary":"A polished reading app that fetches posts live from a WordPress REST API in the browser — card list, article view, client-side routing, search, and real loading/error states.","order":201,"liveUrl":"https://wp-react.view.fast/","previewUrl":"https://wp-react.view.fast/","setupQuestions":["What's the WordPress REST API base URL? (e.g. https://your-site.com/wp-json/wp/v2; or use the demo https://wordpress.org/news/wp-json/wp/v2)","What should the app be called, and what's a one-line tagline?","Which categories, authors, or post types should be searchable or featured?","Light theme, dark theme, or a toggle that remembers my choice?"],"photoTerms":[],"prompt":"Build me a **single-page reading app that pulls posts from a WordPress site over\nits public REST API** as a **Vite + React app** (client-side only — the browser\nfetches the content at runtime, no backend, no server-side rendering).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the WordPress REST API base URL? (e.g. `https://your-site.com/wp-json/wp/v2`.\n   If you don't have one, use the always-on public demo `https://wordpress.org/news/wp-json/wp/v2`.)\n2. What should the app be called, and what's a one-line tagline?\n3. Which categories, authors, or post types should be searchable or featured?\n4. Light theme, dark theme, or a toggle that remembers my choice?\n\n**Then build a complete, polished, responsive reading app with:**\n\n- A **post list** view: a responsive grid of cards, each with the post's title,\n  a short excerpt, the author, the date, an estimated reading time, and the\n  featured image (read from the `_embedded` data so it's one request, not many).\n  Lead with one larger \"featured\" card for the newest post.\n- A **post detail** view: the title, the author (avatar + name), the date and\n  reading time, the featured image with its caption, and the full rendered post\n  body. Render the post HTML with `dangerouslySetInnerHTML`, but **sanitize it\n  first** (use DOMPurify) so nothing in the feed can run script.\n- **Client-side routing** so each post has its own URL. A hash router\n  (`#/` for the list, `#/post/:id` for a post) keeps deep links working on any\n  static host. Back/forward and refresh must land on the right view.\n- A **search box** that queries the API's `search` parameter (debounced), and\n  simple **pagination** (Newer / Older) driven by the `X-WP-TotalPages` header.\n- Real **loading, empty, and error states**: skeleton cards while a request is in\n  flight, a friendly \"no results\" message, and a recoverable error panel with a\n  working \"Try again\" button for when the API is slow or down. The app must never\n  show a blank white screen.\n\n**Design & content notes:**\n\n- A calm, editorial reading look: a serif face (Georgia / Iowan) for headlines and\n  article body for readability, a clean system sans for UI, generous line-height,\n  and one restrained accent color. Cards lift gently on hover; images fade in.\n- Honor my light/dark choice. If I asked for a toggle, default to the OS preference\n  and persist my pick in `localStorage`.\n- The content is real — it comes live from the WordPress REST API at runtime, so\n  there's no \"lorem ipsum\" to write. For any post without a featured image, show a\n  tasteful gradient placeholder instead of a broken image.\n- Keep everything configurable from one small `src/config.js` (API base URL, app\n  title, tagline, page size) so I can point it at a different WordPress site by\n  changing one line.\n- Because this is a single-page app, add a **SPA fallback** so deep links resolve:\n  put a `_redirects` file in `public/` containing `/*  /index.html  200` (Vite\n  copies `public/` into the build output, so it lands in `dist/`).\n- Mobile-first and accessible: semantic HTML, a skip link, labelled inputs,\n  keyboard support, visible focus styles, good contrast, and `alt` text from the\n  WordPress media data. Respect `prefers-reduced-motion`.\n- Build it with Vite (`npm create vite@latest` / `react` template), then\n  `npm run build` to produce the static `dist/` you'll publish.\n\n**Add this exact line right before `</body>` in `index.html` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"wp-react\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/wp-react"},{"slug":"unfurl","publishSlug":"unfurl","title":"Link preview inspector","name":"Unfurl — link preview inspector","vertical":"Developers & integrations","tech":"Next.js SSR (Functions)","summary":"Paste any URL and the server fetches it, parses its OpenGraph and Twitter-card metadata, and renders the social preview card — a Next.js Route Handler plus an SSR page running on the Spacefast Functions runtime.","order":210,"runtime":"functions","liveUrl":"https://unfurl.view.fast/","previewUrl":"https://unfurl.view.fast/","setupQuestions":["What should the tool be called (the name in the header and browser tab)?","What's the accent color (a hex like #b6ff3d), and should it feel like a dark developer tool or a light consumer app?","Which three example URLs should the landing page offer as one-click demos?","Should the result page expose the raw JSON from the API alongside the rendered card?"],"photoTerms":[],"prompt":"Build me a **link preview inspector** as a **Next.js app that runs on a server** — I paste any URL, the server fetches that page, parses its OpenGraph and Twitter-card metadata, and renders the social preview card the way Slack or iMessage would. This one genuinely needs a server: a browser can't fetch a cross-origin page and read its `<head>`, so no amount of client JavaScript can fake it.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What should the tool be called (the name in the header and the browser tab)?\n2. What's the accent color (a hex like `#b6ff3d`), and should it feel like a dark developer tool or a light consumer app?\n3. Which three example URLs should the landing page offer as one-click demos?\n4. Should the result page expose the raw JSON from the API next to the rendered card, or keep it clean?\n\n**Then build a complete, polished, responsive app with:**\n\n- A **static landing page** at `/`: a short hero explaining what unfurling is, a single big \"paste a URL\" form that submits with `method=\"get\"` to the result page, and the example links from my answers. No data fetching here — this page should be prerendered so it serves straight off disk.\n- A **Route Handler** at `app/api/unfurl/route.ts` — `GET /api/unfurl?url=…` returns normalized JSON: `{ url, finalUrl, siteName, title, description, image, imageAlt, favicon, themeColor, type, fetchedAt }`. It fetches the target page server-side, reads only the `<head>`, and prefers `og:*`, then `twitter:*`, then plain `<meta name=\"description\">` / `<title>`. Resolve relative `og:image` and favicon URLs against the final URL.\n- **Harden that handler against SSRF — this is the part that separates a demo from a real service:**\n  - allow only `http:` and `https:`; reject everything else (`file:`, `data:`, `ftp:`, …),\n  - reject `localhost`, `*.local`, `*.internal`, bare single-label hostnames, and any IP literal in a private, loopback, link-local, or carrier-grade-NAT range (v4 and v6, including IPv4-mapped v6),\n  - resolve the hostname and check **every** returned address against the same rules where DNS resolution is available,\n  - follow redirects **manually**, capped at 3 hops, re-running the address checks on each hop, so a public URL can't bounce you into `169.254.169.254`,\n  - cap the response body (512 KB is plenty — metadata lives in the `<head>`) and stop reading once `</head>` arrives,\n  - set an 8-second timeout with `AbortSignal.timeout`, and send an honest descriptive `User-Agent` that identifies the tool.\n- A **server-rendered result page** at `/u?url=…` that does the unfurl during the request and renders the card in the HTML — view-source should show the title and description, not an empty shell. This is the page that proves per-request rendering.\n- A **preview card that actually looks good**: 16:9 `og:image` with a tasteful gradient-and-initial fallback when there is no image or it fails to load, favicon + domain row, title, description clamped to a few lines, site name and content type as small chips, and the resolved final URL as a link.\n- **Real error states**, each with its own message — malformed URL, blocked address, timeout, upstream error status, and \"the page loaded but has no metadata at all\" (still show the domain and title if there is one). Never a bare stack trace, never a blank card.\n- A **`middleware.ts`** that does two small real jobs: normalize a bare-domain `url` param (someone pastes `github.com`, you redirect to `?url=https://github.com`) and stamp security headers (`X-Content-Type-Options: nosniff`, `Referrer-Policy: strict-origin-when-cross-origin`) on responses.\n\n**Design & content notes:**\n\n- Developer-tool polish: a calm dark canvas, one accent color used sparingly for focus rings and the submit button, a mono face for URLs and JSON, generous whitespace, and a card that looks like the thing it's previewing.\n- Real content only — the examples must be live URLs that actually unfurl, never \"lorem ipsum\".\n- Keep it accessible: a labelled input, a skip link, `aria-live` on the result region, visible focus states, `alt` text driven by `og:image:alt`, and contrast that passes AA.\n- Responsive down to a phone: the card stacks, the image keeps its aspect ratio, long URLs wrap instead of overflowing.\n\n**Runtime rules that make this build work on Spacefast — get these wrong and the publish fails:**\n\n- **No `output: \"export\"`** in `next.config.ts`. That's the static-export path; you need the server.\n- **No `export const runtime = \"edge\"`** anywhere. The adapter uses the Node.js runtime.\n- **Don't install an adapter and don't write `open-next.config.ts`.** Spacefast builds the app with a pinned OpenNext Cloudflare adapter at publish time. Keep the project a plain Next.js app.\n\n**Add this exact line right before `</body>` in the root layout so the app carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"unfurl\"></script>\n```\n\n**When the app is ready, publish it to Spacefast with the `sf` CLI — no account needed for the first publish:**\n\n1. Install the CLI if it isn't there: `npm i -g spacefast` (or `bun add -g spacefast`).\n2. From the project root — the directory holding `package.json` and `app/` — preview the plan first:\n   ```bash\n   sf publish --dry-run\n   ```\n   Check that it reports the `next` framework preset. The Functions runtime is resolved during the real publish, after `next build` runs.\n3. Publish for real and wait for it to go live:\n   ```bash\n   sf publish --wait --json\n   ```\n   Spacefast uploads the source, runs `next build`, bundles the output with the pinned OpenNext Cloudflare adapter, and ships the static half and the worker as one version.\n4. From the `{ \"data\": … }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret — the CLI already saved it under `.spacefast/`, which must stay out of git.\n5. Claim the space with `data.claim.url` (or publish while logged in). An unclaimed space may only call a short list of trusted APIs, so until it's claimed every unfurl comes back as a 403 from the target site.\n6. Prove it's really running server-side, and show me the output:\n   ```bash\n   curl -s \"<liveUrl>api/unfurl?url=https://github.com/vercel/next.js\" | head -c 600\n   curl -s \"<liveUrl>u?url=https://github.com/vercel/next.js\" | grep -o '<title>[^<]*</title>'\n   ```\n7. To ship an update later, run `sf publish --wait` again from the same directory. The CLI remembers the space.\n\n**Optional and reference only:** `sf publish --dry-run --json` prints the resolved plan as JSON if you want to inspect the detected framework and output directory. Docs: [Functions runtime](https://spacefast.com/docs/functions) · [Next.js on Spacefast](https://spacefast.com/docs/frameworks) · [agent setup](https://spacefast.com/setup) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/unfurl"},{"slug":"trailhead","publishSlug":"trailhead","title":"Hiking trail guide","name":"Trailhead — Next.js static export","vertical":"Developers & integrations","tech":"Next.js static export","summary":"A photo-led hiking guide built with the Next.js App Router, exported to flat HTML with `output: \"export\"` and served with accelerated images, redirects, and security headers.","order":220,"liveUrl":"https://trailhead.view.fast/","previewUrl":"https://trailhead.view.fast/","setupQuestions":["What should the guide be called, and what region or theme do the trails share?","Which trails should it cover (4-6), and do you have distances, elevation gain, and season notes, or should I research them?","What's the accent color, and should it feel like a national-park field guide, a modern outdoor brand, or an editorial magazine?","Which units — miles and feet, or kilometres and metres — and do any trails need a permit or booking note?"],"photoTerms":["sunrise over a mountain summit above a sea of cloud","red sandstone canyon with a river winding below","glaciated peak above an alpine larch basin","hikers with backpacks on a rocky mountain trail","turquoise glacier lake below a hanging glacier","colourful rhyolite mountains in the Icelandic highlands"],"prompt":"Build me a **hiking trail guide** as a **Next.js static export** — an index of trails plus a generated page for each one, big photography, and no server anywhere in the request path. `next build` writes flat HTML to `out/`, and Spacefast serves it.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What should the guide be called, and what do the trails have in common — a region, a season, a kind of walking?\n2. Which trails should it cover (4-6 is right)? If you have distances, elevation gain, and season notes, give them to me; otherwise research real trails and use their real numbers.\n3. What's the accent color (a hex like `#2f6b4f`), and should it feel like a national-park field guide, a modern outdoor brand, or an editorial magazine?\n4. Miles and feet, or kilometres and metres? And do any of these need a permit, a booking, or a shuttle I should call out?\n\n**Then build a complete, polished, responsive site with:**\n\n- A **trail index** at `/`: a full-bleed hero photo, a one-line promise, and a card grid — one card per trail with its photo, region, distance, elevation gain, typical season, and a difficulty badge. Sort so the easiest walk and the hardest objective are both easy to find.\n- A **page per trail** at `/trails/<slug>/`, generated with `generateStaticParams` from a single typed data file. Each page carries: a hero photo, an at-a-glance stat block (distance, elevation gain, time, high point, trailhead, season, difficulty), the route broken into named sections with what actually happens on each, a permits-and-access block, and an honest \"know before you go\" list — the parts that bite people, not marketing.\n- A short **\"how this is built\"** band explaining, in plain language, that the whole site is static HTML, images are transformed on the fly, and routing rules ship as files.\n- A **custom 404** that apologises briefly and links back to the index.\n- A footer crediting the photo source and the platform.\n\n**Design & content notes:**\n\n- Real trails, real numbers. Research them — distances, elevation gain, high points, permit systems, when the road or hut season opens. If a trail has a lottery or a shuttle or a river crossing, say so. Never \"lorem ipsum\", never invented statistics.\n- Field-guide feel: a serif display face for headings, a clean sans for body, generous whitespace, and one accent color used for badges, links, and rules. System font stacks are fine — don't pull in heavy web fonts for a static site.\n- Use real photos from Unsplash via **absolute** `https://images.unsplash.com/...` URLs, with `alt` text that describes what's actually in the frame.\n- Keep it accessible: semantic landmarks, a skip link, visible focus states, real heading order, contrast that passes, and no text baked into images.\n\n**Platform specifics — these are the point of the build:**\n\n1. **Static export.** In `next.config.ts` set `output: \"export\"` and `trailingSlash: true`. `next build` writes `out/` with a root `index.html` and a directory per route. No API routes, no middleware, no `getServerSideProps`, no ISR.\n2. **Accelerated images.** Install `@spacefast/image` and wire its Next loader so every remote photo is resized and re-encoded through the Site Accelerator instead of shipping a 4 MB original:\n\n   ```ts\n   // next.config.ts\n   import type { NextConfig } from \"next\";\n\n   const nextConfig: NextConfig = {\n     output: \"export\",\n     trailingSlash: true,\n     images: {\n       loader: \"custom\",\n       qualities: [50, 60, 75, 85, 100],\n       loaderFile: \"./lib/spacefast-image-loader.ts\",\n     },\n   };\n\n   export default nextConfig;\n   ```\n\n   ```ts\n   // lib/spacefast-image-loader.ts\n   export { default } from \"@spacefast/image/next-loader\";\n   ```\n\n   Keep the loader in that local file. Importing `@spacefast/image/next` from `next.config.ts` fails, because Next compiles the config to CommonJS.\n\n   Then use `next/image` normally with absolute URLs, `width`/`height`, `sizes`, and `priority` on the hero. Only absolute URLs get accelerated — files in `public/` pass through untouched. When the build finishes, grep the HTML: the `src` and `srcset` values should be `https://i0.wp.com/...?quality=…&w=…` URLs.\n3. **Routing rules as files.** Put `_redirects` and `_headers` in `public/` so they land at the root of `out/`. Give me at least one real 301 (an index path or a legacy URL shape that should not 404) and a sensible security-header block — `X-Content-Type-Options`, `Referrer-Policy`, `Permissions-Policy`, plus a long immutable `Cache-Control` on the hashed `/_next/static/*` assets.\n4. Optionally add a small `public/sf.jsonc` with the space `name` and `meta` (title, description, image) so link previews look right.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"trailhead\"></script>\n```\n\nPut it in the root layout so every generated page gets it, and confirm it's in the built HTML — not injected by a client-side script tag helper, which would leave it out of the export.\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Build first (`bun run build` / `npm run build`), then use `./out` as the publish folder. Confirm it has `index.html` at its root, plus `_redirects` and `_headers`, and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./out\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n5. Then check the live site: `curl -sI <liveUrl>/trails/` should show your 301, and the trail pages' image URLs should point at `i0.wp.com`.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./out --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [Next.js on Spacefast](https://spacefast.com/docs/frameworks) · [redirects](https://spacefast.com/docs/redirects) · [headers and settings](https://spacefast.com/docs/configuration) · [agent setup](https://spacefast.com/setup) · [claiming](https://spacefast.com/help/anonymous-publish)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/trailhead"},{"slug":"2048","publishSlug":"2048","title":"2048","name":"2048","vertical":"Tools, apps & games","tech":"Vanilla JS","summary":"The classic 2048 sliding-tile puzzle — arrow-key and swipe controls, smooth merge animations, score and persistent best score, and a win/lose overlay with restart and undo.","order":300,"liveUrl":"https://2048.view.fast/","previewUrl":"https://2048.view.fast/","setupQuestions":["What tile theme or color palette do you want?","Board size (default 4x4)?","What's the winning tile (default 2048)?"],"photoTerms":[],"prompt":"Build me a **fully playable 2048 sliding-tile puzzle game** as a vanilla-JS app\n(a single `index.html` plus a small CSS and JS file — no framework, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What tile theme or color palette do you want? (e.g. the classic warm beige/orange, a neon dark mode, pastels — or describe your own.)\n2. What board size should it be? (Default is 4×4; 5×5 plays slower and easier, 3×3 is frantic.)\n3. What's the winning tile? (Default is 2048 — you can chase 1024 for a quicker win or 4096 for a longer grind.)\n\n**Then build a complete, polished, responsive game with:**\n\n- A square **board with a grid of cells** (sized from my board-size answer) sitting on a rounded board frame.\n- **Arrow-key controls** (← ↑ → ↓) and **touch swipe** controls so it plays on phones too. Tiles slide as far as they can in the chosen direction.\n- **Merging:** when two tiles with the same number collide they combine into one tile of double the value — and a tile can only merge once per move (so `2 2 2` becomes `4 2`, never `8`).\n- A **score** that increases by the value of each merge, plus a **best score** that persists between visits via `localStorage`.\n- **Smooth animations:** tiles slide via CSS transforms, new tiles pop in, and merged tiles give a little scale-up bounce. A small floating \"+N\" appears over the score on each merge.\n- A **win overlay** when I reach the winning tile, with a \"Keep going\" option to chase a higher score, and a **game-over overlay** when no moves remain — both with a **restart** button.\n- A **New Game** button, a one-step **Undo**, and a live moves counter.\n- After every move, a new `2` (or occasionally a `4`) appears in a random empty cell.\n\n**Design & content notes:**\n\n- Default to the iconic 2048 look: a soft `#faf8ef` background, a `#bbada0` board, warm beige low tiles climbing through orange to a glowing gold `2048` tile — but honor my palette answer if I gave one. Use a clean sans like Inter, big bold tabular numerals, and a tasteful glow on the high-value tiles.\n- This is a game, so there's no copy to write and **no images needed** — keep it clean, tactile, and fast.\n- No build step — a single `index.html` with a linked CSS and JS file that opens straight in a browser. Make the game **actually work**: real keyboard and swipe input, correct merge rules, a real win/lose/restart loop, and best-score saved in `localStorage`.\n- Make the board size, winning tile, and tile palette easy to change from a few constants/CSS variables at the top, so my answers map to real config.\n- Keep it accessible (semantic HTML, a focusable board, visible focus ring, keyboard play, `prefers-reduced-motion` support, and good contrast).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"2048\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/2048"},{"slug":"app","publishSlug":"app","title":"App prototype","name":"Tasklane","vertical":"Tools, apps & games","tech":"Vite + React","summary":"A multi-view task app prototype — a draggable kanban board, a sortable list view, and a task detail drawer with subtasks, comments, filters, and search, all saved on your device.","order":300,"liveUrl":"https://app.view.fast/","previewUrl":"https://app.view.fast/","setupQuestions":["What does the app track and who's it for (a product sprint, freelance client work, a content calendar)?","What are the workflow lanes/columns (e.g. Backlog → To Do → In Progress → In Review → Done)?","Who's on the team — 3–5 names with a role each — and what labels do you use (Design, Frontend, Bug, Growth)?","Seed it with a believable starter set of ~12 tasks across the lanes, or name a project and we'll invent realistic ones."],"photoTerms":["kanban board sticky notes overhead","team product planning workspace whiteboard","software team standup laptops desk","portrait headshot friendly colleague"],"prompt":"Build me a **multi-view task-tracking app — a kanban board, a list view, and a\ntask detail drawer** as a **Vite + React app** that saves everything in the\nbrowser (no backend, no accounts, all state in `localStorage`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What does the app track and who's it for (e.g. \"a product sprint for a small\n   mobile-app team\", \"my freelance client work\", \"a content calendar\")?\n2. What are the workflow lanes/columns (e.g. Backlog → To Do → In Progress →\n   In Review → Done)?\n3. Who's on the team — 3–5 names with a role each — and what labels do you use\n   (e.g. Design, Frontend, Backend, Bug, Growth)?\n4. Seed it with a believable starter set of ~12 tasks across the lanes, or tell\n   me a project and I'll invent realistic ones.\n\n**Then build a complete, polished, responsive app with:**\n\n- A **kanban board**: one column per lane, each with a colored status dot, a live\n  task count, and a quick \"add task\" button. Cards are **draggable between\n  columns** (HTML5 drag-and-drop) and the target column highlights as you hover.\n- **Cards** that show the title, label chips, a priority dot, an assignee avatar,\n  a relative due-date pill (with \"soon\" and \"overdue\" states), a subtask\n  progress bar, and a comment count — plus an optional cover image.\n- A **List view** toggle: the same tasks as a sortable table grouped by status,\n  sortable by status / priority / due date, collapsing to a clean stacked layout\n  on mobile.\n- A **task detail drawer** that slides in from the right: edit the title inline,\n  change status / assignee / priority / due date / labels, edit the description,\n  add and check off **subtasks** (with a live progress bar), and post **comments**\n  to an activity thread. Includes a delete action. Closes on Esc or backdrop click.\n- A **toolbar** with full-text **search** (matches title, description, and\n  subtasks) and **filters** by person, priority, and label, with a one-click\n  \"clear filters\" that shows how many tasks are visible.\n- A **header** with at-a-glance stats: in-flight, shipped, overdue, and a\n  conic-gradient ring for \"cycle done\" percent.\n- **Seeded sample data** on first load and a **reset** button to restore it.\n- A **light/dark theme** toggle.\n\n**Design & content notes:**\n\n- Modern productivity-tool aesthetic — think Linear / Trello / Height: a deep,\n  slightly blue-tinted dark default with a soft radial glow, a violet accent\n  (`#6d5efc`), crisp cards with subtle lift on hover, and rounded corners. Use\n  **Sora** for headings and **Inter** for body. Ship a clean white light theme too.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent\n  believable task titles, owners, priorities, and short comment threads if I\n  leave gaps.\n- Use real images for the team avatars and the occasional card cover. Pull free\n  photos that fit, e.g. seeded `https://picsum.photos/seed/team-avatar-1/96/96`\n  (vary the seed) or Unsplash photos matching `kanban board sticky notes` /\n  `team product planning workspace`, and add descriptive `alt` text.\n- Persist all state (tasks, theme, current view) in `localStorage` so edits\n  survive a refresh; reseed on reset.\n- Keep it accessible: semantic HTML, labelled controls, keyboard support\n  (Enter/Space to open a card, Esc to close the drawer, focus-visible rings),\n  and good contrast in both themes. Mobile-first — the board stacks to a single\n  column and the drawer goes full-width on small screens.\n- Vite + React with `base: \"./\"` so it works from any subpath, and a\n  `public/_redirects` file containing `/*  /index.html  200`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"app\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/app"},{"slug":"blog","publishSlug":"blog","title":"Blog","name":"Margins","vertical":"Personal & creative","tech":"Astro","summary":"A writing and dev blog — a tagged post index, reading-first article pages with code highlighting, per-tag archives, an about page, light/dark themes, and an RSS feed, all static Astro.","order":300,"liveUrl":"https://blog.view.fast/","previewUrl":"https://blog.view.fast/","setupQuestions":["What's the blog name, its subject, and the voice you want readers to hear (e.g. practical field notes, reported essays, or personal commentary)?","Give me 3 sample post titles or themes you'd like to start with.","Is this a code-heavy dev blog, a collection of essays, or a mix of both?","What's the author name, one-line bio, and where can people follow you (GitHub, Mastodon, email)?"],"photoTerms":["writing desk coffee laptop","minimal reading typography"],"prompt":"Build me a **writing / dev blog** as an **Astro site** — a real, minimal Astro\nproject with Markdown content collections, syntax-highlighted code, and an RSS\nfeed (run `bun install && bun run build` at the end and confirm `dist/` exists).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the blog name, its subject, and the voice you want readers to hear\n   (e.g. practical field notes, reported essays, or personal commentary)?\n2. Give me 3 sample post titles or themes you'd like to start with.\n3. Is this a code-heavy dev blog, a collection of essays, or a mix of both?\n4. What's the author name, one-line bio, and where can people follow you (GitHub,\n   Mastodon, email)?\n\n**Then build a complete, polished, responsive site with:**\n\n- A **post index** on the homepage: a short personal intro, a row of clickable\n  tag chips, and a clean reverse-chronological list of posts (date, title,\n  one-line description, tags, reading time).\n- **Article pages** with reading-first typography — a centered ~65-character\n  measure, a serif body face, a clear title/dek/byline, and previous/next post\n  links at the bottom.\n- **Code highlighting** on every fenced code block (use Astro's built-in Shiki),\n  plus nicely styled inline code, blockquotes, and lists.\n- **Tag pages**: an \"all tags\" index with post counts, and a page per tag listing\n  its posts.\n- An **About page** with the author photo, bio, what the blog is about, and links\n  to follow.\n- An **RSS feed** at `/rss.xml` generated from the posts, linked from the\n  document `<head>` so feed readers auto-discover it.\n- Write **5–6 real posts** based on my topic — actual paragraphs and real code\n  samples, never \"lorem ipsum\". Mix essays and code-heavy pieces per my answer.\n\n**Design & content notes:**\n\n- Minimal reading-typography mood: a warm paper light theme and a calm \"ink\"\n  dark theme with a header toggle (remember the choice in `localStorage` and set\n  it before first paint to avoid a flash). One restrained accent color. A serif\n  for headings and article body (e.g. Newsreader), a clean sans for UI (e.g.\n  Inter), and a monospace for code (e.g. JetBrains Mono).\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent\n  believable post bodies, dates, and a bio if I leave gaps.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/blog-1/1200/800` (vary the seed), and add\n  descriptive `alt` text.\n- Use **Astro content collections**: a `posts` collection of Markdown files with\n  a typed frontmatter schema (title, description, pubDate, tags, draft), and\n  `getCollection` to build the index, article, tag, and RSS routes. Keep it\n  static — nothing should run at request time beyond `astro build`.\n- Keep it accessible (semantic HTML, a skip link, labelled controls, keyboard\n  support, good contrast in both themes).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"blog\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/blog"},{"slug":"deck","publishSlug":"deck","title":"Pitch deck","name":"Northwind Seed Deck","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A presentable, browser-native reveal.js pitch deck with keyboard nav, speaker notes, PDF export, and bespoke data slides — TAM/SAM/SOM rings, an MRR chart, and use-of-funds bars.","order":300,"liveUrl":"https://deck.view.fast/","previewUrl":"https://deck.view.fast/","setupQuestions":["What's the company and one-line pitch?","What are the 6-8 slide topics? (default Title, Problem, Solution, Market, Traction, The Ask)","What's the ask / closing slide content? (round size, use of funds, milestones, team)","Any brand colors, a logo, or photos I should use? (optional — pick a tasteful default if you skip this)"],"photoTerms":["startup pitch meeting","modern boardroom presentation","investor presentation laptop slides","team strategy whiteboard office"],"prompt":"Build me a **presentable investor pitch deck that runs in the browser** as a\nvanilla-JS app — a single `index.html` plus a small CSS and JS file, with\n[reveal.js](https://revealjs.com) loaded from a CDN (no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the company and one-line pitch?\n2. What are the 6–8 slide topics? (default: Title, Problem, Solution, Market, Traction, The Ask)\n3. What's the ask / closing slide content? (round size, use of funds, milestones, team)\n4. Any brand colors, a logo, or photos I should use? (optional — pick a tasteful default if I skip this)\n\n**Then build a complete, polished, responsive deck with:**\n\n- A **title slide**: logo mark, company name, the one-line pitch, and a \"Seed round · 2026 · Confidential\" meta row over a subtle, darkened background photo.\n- A **Problem** slide: a sharp headline, a one-line setup, three stat cards with big numbers, and a real customer quote.\n- A **Solution** slide with three pillars (Build / Govern / Trust), plus a nested vertical \"how it works\" slide showing a short config snippet and a left-to-right flow diagram (use reveal.js vertical slides — press ↓).\n- A **Market** slide with a TAM / SAM / SOM concentric-ring diagram, a labeled legend, and a bottom-up sizing line.\n- A **Traction** slide: four KPI tiles (ARR, growth, retention, churn), a CSS bar chart of monthly recurring revenue, and a row of customer logo chips.\n- A **The Ask** slide: round size in the headline, a use-of-funds bar breakdown, a checklist of milestones to the next round, and a one-line team bio.\n- A **closing** slide: logo, a warm closing line, and contact details.\n- **Speaker notes** on every slide (reveal.js `<aside class=\"notes\">`), opened with the `S` key in a second presenter window with a timer.\n- Working **keyboard navigation** (← → to move, ↓ ↑ within a slide group, `F` fullscreen, `O` overview), a `?` **help overlay** listing the shortcuts, and **PDF export** (press `E` to switch into reveal.js print-pdf mode, then Save as PDF).\n\n**Design & content notes:**\n\n- A confident, modern boardroom palette: a deep ink background (`#0A0E17`), an indigo→teal accent gradient (`#7C9BFF → #4FD8C4`), Space Grotesk for headings and Inter for body. Generous whitespace, rounded cards, no clip-art.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable, internally-consistent numbers (ARR, growth %, retention, market size) if I leave gaps, and label any estimates as estimates.\n- Use real images. Pull a free photo that fits the title background, e.g.\n  `https://picsum.photos/seed/northwind-board/1920/1080`, darken it behind the text, and add an empty `alt` (it's decorative).\n- Load reveal.js, its notes plugin, and its highlight plugin from a CDN (e.g. jsDelivr). reveal.js v5 handles PDF pagination itself when the URL carries `?print-pdf` — no extra print stylesheet needed.\n- Keep it accessible (semantic landmarks, real heading levels, `aria-label` on the chart, good contrast, full keyboard support) and responsive — single-column stacking on phones.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"deck\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/deck"},{"slug":"docs","publishSlug":"docs","title":"Docs site","name":"Ledger — Docs","vertical":"Developers & integrations","tech":"Astro","summary":"A multi-page documentation site for an open-source library — grouped sidebar nav, getting-started and guides, an API reference, build-time syntax-highlighted code, a working ⌘K search, and a version dropdown.","order":300,"liveUrl":"https://docs.view.fast/","previewUrl":"https://docs.view.fast/","setupQuestions":["What's the library/product and a one-line description of what it does?","What are the top 4–5 doc sections (e.g. Getting started, Guides, API reference, Changelog)?","Give me one real code example to feature on the landing page.","(Optional) What's the brand accent color, and the GitHub / npm links?"],"photoTerms":["abstract code editor screen dark theme","developer desk laptop terminal","typescript source code on monitor","software documentation reference page"],"prompt":"Build me a **multi-page documentation site for an open-source software library**\n(Starlight-style) as an **Astro site** (static output, no SSR, no backend).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the library/product and a one-line description of what it does?\n2. What are the top 4–5 doc sections (e.g. Getting started, Guides, API reference, Changelog)?\n3. Give me one real code example to feature on the landing page.\n4. (Optional) What's the brand accent color, and the GitHub / npm links?\n\n**Then build a complete, polished, responsive docs site with:**\n\n- A **landing page** with a hero (name, tagline, install command with copy button),\n  a feature grid, a couple of \"quick look\" code panels, headline stats, and\n  \"next steps\" cards that link into the docs.\n- A persistent **docs shell**: a left **sidebar** with grouped navigation\n  (Introduction / Guides / Reference), the article in the middle, and an\n  **\"On this page\"** table of contents on the right that highlights the section\n  you're reading (scroll-spy).\n- A **Getting started** page: install, create a store, first reactive query, and a\n  framework binding — each step with a real, syntax-highlighted code block.\n- Two or three **guide** pages (e.g. reactive queries, persistence, schema\n  migrations) with prose, tables, callouts (tip / note / warning), and code.\n- An **API reference** page with function signatures, options tables, and\n  copy-paste examples, with anchor links per method.\n- A **Changelog** page with versioned release notes.\n- **Syntax-highlighted code blocks** (build-time highlighting) with a filename bar,\n  a language label, and a working **Copy** button.\n- A **version dropdown** in the header that switches the displayed version and shows\n  a \"you're viewing older docs\" banner for non-latest versions.\n- A **search** modal (open with the button or ⌘K / `/`) that filters a static index\n  of pages by title and keywords, with full arrow-key + Enter keyboard navigation.\n- Prev / next pagination at the foot of each doc page, a footer, and a mobile\n  drawer for the sidebar.\n\n**Design & content notes:**\n\n- Clean, modern, **dark documentation** aesthetic: a near-black base, an\n  emerald→sky gradient brand accent, a geometric display face (e.g. Space Grotesk)\n  for headings, Inter for body, and a monospace (e.g. JetBrains Mono) for code.\n  Generous reading measure, calm spacing, crisp borders.\n- Write **realistic technical content** for the library based on my answers — real\n  API names, believable code, real release notes. Never \"lorem ipsum\"; invent\n  plausible details if I leave gaps.\n- Use real images where they help (e.g. a code-editor screenshot on the landing\n  hero). Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/docs-1/1200/800` (vary the seed), and add descriptive `alt` text.\n- Use **Astro**: a layout per page type (`Base` + `Docs`), small components for the\n  nav, sidebar, search, TOC, and a `CodeBlock` wrapper around Astro's built-in\n  `<Code>` component so highlighting happens at build time. Keep all nav and the\n  search index in one `src/data/site.ts` file. Static output — `astro build` only.\n- Keep it accessible: semantic landmarks, a skip link, labelled controls,\n  `aria-current` on the active nav link, full keyboard support in the search modal\n  and version menu, visible focus rings, and good contrast.\n\n**Add this exact line right before `</body>` so the site carries its badge** (put it\nin the shared root layout so every page includes it):\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"docs\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/docs"},{"slug":"fundraiser","publishSlug":"fundraiser","title":"Fundraiser","name":"Help Fund the Maple Street Mural","vertical":"Personal & creative","tech":"Vanilla JS","summary":"A one-page community-fundraiser site with an animated goal thermometer, a working donate button and modal, and a live donor wall that grows as people give.","order":300,"liveUrl":"https://fundraiser.view.fast/","previewUrl":"https://fundraiser.view.fast/","setupQuestions":["What's the cause and who does it help? (Name, one-line summary, and a few sentences of story.)","What's the goal amount and how much is raised so far — and when does the campaign end?","What payment link should the \"Donate\" button use (Stripe / PayPal / GoFundMe)? Leave it as a demo if you don't have one yet.","List a handful of real donors (name + amount, optional note) to seed the donor wall, plus a 4–6 line budget breakdown."],"photoTerms":["community mural painting on a neighborhood brick wall","volunteers working together on a neighborhood project","children painting at an outdoor art workshop","neighbors gathered together at a community center"],"prompt":"Build me a **one-page fundraising campaign site for a local cause** as a vanilla-JS app\n(a single `index.html` plus a small CSS and JS file — no framework, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the cause and who does it help? (Give me a name, a one-line summary, and a few sentences of story.)\n2. What's the goal amount and how much is raised so far — and when does the campaign end?\n3. What payment link should the \"Donate\" button use (Stripe / PayPal / GoFundMe / etc.)? If you don't have one yet, leave it as a demo button.\n4. List a handful of real donors (name + amount, optional short note) to seed the donor wall, and a 4–6 line budget breakdown of where the money goes.\n\n**Then build a complete, polished, responsive site with:**\n\n- A **hero** with a striking community photo, the cause name, a short emotional lede, and the live fundraising widget pinned right there.\n- An **animated progress bar** that fills from 0% to the current total on load, with the dollars raised, the goal, the percentage, the donor count, and the days left — all computed, not hard-coded into the markup.\n- A **cause story** section in a warm, human voice, a pull-quote from an organizer, a \"where the money goes\" budget panel, and a small photo gallery.\n- A **\"ways to give\"** row of suggested amounts (each one opens the donate form pre-filled).\n- A **donate button + modal**: choose a preset or custom amount, enter a name and optional note, optionally give anonymously, then submit. On submit it validates, shows a thank-you state, bumps the running total and progress bar, and drops the new donor onto the wall instantly. Persist donations in `localStorage` so they survive a refresh.\n- A **donor wall**: a grid of donor cards (colored initials avatar, name, note, amount), seeded with the real donors and growing as people give.\n- A **share** section: a \"copy link\" button that actually copies and confirms, plus pre-filled X / Facebook / email share links.\n- A footer with the org name, a contact email, and the nonprofit fine print.\n\n**Design & content notes:**\n\n- Warm, hand-made, community-grant mood: a cream paper base, a confident coral primary, a deep teal, and a harvest-gold accent. A characterful serif (e.g. Fraunces) for headings, a clean sans (e.g. Inter) for body. Soft rounded cards, a slightly tilted hero photo, gentle motion.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable donor names, notes, and budget lines if I leave gaps.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/community-mural-1/1200/800` (vary the seed) or Pexels, and add\n  descriptive `alt` text. Good search terms: community mural painting, volunteers neighborhood project.\n- No build step — a single `index.html` with a linked CSS and JS file that opens straight in a browser. Make the progress bar and donor math real: derive everything from a small config object (goal, base raised, end date, seed donors) so the numbers stay honest. This is a demo, so no real payment is processed — wire the button to my payment link or leave a clearly-labeled demo state.\n- Keep it accessible (semantic HTML, labelled form fields, an `aria` live region on the donor wall, keyboard support, Escape closes the modal, and good contrast). Respect `prefers-reduced-motion`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"fundraiser\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/fundraiser"},{"slug":"memorial","publishSlug":"memorial","title":"Memorial","name":"Remembering Eleanor","vertical":"Personal & creative","tech":"Plain HTML & CSS","summary":"A quiet, dignified tribute page — a framed portrait with dates and epitaph, a life story and timeline, a black-and-white photo gallery with a lightbox, service details, and a working memory wall that saves visitors' messages.","order":300,"liveUrl":"https://memorial.view.fast/","previewUrl":"https://memorial.view.fast/","setupQuestions":["Whose memorial is this — their full name, the years (born–passed), and a short epitaph or line they lived by?","Share a short life story and 5–6 photos or moments worth featuring.","What service or celebration details should I include — date, time, place, reception, live stream, and any donation request in lieu of flowers?","Should visitors be able to leave memories, and if so should entries stay on this device, be sent somewhere for review, or link to an existing guestbook?"],"photoTerms":["soft floral arrangement","candle warm memorial light"],"prompt":"Build me a **quiet, dignified memorial tribute page for someone I've lost** as a\nplain HTML & CSS site (a single `index.html`, no framework and no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. Whose memorial is this — their full name, the years (born–passed), and a short epitaph or line they lived by?\n2. Share a short life story (a paragraph or two is plenty) and 5–6 photos or moments worth featuring.\n3. What service or celebration details should I include — date, time, place, reception, live stream, and any donation request in lieu of flowers?\n4. Should visitors be able to leave memories, and if so should entries stay on\n   this device, be sent somewhere for review, or link to an existing guestbook?\n\n**Then build a complete, polished, responsive site with:**\n\n- A serene **hero**: a framed portrait, their name, the years, and the epitaph centered beneath a thin gold rule.\n- A **life story** section: flowing prose with a drop cap and one pull-quote, followed by a simple vertical timeline of life milestones.\n- A **photo gallery**: a responsive grid of photographs that open in a click-to-enlarge lightbox with captions, keyboard navigation (arrow keys, Escape), and previous/next buttons.\n- A **service & celebration** block: cards for the memorial service, the reception, and a live-stream note (date, time, address, and a \"directions\" link each), plus an \"in lieu of flowers\" donation card.\n- A **memory wall**: a few heartfelt seeded memories, and a form (name + message) that validates, shows a gentle thank-you confirmation, and saves new memories so they appear on the wall and persist on return via `localStorage`.\n- A soft footer with the name, the years, and a single candle motif.\n\n**Design & content notes:**\n\n- Tone is everything: warm and calm, never clinical. Use an ivory/cream base, soft sage green and a muted gold accent, and deep warm-charcoal text. Pair an elegant serif display face (e.g. Cormorant Garamond) for headings with a readable serif (e.g. EB Garamond) for body text.\n- Render the portrait and gallery photographs in soft black-and-white so any source images feel like timeless family archives.\n- Use realistic content based on my answers — never \"lorem ipsum\". Write the life story, timeline, and seeded memories in a tender, human voice; invent believable details only to fill small gaps.\n- Use real images. Pull free photos that fit, e.g. from picsum (`https://picsum.photos/seed/memorial-1/1200/800?grayscale`, varying the seed) or Unsplash (`soft floral arrangement`, `candle warm memorial light`), and add descriptive `alt` text.\n- No build step — a single `index.html` with embedded CSS and a small script. Make the lightbox and the memory-wall form genuinely work; persist memories in `localStorage`.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, focus management in the lightbox, good contrast) and respect `prefers-reduced-motion`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"memorial\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/memorial"},{"slug":"notes","publishSlug":"notes","title":"Digital garden","name":"Glasshouse","vertical":"Personal & creative","tech":"Astro","summary":"A warm, greenhouse-themed digital garden built with Astro — Markdown notes that link with [[wiki links]], an automatic backlinks panel, a build-time link graph, instant search, and planted/growing/evergreen growth tags.","order":300,"liveUrl":"https://notes.view.fast/","previewUrl":"https://notes.view.fast/","setupQuestions":["What's the topic area of the notes?","Give me 4–5 starter note titles and, for each, which of the others it should link to.","Should the garden be fully public, or shared privately behind a password?","What should the garden be called, and who's tending it?"],"photoTerms":["plants greenhouse light","notebook mind map sketches"],"prompt":"Build me a **digital garden — a small website of interlinked notes that grows over\ntime, with wiki-style links, automatic backlinks, a link graph, search, and\n\"planted / growing / evergreen\" growth tags** as an **Astro site** (real project,\ncontent collections, `astro build` to static HTML — no server, no database).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the topic area of the notes? (e.g. note-taking & memory, a course you're\n   taking, your field of work, a hobby — anything you want to think out loud about.)\n2. Give me 4–5 starter note titles and, for each, which of the others it should\n   link to. (Don't overthink it — I'll wire the `[[links]]` for you.)\n3. Should the garden be fully public, or shared privately behind a password?\n4. What should the garden be called, and who's tending it? (A name and an author.)\n\n**Then build a complete, polished, responsive site with:**\n\n- **Interlinked notes** — each note is a Markdown file with a title, a growth\n  status, a planted date, a last-tended date, and a short summary. Inside the body,\n  references to other notes use `[[Wiki Link]]` syntax (with optional\n  `[[Real Title|alias text]]`), rewritten into real internal links at build time.\n- **A backlinks panel** on every note — a \"Linked from\" section listing every other\n  note that points at this one, computed automatically by walking all notes (not\n  hand-maintained). Show a \"Links out\" panel too.\n- **An index + link graph** on the home page — a force-directed map of all notes and\n  the links between them, laid out at build time and rendered as static SVG, with\n  hover/tap highlighting of a note's neighbourhood. Plus a full text index grouped\n  by growth status.\n- **Search** — an instant client-side search box that matches note titles,\n  summaries, and body text and shows a ranked dropdown. Support `/` to focus it and\n  `Esc` to dismiss.\n- **Status tags** — every note wears one of 🌱 _planted_ / 🌿 _growing_ / 🌲\n  _evergreen_, colour-coded everywhere it appears, with a legend explaining what\n  each stage means.\n\n**Design & content notes:**\n\n- A warm, \"greenhouse\" mood: a cream paper background, a deep forest-green ink, and\n  three living accent colours for the statuses (amber for planted, green for\n  growing, pine-teal for evergreen). A friendly serif (e.g. Fraunces) for display\n  type, a clean sans (e.g. Inter) for reading. Calm, bookish, a little botanical.\n- Write **real, thoughtful notes** based on my topic and titles — a few honest\n  paragraphs each, with the `[[links]]` woven naturally into the prose. Never\n  \"lorem ipsum\". If I leave gaps, invent believable, on-topic notes.\n- Use real images. Pull a free greenhouse/light photo for the hero, e.g.\n  `https://picsum.photos/seed/greenhouse-1/1600/900` or\n  Pexels, with descriptive `alt` text. (Notes themselves stay text-first.)\n- Use **Astro content collections** for the notes, a small remark plugin to turn\n  `[[wiki links]]` into real links at build time, and a build-time pass to compute\n  backlinks and the graph layout. Everything renders to static HTML — no runtime\n  server.\n- Keep it accessible (semantic HTML, labelled search field, keyboard support, good\n  contrast, and the graph readable as an SVG with an `aria-label`).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"notes\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/notes"},{"slug":"party","publishSlug":"party","title":"Party invite","name":"Mia's 30th","vertical":"Personal & creative","tech":"Astro","summary":"A themed birthday-party invite with a live countdown, an embedded map and directions, a dress-code callout, and a validating RSVP form with guest count, a conditional +1, dietary needs, and a \"can't make it\" path.","order":300,"liveUrl":"https://party.view.fast/","previewUrl":"https://party.view.fast/","setupQuestions":["What's the occasion, who's hosting, and what mood should the invitation set?","What's the date, time, venue, full address, and weather backup plan?","What should guests know about dress, food, gifts, parking, or accessibility?","Where should RSVPs go, and which guest details do you need to collect?"],"photoTerms":["festive party balloons confetti","rooftop celebration string lights"],"prompt":"Build me a **themed party invite — a one-page site with the occasion, the details,\na map, and a real RSVP form** as an **Astro site** (a small static project, no SSR,\njust `astro build` to a `dist/` folder).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the occasion, who's hosting, and what mood should the invitation set\n   (playful, black-tie, backyard cookout, or something else)?\n2. What's the date, time, venue, full address, and weather backup plan?\n3. What should guests know about dress, food, gifts, parking, or accessibility?\n4. Where should RSVPs go, and which details should the form collect (guest count,\n   +1 name, dietary needs, song request, or a note when someone can't attend)?\n\n**Then build a complete, polished, responsive site with:**\n\n- A full-screen **hero**: the guest of honor's name big, the occasion, date/time and venue, a live **countdown** ticking down to the party, and a gentle confetti animation.\n- A **details** section: the dress code shown front and centre, plus a tidy card grid for the practical stuff (food, drinks, gifts, weather plan) and a short personal note from the host.\n- A **run-of-show timeline**: what happens when — doors, toast, dinner, cake, dancing, last song.\n- A **map + directions** block: an embedded Google Map of the venue, an \"open in Maps\" button, and written directions (transit, parking/rideshare, how to find the door).\n- A working **RSVP form** with: name + email (validated), an accept/decline choice, and — when accepting — guest count, a +1 name field that appears only when bringing someone, a dietary preference, and a song request. When declining, show a **\"can't make it\" path** with a box to leave the host a birthday note. On submit, show a friendly, personalized confirmation and remember the reply on return via `localStorage`.\n\n**Design & content notes:**\n\n- Festive late-night mood: a midnight-plum night sky, warm string-light glow, a neon magenta primary with a party-gold accent and a touch of electric cyan. A rounded display face (e.g. Unbounded) for headings and a clean sans (e.g. Plus Jakarta Sans) for body.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent a believable schedule, dress-code note, and directions if I leave gaps.\n- Use real images. Pull free photos that fit, e.g. `https://picsum.photos/seed/party-rooftop/1800/1200` (vary the seed) or Unsplash photos of festive party balloons, confetti, and a rooftop celebration with string lights, and add descriptive `alt` text.\n- Keep all the content in one `src/data/party.ts` file so changing a single detail updates the whole page. Make the countdown and the RSVP form genuinely work; respect `prefers-reduced-motion` for the confetti.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, visible focus rings, and good contrast on the dark background).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"party\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/party"},{"slug":"proposal","publishSlug":"proposal","title":"Sales proposal","name":"Proposal for Acme Co.","vertical":"Data, internal & startup","tech":"Astro","summary":"A personalized \"prepared for Acme Co.\" sales proposal — scope, a gated timeline, three selectable pricing tiers, and a working accept/sign CTA that recomputes the agreement and remembers the acceptance.","order":300,"liveUrl":"https://proposal.view.fast/","previewUrl":"https://proposal.view.fast/","setupQuestions":["What's your service and the client name?","What are the pricing tiers/options, with prices, and which one is recommended?","What are the scope bullets and the timeline (phases and rough weeks)?","Who's it from and what are the dates (studio name, contact, proposal date, valid-until date)?"],"photoTerms":["business handshake meeting","clean office desk contract"],"prompt":"Build me a **personalized, one-page sales proposal site** — a \"prepared for {client}\"\npage with scope, timeline, pricing tiers, and a working accept/sign button — as an\n**Astro site** (a real, minimal Astro project I can build with `bun run build`).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your service and the client name? (e.g. \"a brand & website refresh, for Acme Co.\")\n2. What are the pricing tiers/options, with prices? (give me 2–3, and which one is recommended)\n3. What are the scope bullets and the timeline (phases and rough weeks)?\n4. Who's it from and what are the dates? (your studio name, the contact you're sending to, proposal date, and a \"valid until\" date)\n\n**Then build a complete, polished, responsive site with:**\n\n- A **cover** that reads \"Prepared for {client}\", with the project title, who it's\n  prepared by and for, the date and proposal number, and three headline outcome\n  stat cards.\n- A short **intro letter** in the studio's voice, signed by a named person.\n- A **scope of work** section: a grid of workstream cards, each with a one-line\n  summary and a checklist of concrete, fixed-scope deliverables.\n- A **timeline**: a vertical, gated timeline of phases — each with a week range, a\n  short blurb, and the milestone that ends the phase.\n- **Pricing tiers**: 2–3 selectable cards with price, cadence, feature checklist,\n  and a \"Recommended\" badge on the middle one. Clicking a tier selects it and\n  updates the accept form below.\n- An **accept & sign** section: an agreement summary that reflects the selected\n  tier (tier name, total, and a 40% deposit line that recomputes), and a sign form\n  with full name, work email, a typed e-signature that must match the name, and an\n  \"I agree to the terms\" checkbox. On submit it validates, shows a success state\n  (\"Thank you, {first name} — accepted!\") with a signed receipt and reference\n  number, and persists the acceptance in `localStorage` so it survives a refresh.\n- A short **FAQ** and a **footer** with studio contact details.\n\n**Design & content notes:**\n\n- Premium, paper-light \"studio proposal\" mood: a warm off-white page, deep navy\n  ink, and one confident amber accent. A characterful serif display face (e.g.\n  **Fraunces**) for headings, a clean sans (**Inter**) for body, and a mono\n  (**IBM Plex Mono**) for every figure and reference number.\n- A dark navy cover and a dark navy accept/sign section bookend the light reading\n  sections, with a subtle reading-progress bar at the top.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent\n  believable scope bullets, milestones, and terms if I leave gaps.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/proposal-1/1200/800` (vary the seed) or Pexels,\n  and add descriptive `alt` text. Use a calm, professional handshake/office photo\n  behind the cover, dimmed for contrast.\n- Keep all the content in a single `src/data/proposal.ts` so swapping clients,\n  scope, and pricing is a one-file edit; the markup reads from it.\n- It's a real Astro project: `bun install && bun run build` must produce a `dist/`.\n  Keep it fully static — no SSR, no adapters. The only client-side JS is a small\n  inline script for tier selection and the accept/sign interaction.\n- Mark the page `noindex` (a proposal isn't for search engines), and pair it with\n  Spacefast's space password so only your client can open it.\n- Keep it accessible (semantic HTML, labelled form fields, keyboard support, good\n  contrast, and `prefers-reduced-motion` respected).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"proposal\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./dist` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./dist\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./dist --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/proposal"},{"slug":"qr","publishSlug":"qr","title":"QR landing","name":"Tap-through","vertical":"Data, internal & startup","tech":"Plain HTML & CSS","summary":"A mobile-first landing a printed QR code points to — a brand header, one featured product with a tap-to-copy promo code, a single primary call-to-action, secondary links, and a QR code the page renders itself.","order":300,"liveUrl":"https://qr.view.fast/","previewUrl":"https://qr.view.fast/","setupQuestions":["What does the QR live on (packaging, poster, table tent, sticker) and what's the \"scan to…\" framing it should open with?","What's the single action you most want the visitor to take (reorder, book, claim a discount, follow, sign up)?","What's the brand name, the one product or promo to feature (with a price or offer), and the accent color?","Optional - give 3 to 5 secondary links (menu, brew guide, story, hours, Instagram) plus your address and contact."],"photoTerms":["product packaging close up","restaurant table tent qr","small batch coffee roaster bag copper label","phone scanning qr code on a cafe table"],"prompt":"Build me a **mobile-first post-scan landing page that a printed QR code points\nto** — the screen someone sees right after they scan the code on my packaging,\nposter, or table tent — as a **plain HTML & CSS** site with a little vanilla\nJavaScript (a single `index.html` plus a CSS and JS file, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What does the QR live on — packaging, a poster, a table tent, a sticker, a\n   business card? And what's the one line of \"scan to…\" framing it should open with?\n2. What's the single action you most want the visitor to take (reorder, book a\n   table, claim a discount, follow, sign up, leave a review)?\n3. What's the brand name, what's the one product or promo to feature (with a price\n   or offer), and what accent color should we use?\n4. (Optional) Give me 3–5 secondary links to list underneath (menu, brew guide,\n   our story, hours/location, Instagram), plus your address and contact.\n\n**Then build a complete, polished, responsive site with:**\n\n- A **brand header** — a small logo mark, the brand name, and a one-line locator\n  (city / tagline). It can stay pinned at the top.\n- A **\"you scanned this\" intro** — the \"scan to…\" framing, a confident headline,\n  and one short sentence that connects the physical thing they're holding to this\n  page.\n- **One product / promo card** — a real photo, the product name, price, tasting\n  notes / key details as little chips, a short believable blurb, and a freshness\n  or trust line. Include a **promo code** with a tap-to-copy button that confirms\n  when copied.\n- A **single primary call-to-action** — one big, unmistakable button for the action\n  from question 2, with a short line of fine print (what the code does, shipping,\n  etc.).\n- A **secondary links list** — tappable rows with an icon, a title, and a one-line\n  description, each a big touch target with a chevron.\n- A **self-rendered QR code** — the page draws its _own_ QR code (pointing at its\n  own live URL) so anyone can re-share it, plus a \"Copy link\" button. Generate it\n  client-side; don't paste in a static image.\n- A small **footer** with address, hours, contact, and fine print.\n\n**Design & content notes:**\n\n- Mobile-first: design for a phone held one-handed. Everything lives in a single\n  centered column (~460px); on desktop it floats as a phone-shaped card. Tap targets\n  at least ~48px tall.\n- Warm, premium, retail feel: a cream/paper base, deep espresso text, and the brand\n  accent color used sparingly for the primary button, the promo, and link icons. A\n  characterful serif (e.g. Fraunces) for the brand name and headlines, a clean sans\n  (e.g. Inter) for everything else.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  product details, addresses, and hours if I leave gaps.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/product-qr-1/1200/800` (vary the seed) or Pexels,\n  and add descriptive `alt` text. Add an `onerror` fallback to\n  `https://picsum.photos/seed/<something>/900/900` so an image never breaks.\n- No build step — a single `index.html` with a linked CSS and JS file that opens\n  straight in a browser. Render the QR client-side (a tiny library like\n  `qrcode-generator` from a CDN is perfect) and point it at `window.location` with a\n  sensible fallback for local previews. Make copy-code and copy-link actually write\n  to the clipboard and show feedback.\n- Keep it accessible (semantic HTML, labelled buttons, visible focus states,\n  keyboard support, and strong contrast). Respect `prefers-reduced-motion`.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"qr\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/qr"},{"slug":"resume","publishSlug":"resume","title":"Résumé","name":"Sam Rivera — CV","vertical":"Personal & creative","tech":"Plain HTML & CSS","summary":"A clean single-page web resume with a contact header, an experience timeline, a skills sidebar with animated proficiency meters, and a print-to-PDF stylesheet behind a Download PDF button.","order":300,"liveUrl":"https://resume.view.fast/","previewUrl":"https://resume.view.fast/","setupQuestions":["What's your name and current role/title?","What are your 3–4 most recent roles? (employer, dates, and a line on what you did)","What key skills should I highlight, and do you want a \"Download PDF\" button?","Where should people reach you — email, location, and any links (site, LinkedIn)?"],"photoTerms":["professional headshot neutral","minimal desk notebook pen"],"prompt":"Build me a **clean, single-page web resume (CV)** as a **plain HTML & CSS** site —\none `index.html` plus a small CSS and JS file, no framework and no build step, so it\nopens straight in a browser.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's your name and current role/title?\n2. What are your 3–4 most recent roles? (employer, dates, and a line on what you did)\n3. What key skills should I highlight, and do you want a \"Download PDF\" button?\n4. Where should people reach you — email, location, and any links (site, LinkedIn)?\n\n**Then build a complete, polished, responsive site with:**\n\n- A **header** with my photo, name, role, a one-line summary, and a contact row\n  (email, phone, location, website, LinkedIn) with small inline icons.\n- A short **Profile** paragraph in my voice.\n- An **Experience timeline** — each role with title, employer, dates, a one-line\n  summary, and 2–3 bullet points that lead with concrete outcomes and numbers.\n- A **Selected work** list with links to case studies or projects.\n- A **Skills** sidebar — tag chips for craft and tools, plus a few labelled\n  proficiency meters that fill in as they scroll into view.\n- An **Education** block, and a small \"Beyond work\" / languages block.\n- A **\"Download PDF\"** button that triggers the browser print dialog.\n\n**Design & content notes:**\n\n- Editorial and calm: an off-white canvas with a single white \"paper\" card, a\n  serif display face (e.g. Fraunces) for headings and a clean sans (e.g. Inter)\n  for body, one restrained accent color (a deep evergreen works well), and a real\n  two-column layout (main + sidebar) that stacks on mobile.\n- Include a dedicated **print-to-PDF stylesheet** (`@media print`) that hides the\n  toolbar and badge, switches to high-contrast black ink, keeps the two columns,\n  prevents roles from breaking across pages, and fits cleanly onto one page.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent\n  believable, specific bullet points (with numbers) if I leave gaps.\n- Use real images. Pull free photos that fit — a professional headshot and a\n  minimal desk/notebook footer image — e.g.\n  `https://picsum.photos/seed/headshot-1/480/480` (vary the seed), and add\n  descriptive `alt` text.\n- No build step — a single `index.html` with a linked CSS and JS file. Make the\n  \"Download PDF\" button call `window.print()`, and animate the proficiency meters\n  with an `IntersectionObserver` (respecting `prefers-reduced-motion`).\n- Keep it accessible (semantic HTML, a skip link, labelled contact links, good\n  contrast, visible focus styles, keyboard support).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"resume\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/resume"},{"slug":"roi","publishSlug":"roi","title":"ROI calculator","name":"Beacon ROI Calculator","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A B2B ROI / lead-gen calculator — enter your support spend, team size, and ticket volume and watch projected savings, payback, and reclaimed hours compute live with animated SVG charts, behind a gated \"email me the report\" CTA.","order":300,"liveUrl":"https://roi.view.fast/","previewUrl":"https://roi.view.fast/","setupQuestions":["What does your product save customers — time, money, or both — and what's the product called?","What are the 2-3 input variables a visitor types in, and the formula that turns them into savings?","What's the lead-capture CTA at the end — what do they get for handing over an email (a PDF report, a demo, a custom quote)?","Any brand details — product name, accent color, a one-line value prop, and a customer quote I can show?"],"photoTerms":["business analytics chart blue gradient dashboard","calculator finance desk documents","minimal data dashboard ui dark mode","professional headshot operations leader neutral"],"prompt":"Build me a **B2B ROI / savings calculator landing page** — a marketing page where a\nvisitor enters a couple of numbers about their team and instantly sees how much my\nproduct would save them, with a chart and a \"email me the report\" lead-capture CTA —\nas a **vanilla-JS app** (a single `index.html` plus a small CSS and JS file, no\nframework and no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What does your product save customers — time, money, or both — and what's the product called?\n2. What are the 2–3 input variables a visitor types in, and the formula that turns them into savings? (e.g. \"monthly support spend, team size, and ticket volume → we auto-resolve 42% of tickets at the current cost-per-ticket, minus a $49/agent fee\")\n3. What's the lead-capture CTA at the end — what do they get for handing over an email (a PDF report, a demo, a custom quote)?\n4. Any brand details — product name, accent color, a one-line value prop, and a customer quote I can show?\n\n**Then build a complete, polished, responsive site with:**\n\n- A compact hero: value-prop headline, sub-copy, three proof stats, and a \"calculate my savings\" button that scrolls to the tool.\n- The **calculator** as the centerpiece: a two-column layout with the inputs on the left (each a labelled number field paired with a synced range slider) and a live results panel on the right.\n- A **live results panel** that recomputes on every keystroke or slider drag: a big headline \"net savings, year one\" number, plus a stat grid (net savings / month, hours or units reclaimed, payback period, return multiple).\n- A **before/after bar chart** (cost today vs cost with the product) and a **cumulative-savings area chart** across 12 months — both drawn in inline SVG, no chart library, animated when values change.\n- A \"where the savings come from\" section: three numbered steps that explain the model honestly, so the number feels earned, not hand-wavy.\n- A **gated lead-capture CTA**: a name + work-email + company form that validates the email, and on submit hides the fields and shows a friendly success state (\"report's on its way to …\") that echoes the visitor's computed savings. A \"run another scenario\" link resets it.\n- A social-proof strip (customer logos + one testimonial with a headshot) and a footer.\n\n**Design & content notes:**\n\n- Modern B2B SaaS look: a light slate background, white cards with soft shadows, a\n  confident indigo→violet brand gradient, and a single emerald accent reserved for\n  savings/positive numbers. Use a geometric display face (e.g. Sora) for headings and\n  Inter for body. Round the corners, keep generous whitespace.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent believable\n  customer names, a testimonial, and sensible default input values (a typical\n  mid-market team) so the page looks alive on first load.\n- Make the math real and defensible: clamp the inputs to sane ranges, format currency\n  with `Intl.NumberFormat`, animate the result numbers, and keep the assumptions\n  (deflection rate, per-seat price) visible near the inputs with a \"reset to a typical\n  team\" link.\n- Use real images. Pull free photos that fit, e.g.\n  `https://picsum.photos/seed/roi-1/1200/800` (vary the seed), and add descriptive `alt` text. Give\n  each image an `onerror` fallback so it never shows a broken icon.\n- No build step — a single `index.html` with a linked CSS and JS file that opens\n  straight in a browser. Draw both charts as inline SVG with no external libraries.\n- Keep it accessible: semantic HTML, a `<label>` for every field, an `aria-live`\n  results region, keyboard-operable sliders, visible focus states, and good contrast.\n  Respect `prefers-reduced-motion` for the number tweens and chart animation.\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"roi\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/roi"},{"slug":"soon","publishSlug":"soon","title":"Coming-soon","name":"Soon by Northpeak","vertical":"Data, internal & startup","tech":"Vanilla JS","summary":"A single-screen coming-soon teaser with a live launch countdown, a validating email capture that confirms and remembers you, a waitlist counter, and social links.","order":300,"liveUrl":"https://soon.view.fast/","previewUrl":"https://soon.view.fast/","setupQuestions":["What's the product name, one-line promise, and intended audience?","What's the target launch date, and should the page show an exact date or a looser season/month?","Where should signups go, and what consent or privacy note belongs beside the form?","Which contact and social links should appear, if any?"],"photoTerms":["minimal gradient abstract","sunrise horizon minimal"],"prompt":"Build me a **single-screen \"coming soon\" teaser page** as a vanilla-JS app\n(a single `index.html` plus a small CSS and JS file — no framework, no build step).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the product name, one-line promise, and intended audience?\n2. What's the target launch date, and should the page show an exact date or a\n   looser season/month?\n3. Where should signups go, and what consent or privacy note belongs beside the\n   form? (Give me the form endpoint or mailing-list URL, or say \"demo only\".)\n4. Which contact and social links should appear, if any?\n\n**Then build a complete, polished, responsive single screen with:**\n\n- A small logo mark + product name, a confident serif headline, and the\n  one-line promise underneath.\n- A **live launch countdown** to the target date — days / hours / minutes /\n  seconds, updating every second, with a tidy \"Targeting <date>\" line. When the\n  date passes it should flip to a \"We're live\" state instead of going negative.\n- An **email capture** with real validation (friendly inline errors for empty\n  and malformed addresses) that swaps to a warm \"You're on the list\" success\n  state on submit, and remembers a returning visitor via localStorage so they\n  see the thank-you again instead of the form.\n- A subtle **waitlist counter** (\"Join N builders already waiting\") that ticks up\n  by one once you've joined.\n- A row of **social links** (X, GitHub, LinkedIn) plus a contact email.\n\n**Design & content notes:**\n\n- Calm, premium, pre-dawn mood: a near-black base with a soft animated\n  gradient \"aurora\" (amber → violet → rose) glowing up from the horizon, a\n  frosted-glass card, and a fine film grain. A serif display face (e.g. Fraunces)\n  for the headline and a clean sans (e.g. Inter) for everything else.\n- Use realistic content based on my answers — never \"lorem ipsum\". Invent a\n  believable promise and waitlist number if I leave gaps.\n- This page can stand entirely on its CSS gradient atmosphere — no hero photo\n  needed. If you do add imagery (e.g. an Open Graph preview), use real free\n  photos that fit, e.g. `https://picsum.photos/seed/soon-og/1200/630`, with\n  descriptive `alt` text.\n- No build step — a single `index.html` with a linked CSS and JS file that opens\n  straight in a browser. Drive the countdown from one editable `LAUNCH` date\n  constant; make the form actually validate; persist the signup in localStorage.\n- Keep it accessible (semantic HTML, a labelled email field, a skip link,\n  keyboard support, `aria-live` on the countdown and form status, good contrast,\n  and a `prefers-reduced-motion` fallback that stills the animation).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"soon\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/soon"},{"slug":"zine","publishSlug":"zine","title":"Web zine","name":"OFFCUTS №01 — Night Bloom","vertical":"Personal & creative","tech":"Plain HTML & CSS","summary":"A scrollable, art-directed riso web zine — seven full-viewport magazine spreads with custom display type, live film-grain and halftone texture, duotoned photos, and an \"issue-as-version\" colophon.","order":300,"liveUrl":"https://zine.view.fast/","previewUrl":"https://zine.view.fast/","setupQuestions":["What's the theme/mood of the issue, and a title for it (e.g. \"Night Bloom\", \"Concrete & Moss\")?","What are the 4–6 spreads of content (an editor's letter, a photo essay, a poem, an interview, field notes — tell me what each is about)?","Aesthetic: retro-web, brutalist, or riso? And any colors to lean into?","Any real contributors, quotes, or images to feature — or should I invent believable ones?"],"photoTerms":["riso print texture colorful","experimental editorial layout","neon sign workshop glowing glass tubes","rain slicked empty city street at night"],"prompt":"Build me a **scrollable, art-directed web zine — a single self-contained issue with\nunconventional, magazine-style spreads** as a **plain HTML & CSS** site (one\n`index.html`, no build step, no framework).\n\n**Before you build, ask me these questions in one message and wait for my answers. If I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the theme/mood of the issue, and a title for it (e.g. \"Night Bloom\", \"Concrete & Moss\")?\n2. What are the 4–6 spreads of content? (e.g. an editor's letter, a photo essay, a poem, an interview, field notes — tell me what each one is about.)\n3. Aesthetic: retro-web, brutalist, or riso? (And any colors you want me to lean into.)\n4. Optional: any real contributors, quotes, or images you want featured — otherwise I'll invent believable ones.\n\n**Then build a complete, polished, responsive zine with:**\n\n- A **cover spread**: the zine's name set huge in a display face, an issue number, a tagline for the theme, and a \"scroll to turn the page\" cue. Treat it like a real magazine cover.\n- **4–6 art-directed spreads**, each filling the viewport and each visually distinct — for example: an editor's letter with a drop-cap, a photo essay in an asymmetric image mosaic, a full-bleed poem or pull-quote spread, an interview with Q&A and a pulled quote, and a \"field notes\" collage of cards.\n- **Custom type + texture**: pair a bold display font with a serif body and a monospace for captions (load from Google Fonts). Add a film-grain and halftone-dot overlay so it reads as printed, not flat. Allow deliberate \"misregistration\" — offset color shadows on the headlines.\n- A **colophon** spread: the fine print — who made it, what fonts and \"inks\" were used, contributors, and an **\"issue-as-version\"** note that frames each issue as a permanent, immutable version (it ties naturally to how Spacefast keeps every publish at its own URL).\n- A running header that doubles as a **version tag** (e.g. \"№01 · v1.0\") and a spread counter that updates as you scroll.\n- A small newsletter signup in the colophon that validates the email, shows a friendly confirmation, and remembers returning readers via `localStorage`.\n\n**Design & content notes:**\n\n- **Riso print aesthetic** by default: a warm uncoated-paper cream base with three\n  fluorescent spot inks (e.g. fluorescent pink, federal blue, sunshine yellow) over a\n  near-black key plate. Big condensed display type, generous negative space, off-kilter\n  layouts. If I picked brutalist or retro-web instead, lean into that mood instead.\n- Treat photos as **duotone riso prints**: desaturate them and tint each with a spot\n  color via CSS blend modes, with a halftone dot pattern on top, so random photos still\n  look like one cohesive printed issue.\n- Use realistic content based on my answers — never \"lorem ipsum\". Write a real editor's\n  letter, a real poem, a believable interview, real field notes.\n- Use real images. Pull free photos that fit — e.g. `https://picsum.photos/seed/zine-1/1200/800?grayscale`\n  (vary the seed per image) or direct Unsplash URLs matching `riso print texture colorful`\n  and `experimental editorial layout` — and add descriptive `alt` text.\n- **No build step** — a single `index.html` with the CSS in a `<style>` tag and a little\n  vanilla JS for the scroll progress, spread counter, reveal-on-scroll, and the signup.\n- Keep it accessible: semantic HTML, a labelled signup field, good contrast, and honor\n  `prefers-reduced-motion` (no bobbing arrows or pulsing dots for those readers).\n\n**Add this exact line right before `</body>` so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"zine\"></script>\n```\n\n**When the site is ready, publish it to Spacefast with the direct API — no account, install, or extra instructions needed:**\n\n1. Use `./site` as the publish folder. For no-build projects, put only the finished public files in that dedicated folder. Confirm it has `index.html` at its root and no secrets, source files, `.git`, or `.spacefast` state.\n2. First publish: send every file as multipart form data. This Bash/Zsh block preserves relative paths and works for one file or a whole folder:\n   ```bash\n   PUBLISH_ROOT=./site\n   publish_files=()\n   while IFS= read -r -d \"\" file; do\n     relative=${file#\"$PUBLISH_ROOT\"/}\n     publish_files+=(-F \"files=@$file;filename=$relative\")\n   done < <(find \"$PUBLISH_ROOT\" -type f -print0)\n   curl -sS \"${publish_files[@]}\" \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n3. From the `{ \"data\": ... }` receipt, give me `data.space.liveUrl`, `data.version.immutableUrl`, `data.claim.url`, and `data.claim.expiresAt`. Remind me to claim within 6 hours. Keep `data.claim.token` secret.\n4. Save `data.space.id` and `data.claim.token` locally (for example in an ignored, mode-600 `.spacefast/state.json`). For a quick update, rebuild the `publish_files` array above and publish to the same space:\n   ```bash\n   SPACEFAST_SPACE_ID=<saved-space-id>\n   SPACEFAST_TOKEN=<saved-claim-token-or-access-token>\n   curl -sS -H \"Authorization: Bearer $SPACEFAST_TOKEN\" \\\n     -F \"spaceId=$SPACEFAST_SPACE_ID\" \"${publish_files[@]}\" \\\n     \"https://api.spacefast.com/v1/publish?wait=1\"\n   ```\n   If an update after claiming returns `space_claimed_credential_available`, exchange the saved claim token once at `POST https://api.spacefast.com/v1/anonymous-claim/exchange`, save `data.credential.accessToken`, and retry with that access token.\n\n**Optional shortcuts and reference only:** if the `sf` CLI is already installed, `sf publish ./site --wait` does the same job. A zip of the publish folder is also supported, but neither the CLI nor a zip is required. Docs: [direct agent/API publishing](https://spacefast.com/setup) · [files and folders](https://spacefast.com/help/publishing) · [claiming](https://spacefast.com/help/anonymous-publish) · [updates and rollback](https://spacefast.com/help/versions)","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/zine"},{"slug":"zero-perfect","publishSlug":"zero-perfect","title":"Realtime Zero app","name":"Zero Perfect","vertical":"Tools, apps & games","tech":"Spacefast Zero + Preact","summary":"A minimal full-stack todo app with database-backed queries and mutations, guest and Gravatar auth, Cast realtime, routes, and an HTTP endpoint.","order":310,"runtime":"zero","liveUrl":"https://zero-perfect.view.fast/","previewUrl":"https://zero-perfect.view.fast/","setupQuestions":["What should the app track instead of todos?","What should the app be called?"],"photoTerms":[],"prompt":"Build me a small full-stack todo app with Spacefast Zero and Preact.\n\nUse the Zero capsule model rather than a separate API server:\n\n- Define a `todos` table with text, completion state, and an owner ID.\n- Scope reads to `ctx.auth.userId` and expose them through a `todos` query.\n- Add todos through an `addTodo` mutation after trimming and limiting the text.\n- Show updates in realtime through the Zero client and Cast.\n- Support the built-in guest session and Gravatar sign-in/sign-out controls.\n- Add client routes for the todo list and `/status`.\n- Back `/status` with a `GET /api/status` Zero endpoint that returns `ok`.\n- Keep shared input cleanup and types in a pure TypeScript module.\n- Keep the app compact and accessible, with a labeled input, visible focus states,\n  useful empty/loading states, and responsive layout.\n\nUse this exact Spacefast badge in the generated document:\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"zero-perfect\"></script>\n```\n\nRun it locally with `sf dev`, verify both routes and a realtime todo update, then\npublish the project root with `sf publish`.","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/zero-perfect"},{"slug":"astro-zero","publishSlug":"astro-zero","title":"Astro blog with live comments","name":"Marginalia","vertical":"Developers & integrations","tech":"Astro + Spacefast Zero","summary":"A prerendered Astro blog whose every post carries realtime comments and emoji reactions from a Spacefast Zero capsule, published as one space.","order":320,"runtime":"zero","liveUrl":"https://astro-zero.view.fast/","previewUrl":"https://astro-zero.view.fast/","setupQuestions":["What is the blog called, and what is it about?","What are the first three or four posts?","Warm and editorial, or cool and technical?"],"photoTerms":[],"prompt":"Build me a small, beautiful **blog in Astro** where every post has **realtime\ncomments and emoji reactions**, powered by a Spacefast Zero capsule, published as\none site.\n\n**Before you build, ask me these questions in one message and wait for my answers.\nIf I skip anything, choose a sensible default and tell me what you chose:**\n\n1. What's the blog called, and what's it about?\n2. What are the first three or four posts? Titles are enough — you'll write them.\n3. Warm and editorial, or cool and technical?\n\n**Then build it as one Spacefast Zero project:**\n\n- An Astro site in `site/`, static output, posts as a content collection in\n  Markdown. An index page that lists the posts and a page per post.\n- `site/sf.jsonc` declaring the Zero runtime:\n  ```jsonc\n  {\n    \"$schema\": \"https://spacefast.com/schemas/sf.json\",\n    \"name\": \"<blog name>\",\n    \"access\": \"public\",\n    \"runtime\": {\n      \"kind\": \"zero\",\n      \"server\": \"server/index.ts\",\n      // Named but deliberately absent: with no file behind it the capsule is\n      // server-only, ships no app shell of its own, and Astro's HTML stays the\n      // page. That is the whole trick that lets a framework build sit in front\n      // of Zero. (`runtime.client` is still required by the config schema.)\n      \"client\": \"client/index.tsx\",\n    },\n  }\n  ```\n  Do not create `client/index.tsx`. If it exists, the generated Zero app shell\n  claims `index.html` and quietly shadows Astro's homepage.\n- `site/server/index.ts` — the capsule: a `comments` table and a `reactions`\n  table, both indexed by post slug; `comments` and `reactions` queries; an\n  `addComment` mutation that trims and length-limits its input and calls\n  `ctx.invalidate(\"comments\")`; a `toggleReaction` mutation that lets one reader\n  hold one emoji per post; and a `GET`/`POST` `/api/comments` endpoint so the\n  thread is readable and writable without a browser.\n- `site/src/components/Margin.tsx` — a Preact island that imports `useQuery`,\n  `useMutation` and `useAuth` from `@spacefast/zero/client`. Mount it\n  `client:only=\"preact\"`; the Zero client belongs to the browser, so the live\n  half of the page should never be rendered at build time. It discovers the\n  runtime from the page's own origin, so its only prop is the post slug. Readers\n  are guests by default; nobody signs up to leave a comment.\n- Keep the input cleanup and the shared types in `site/shared/`, imported by both\n  the island and the server, so the two sides cannot drift.\n- Wire `@spacefast/astro` into `astro.config.mjs` with `mode: \"static\"`, and put\n  at least one redirect and a couple of response headers through it. The\n  integration merges inline rules with a `_headers` file, applies them in\n  `astro dev` too, and writes the compiled `_redirects`/`_headers` into the build\n  output.\n\n**Design & content notes:**\n\n- Editorial and typographic: a real reading measure, a serif for headings, one\n  accent color, and a dark mode that follows the system.\n- Write the posts. Real paragraphs with a point of view, 500–800 words each —\n  never \"lorem ipsum\" and never an outline pretending to be an essay.\n- The comment thread is part of the page, not a widget bolted under it: same\n  measure, same type scale, visible focus states, a labeled input, and honest\n  empty and pending states.\n- Keep it accessible (semantic HTML, real labels, keyboard support, good\n  contrast) and responsive down to 320px.\n\n**Add this exact line right before `</body>` on every page so the site carries\nits badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"astro-zero\"></script>\n```\n\n**Build and publish:**\n\nAstro's build and the capsule's build are two steps, and Zero publishes a project\nroot rather than a folder of files. So build the site into `site/dist/`, copy\n`sf.jsonc`, `server/` and `shared/` in beside that output, and publish that\ndirectory:\n\n```sh\ncd site\nbun install\nbun run build          # astro build, stage the capsule beside dist/, then sf build dist\nsf publish dist --wait\n```\n\nThen check it live: load a post, leave a comment in a second browser window, and\nwatch it appear in the first without a reload. Give me the live URL, the claim\nURL, and remind me to claim within 6 hours.","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/astro-zero"},{"slug":"wp-zero","publishSlug":"wp-zero","title":"WordPress + Zero","name":"Broadsheet — WordPress + Spacefast Zero","vertical":"Developers & integrations","tech":"WordPress + Spacefast Zero","summary":"A magazine whose articles come from a public WordPress REST API at build time and render to static pages, with a Spacefast Zero server behind them for realtime emoji reactions and server-side search over a build-time index.","order":330,"runtime":"zero","liveUrl":"https://wp-zero.view.fast/","previewUrl":"https://wp-zero.view.fast/","setupQuestions":["Which WordPress site should the articles come from (any public site URL or /wp-json REST root, e.g. https://wordpress.org/news)?","What should the publication be called?","What's the accent color (a hex like #d9410b)?"],"photoTerms":[],"prompt":"Build me a **magazine whose articles come from WordPress but whose interactivity comes\nfrom a server** — headless WordPress rendered to static pages at build time, plus a\nSpacefast Zero capsule behind them for realtime reactions and search. One project, one\n`sf.jsonc`, one publish.\n\n**Before you build, ask me these questions in one message and wait for my answers. If I\nskip anything, choose a sensible default and tell me what you chose:**\n\n1. Which WordPress site should the articles come from? Any public site URL or `/wp-json`\n   REST root works — default to `https://wordpress.org/news`.\n2. What should the publication be called?\n3. What's the accent color (a hex like `#d9410b`)?\n\n**Build time — pull WordPress, render flat HTML:**\n\n- Read posts with the `@spacefast/wordpress` client\n  (`createWordPressClient({ url })`, then `posts.list({ perPage, orderBy: \"date\", _embed: true })`).\n  `_embed` returns the author, featured image, and terms in the same request, so there is\n  no N+1. Fall back to plain `fetch` against `/wp-json/wp/v2` if the package is\n  unavailable.\n- Normalize the messy CMS shapes once: rendered titles carry HTML entities, excerpts carry\n  markup, a post may have no featured image, and terms arrive as a nested array of\n  taxonomies.\n- Render a magazine index (lead story plus a card grid) and one static page per post.\n  Article bodies are the post's own WordPress HTML, so handle what a real editor ships:\n  lazy-loaded images with captions, responsive iframe embeds, blockquotes, tables that can\n  scroll on a phone, and `<pre><code>` blocks that do not blow out the column.\n- Emit a search index (JSON) of every post's slug, title, excerpt, and plain-text body, and\n  compile it into the capsule so the server can search it.\n\n**Runtime — one Spacefast Zero capsule:**\n\n- Declare `\"runtime\": { \"kind\": \"zero\", \"server\": \"server/index.ts\", \"client\": \"client/index.tsx\" }`\n  in `sf.jsonc`.\n- A `reactions` table keyed by post slug, emoji, and `ctx.auth.userId`. The built-in guest\n  session is the identity — nobody signs in to press an emoji.\n- A `reactions` query returning per-emoji counts and which one the current visitor picked,\n  and a `toggleReaction` mutation that adds, switches, or removes. The Zero client\n  subscribes, so a reaction in one browser moves the count in another through Cast.\n- `GET /api/search?q=` searching the build-time index server-side and returning JSON.\n- `GET /api/reactions?slug=` and `POST /api/react` so the same behavior is reachable with\n  `curl`, not only from the page.\n\n**Wiring the two halves together:**\n\n- The generated app shell owns `/index.html`, so serve the magazine index from\n  `home.html` and set `\"index\": \"home.html\"` in `sf.jsonc`. Turn on `cleanUrls` so\n  articles live at `/posts/<slug>`.\n- Each static page mounts the reaction island into a `<div id=\"root\" data-slug=\"…\">`\n  placed exactly where the reaction bar belongs, loads `/client.js`, and carries the\n  platform import map that `sf build` writes into the generated shell — read it out of\n  `.spacefast/zero/public/index.html` and inline it. That means the build runs `sf build`\n  once to materialize the shell, renders the pages, and lets the real `sf build` publish\n  them.\n- The search box is plain `fetch` against `/api/search` — no framework needed for an HTTP\n  endpoint.\n\n**Design & content notes:**\n\n- Magazine, not blog template: a real masthead, a strong editorial serif for headlines, a\n  narrow measure for body copy, generous white space, one accent color used sparingly.\n- Responsive and accessible: semantic landmarks, a labeled search input, visible focus\n  rings, `aria-pressed` on the reaction buttons, live-region announcements for counts, and\n  contrast that survives the accent color.\n- The images and words are real — they come from WordPress. Never invent post content.\n- Say plainly, in the footer, which half of each page is static and which half is the\n  runtime.\n\n**Add this exact line right before `</body>` on every page so the site carries its badge:**\n\n```html\n<script src=\"https://spacefast.com/badge.js\" data-example=\"wp-zero\"></script>\n```\n\n**Run it, then publish:**\n\n```sh\ncd site\nbun install\nbun run build            # fetches WordPress, generates the index, renders the pages\nsf dev                   # previews the Zero server and client\nsf publish --skip-build  # the capsule and the static tree, in one version\n```\n\n`--skip-build` matters: a Zero project with a `build` script sends `sf publish`\ndown the static-site path, where it reruns the build and then fails looking for a\n`dist/` a capsule never produces. Everything is already built by this point.\n\nCheck `GET /api/search?q=<something>` returns results, post a reaction and read the count\nback, then open two browsers on the same article and confirm one reaction moves both\ncounts.","repoUrl":"https://github.com/spacefast/examples/tree/master/recipes/wp-zero"}]