Sprint Reference

Build websites with AI

Universal rules

  1. 01When something goes wrong — copy the error, paste it into Claude, ask what it means.
  2. 02Two terminal tabs at all times — Tab 1 = Claude Code, Tab 2 = dev server.
  3. 03You are responsible, not Claude. Always review changes before they go live.
  4. 04Push and commit to GitHub after every task — every push is a restore point.

Daily use

Start new project

Do this once when you create a brand new project. After this, you'll use the Continue project page every day.

Habits

  1. 01Keep folder, GitHub repo and Vercel project names the same — avoids confusion later.
  2. 02Don't put project folders in Dropbox — Dropbox sync mid-creation breaks builds.
  3. 03Always cd into your project folder BEFORE starting Claude Code — Claude works on whatever folder you're in.
  1. 1

    Create a new project folder in Finder

    Inside your main projects folder, make a new subfolder named after your project. Keep this name consistent — use the same name for the GitHub repo and Vercel project later.

  2. 2

    Right-click the folder → Services → New Ghostty window here

    Mac trick: opens a terminal already navigated into that folder. (If you're not using Ghostty, replace with your terminal of choice — Warp, Terminal, etc.)

  3. 3

    Or — navigate manually with cd

    If you skipped the right-click trick, navigate to your project folder manually. Replace the path below with yours.

  4. 4

    Start Claude Code (Tab 1)

    You'll know it worked when you see your project folder name at the bottom of Claude Code.

  5. 5

    Ask Claude to set up Next.js

    Type this inside Claude Code. Say Yes to any prompts. Takes a few minutes.

  6. 6

    Open a second terminal tab

    Cmd + T. Then navigate to your project folder again.

  7. 7

    Check for a website subfolder

    If you see 'website' in the results, run: cd website

  8. 8

    Start your dev server (Tab 2)

    Leave this running. Don't close the tab.

  9. 9

    View your local site

    If port 3000 is busy it'll use 3001 — use whichever it tells you.

  10. 10

    Build something — describe it in Claude Code

    Keep prompts simple to save tokens.

  11. 11

    Push to GitHub

    Type this in Claude Code. It handles everything automatically.

  12. 12

    Sign in to Vercel with GitHub

    Go to vercel.com → Log in → Continue with GitHub. First time only — Vercel is free.

  13. 13

    Import your GitHub repo

    On the dashboard, click Add New → Project. Find your repo in the list, click Import. If it's not there, click 'Adjust GitHub App Permissions' and grant Vercel access first.

  14. 14

    Hit Deploy — accept all defaults

    Vercel auto-detects it's a Next.js project. Don't change any settings. Wait ~1–2 minutes — you'll see a confetti animation when it's done.

  15. 15

    Visit your live URL

    Click Visit (or the preview thumbnail). Your URL looks like https://your-repo-name.vercel.app — share this with anyone. From now on, every push to main on GitHub auto-deploys.

  16. 16

    (Optional) Rename the URL

    Project → Settings → Domains → Add a different .vercel.app subdomain (free). Custom .com domains require buying through a registrar.

Quick version — Ship Studio

Ship Studio wraps the same workflow visually. Instead of running terminal commands to make a new project, type a name and click enter. Same Claude Code under the hood. Free at ship.studio.

  1. 1

    Open Ship Studio

    Download from ship.studio (free, Mac and Windows).

  2. 2

    Click 'New project'

    Type a project name → click enter. Ship Studio creates the folder, runs Next.js setup, installs dependencies — all behind one button.

  3. 3

    Pick your agent

    On the home page, scroll to the bottom — install Claude Code, Codex, OpenCode, etc. Switch anytime.

  4. 4

    Open existing projects

    Click 'open' on any existing project folder to manage it visually.

  5. 5

    View branches, GitHub status, Vercel URL

    All visible in the UI instead of running git commands. Same terminal underneath.