Ship a real landing page in an afternoon with Claude Code

1Check your plan and pick where to run it

Claude Code isn't on the Free plan. It's included in Pro ($20 a month, or $17 a month billed yearly), Max (from $100 a month), Team and Enterprise. You can also use a Claude Console account with prepaid API credits.

macOS, Linux or WSL:   curl -fsSL https://claude.ai/install.sh | bash
Windows PowerShell:    irm https://claude.ai/install.ps1 | iex
Homebrew:              brew install --cask claude-code
WinGet:                winget install Anthropic.ClaudeCode

Install commands change, so check them against the official docs before you run one. Never used a terminal? Anthropic has a terminal guide. After installing, claude --version should print a version number.

2Write your brief before you open Claude Code

Claude builds what you describe, and a vague brief gets a generic page. Spend 20 minutes here. If you have a facts file from Set up Claude, paste it in first.

Interview me, one question at a time, to write a one-page brief for my landing page:
who it's for, the problem in their words, what we promise, how it works in 3 steps,
the proof we actually have, the one action we want visitors to take, and the tone.

Rules: use only what I tell you. Where I have no proof yet, write "None yet" instead
of inventing customers, numbers or logos. Finish with the brief as a markdown file
called brief.md.

3Make a folder and send the first prompt

1. Create an empty folder, for example my-landing-page, and put brief.md in it.
2. Desktop app: in the Code tab, choose Local, select the folder, then pick a permission mode. Terminal: cd into the folder and run claude.
3. Choose how much Claude can do alone. Manual asks before every edit and command. Plan explores and proposes a plan without editing. In the terminal, press Shift+Tab to switch modes.

Read brief.md. Build a one-page landing page from it.

Constraints: plain HTML and CSS in index.html and styles.css, no frameworks and no
build step. Mobile-first. Sections: hero with one headline and one button, the problem,
how it works in 3 steps, proof (only what's in the brief), FAQ, and a waitlist form
with name and email. Use [brackets] for anything the brief doesn't cover.
No invented testimonials, statistics or logos.

Before you start: set up git in this folder and commit after each working step.
Explain each command in one sentence before you run it.

4Preview it and iterate with screenshots

• Desktop app: Claude can open the page in the Browser pane, take its own screenshots, click around and fix what it finds. You can also click any HTML file path in the chat to open it there.
• Terminal: open index.html in your browser and refresh after each change.

Show, don't describe. Take a screenshot of the part you don't like and add it to your message: drag and drop it, or in the terminal paste it with Ctrl+V (Alt+V on Windows). In the desktop app, use the attachment button.

Here's a screenshot of the hero on my phone [attach]. Three changes:
1. [the headline wraps badly: make it shorter or smaller]
2. [the button is below the fold: move it up]
3. [too much empty space under the logo]
Change only these, show me the result, then commit with a clear message.

Made a mess? In the terminal, run /rewind (or press Esc twice) to restore the code from before a prompt. Rewind doesn't undo files changed by shell commands, which is why git commits are your real safety net.

5Put it live on a free host

Pick one. Both have a free plan and let you drag and drop your folder.

Netlify: sign in, drag your folder onto the drop zone, and you get a live URL. To update it, drag the new folder onto the drop zone on your site's Deploys page. Batch your changes: 300 credits covers about 20 production deploys if nothing else uses credits.

Cloudflare Pages: in the dashboard, open Workers & Pages, choose Create application, then Get started, then Drag and drop your files. Name the project and deploy. Your site lives at <project-name>.pages.dev.

6Connect your own domain

Buy a domain from any registrar. Cloudflare Registrar says it adds no markup to domain prices and includes free WHOIS redaction.

• Netlify: open Domain management, choose Add a domain, then Add a domain you already own. Netlify DNS is the simplest route and handles the SSL certificate for you. With outside DNS, point www at your-site.netlify.app with a CNAME record.
• Cloudflare Pages: open your project, choose Custom domains, then Set up a domain. A root domain like yourstartup.com must be added to Cloudflare first (you switch its nameservers). Add the domain in Pages before you create any DNS record yourself, or visitors get an error.

DNS changes can take up to 48 hours. Paste any error into Claude Code and ask it to explain. Never paste your registrar password into a chat.

7Add the waitlist form and keep it safe

On Netlify, a normal HTML form becomes a working inbox. In your site's Forms page, choose Enable form detection. Submissions appear under Forms, and Submission notifications can email you each one. On Cloudflare, create a Google Form, choose More, then Embed HTML, and ask Claude to place the code in your page.

Make the waitlist form work with Netlify Forms: add name="waitlist", method="POST" and
data-netlify="true" to the form tag, keep the name and email fields, and add a simple
thank-you message after submit. Add one line under the form saying what we'll do with
their email: [e.g. "One email when we launch. No spam."]. Then commit.

What's next

Send traffic to it with your first 10 customers, test the message with validate your idea, or prototype a calculator for the page first with Claude artifacts. Then let Claude handle the weekly checks with Automate your week.