How I build agency-grade websites with Claude Code (my real stack)

You don't write the website. You direct it. That's the idea that changes everything. The beginner's trap is thinking you have to type every line: you don't. You decide the architecture and the rules; Claude Code writes the code at your pace. With your documentation done right, one person ships like a small studio. Here's the exact stack I use and the method that keeps it from falling apart halfway through.

What stack do I use to build a website with Claude Code?

Four pieces, no more to get started: Next.js, Tailwind, Supabase and Vercel. It's the same combination behind sites like OpenAI's or Notion's, all open source or free-tier, and it fits the AI-directing workflow perfectly.

• Next.js — the foundation. The React framework behind practically every serious frontend today. Open source.
• Tailwind — the styling. You style straight from the code instead of wrestling loose CSS files.
• Supabase — the data. Real PostgreSQL, with a login system (Auth) already included.
• Vercel — the publishing. Connect GitHub and your site is online in seconds.

You're the architect; the AI is the team writing the code. That's the only hierarchy that matters.

How much does this stack really cost?

Almost everything is free to start, but there's an "almost" worth saying out loud: the tool that accelerates you, Claude Code, is paid from day one.

| Tool | Free to start | You start paying when… | | --- | --- | --- | | Next.js | Always. Open source. | Never. | | Tailwind | Always. Open source. | Never. | | Supabase | Free plan: holds an entire project. | Heavy traffic or a large database. | | Vercel | Hobby plan: perfect to launch. | Commercial use or high traffic. | | Claude Code | Not free. | From day one (paid Claude account). |

The stack costs nothing to start; the acceleration does. Honesty first: for a small business the free Supabase and Vercel plans are more than enough, but know it before you promise anything.

What's the method that keeps the AI from falling apart?

Documentation first, one phase at a time. One session = one phase. The beginner's mistake is asking the AI for everything at once: the context gets muddy, it makes things up, and the result collapses. The method that works is the opposite — split the project into small phases and give it one per session.

1. You write the CLAUDE.md — a document that gives it permanent context: stack, rules and architecture.
2. Claude Code reads it and executes — every session starts by reading that context before touching a line.
3. You verify by opening files — don't trust the summary. Open one or two key files and confirm what it claims is actually there.
4. /clear and on to the next phase — you wipe the context between phases. Fresh memory, better results.