Build track: a comparison site

⏱ 60 min11 steps

A comparison site compares products in one and links to where to buy them. It's the easiest first build: no logins, no payments, no app store. My examples are MahjongCompare, Protein Compared and OffGrid Compare.

With plain links it's rung 1 on the ladder from What to build. Affiliate links make it rung 3.

Putting it on your own is the fiddly part, spread over a few days. Expect a wait or two, and check under the step when one drags on.

niche One narrow topic or kind of product, like mahjong sets or protein powder. All wordsdomain Your website's name on the internet, like gethomebydark.com. You rent it by the year from a company called a registrar. All words

Before this, you'll want:

Steps

Step 1 of 110 done · about 60 min left

Steps for

Step 1 of 11, not done yet
Step 2 of 11, not done yet
Step 3 of 11, not done yet
Step 4 of 11, not done yet
Step 5 of 11, not done yet
Step 6 of 11, not done yet
Step 7 of 11, not done yet
Step 8 of 11, not done yet
Step 9 of 11, not done yet
Step 10 of 11, not done yet
Step 11 of 11, not done yet

Pick one niche you know better than a generic review site
The best niche is one where you already know what people get wrong. You know which features matter and which are marketing. That's what a big review site can't fake.
1. Write down your niche in one line.
2. List 10 products in it, with the three facts people compare most.
That's not what I see
Every niche I think of already has big review sites.
Go narrower. Not "kitchen gear" but "cast-iron skillets for camping." Big sites cover everything a little. You can cover one thing properly.
Start Claude Code in your my-idea folder
1. Open (Cmd+SpaceWindows key, type Terminal, press Enter).
2. Go to your my-idea . Type this and press Enter:
  cd ~/Backyard/my-idea
  cd ~\Backyard\my-idea
3. Check the says my-idea.
4. Start . Type this and press Enter:
  claude
Terminal An app on your Mac where you type instructions instead of clicking on things. Claude Code works inside it. All wordsfolder A place on your computer that holds files and other folders, like a drawer in a filing cabinet. All wordsprompt line The line in Terminal that ends with a % sign. The word right before the % is the folder you're in. All wordsClaude Code Claude, working inside Terminal. It can make files and run things on your Mac, with a safety checker watching what it does. All words
You should see:
Claude Code's name and version at the top, a line starting with ❯ where you type, and ⏵⏵ on in the bar at the bottom.
auto mode Claude works without asking, and a separate safety checker blocks anything risky. All words
That's not what I see
It says "cd: no such file or directoryCannot find path … because it does not exist".
The my-idea folder isn't there. It comes from Check the idea first and The three files, so do those first, then come back.
It says "zsh: command not found: claudeThe term 'claude' is not recognized".
This Terminal window doesn't know about Claude Code. Close the window with Cmd+WCtrl+Shift+W, open a new one and try again. If it still says that, go back to Claude Code and .install Put a new program on your computer so you can use it. All wordssign in Tell Claude Code which Claude account is yours, so it knows you've paid for it. All words
Add the comparison-site part to your PRD
This has Claude interview you about the site, one question at a time, and add what you say to with a "Done means" list.
1. Copy the prompt below.
```
I'm building a comparison site. Add a section to PRD.md called "Track: comparison site" and interview me, one question at a time, to fill it in: the niche, and why I know it better than a generic review site; 10 to 30 products and the facts people actually compare (price, size, what's included); where the product data comes from and how it stays up to date; and how the site earns, if it does: no money at first, or affiliate links, and which programs. Then add this "Done means" list: one niche; 10 to 30 products; every buy link goes to a real product page; if there are affiliate links, a clear disclosure sits next to them; it's live on my domain and works on a phone; Google Search Console is set up; it counts clicks on buy links; and a privacy page says what the visitor stats collect. Show me the section before you save it. Don't build anything yet.
```
1. Paste it into Claude Code with Cmd+VCtrl+V and press Enter.
2. Answer each question, then read the section and tell Claude what to fix.
prompt What you type to Claude. A good one says what you want, how to work and what never to do. All wordsPRD.md One page on the problem, who it's for, and what "done" looks like. PRD stands for product requirements document. All words
You should see:
Claude asks you one question, about your niche, and waits for your answer. At the end, it shows you the section before it saves it.
That's not what I see
Claude says there's no PRD.md.
Do The three files first, then come back to this step.
I don't want to deal with affiliate programs yet.
Then don't. Tell Claude: No affiliate links for now. A comparison site with plain links earns nothing, but it needs far less paperwork, and you can add affiliate links later.
Plan and build the first version, one step at a time
This is the "plan the build" prompt from Starter prompts. Claude shows a numbered plan, waits for your OK, then builds one step at a time. What good looks like goes at the end.
1. Copy the prompt below.
```
Goal: build the smallest version from PRD.md for the people it names, to the quality bar I give at the end. How to work: 1. Read PRD.md and CLAUDE.md first. 2. Plan before you build. Write the plan as a numbered list of small steps, each one something I can check. Show it to me and wait for my OK. 3. For each step, say how we'll know it works, like "I open the page and see X". 4. Build one step at a time. After each step, check it yourself, tell me what you checked and what you didn't, then stop for me to look. Rules: Never say something works unless you checked it. Never buy, subscribe or sign up for anything. Never delete files without asking. Ask me when you're unsure, one question at a time. Start by reading the files and showing me the plan. The quality bar, what good looks like:
```
1. Paste it into Claude Code with Cmd+VCtrl+V.
2. Type a space, then what good looks like, like a stranger can find the best skillet for camping in under a minute, on a phone.
3. Press Enter.
4. Read the plan. Ask about any step you don't follow, then type OK.
5. After each step, look at what Claude made before you tell it to go on.
When the first page is built, go back to Working isn't the same as good and do its steps from step 4 on.
You should see:
Claude reads PRD.md and , then shows you a numbered plan of small steps and waits for your OK.
CLAUDE.md A note to Claude about how to work in this project. Claude Code reads it at the start of every session in that folder. All words
That's not what I see
Claude wants to add lots of features.
Point it at your PRD. Type: Only what's in "Done means" in PRD.md. Put everything else under Not doing yet.
Claude says it needs to install something first.
In auto mode it won't install programs for you. Ask it: Can we build this as plain HTML and CSS, with nothing to install? For a first comparison site, the answer is usually yes.
PRD.md has more than one Track section.
Tell Claude: Build only the "Track: comparison site" section for now.
Check it like a stranger before anyone sees it
This is the "check my work" prompt, in a fresh conversation, so the checker isn't the one who built it.
1. Leave this conversation. Type this and press Enter:
  /exit
2. Start a fresh one. Type this and press Enter:
  claude
3. Copy the prompt below.
```
You're reviewing work someone else did. Your job is to find what's wrong, not to approve it. Read PRD.md for what this is supposed to do. Then check the thing I name at the end: 1. Does it do what PRD.md says? Check each "Done means" item and say pass or fail, with what you saw. 2. Look at it the way a real person would, on a phone too, and list anything broken, confusing or slow. 3. Check every fact, number and name against its source. List any you couldn't verify. 4. List anything that could embarrass me or cost money: wrong prices, broken links, private information showing, test content left in. Rank what you find, worst first. Don't fix anything; only report. Check this:
```
1. Paste it into Claude Code with Cmd+VCtrl+V.
2. Type a space, then the whole site, every page and every buy link.
3. Press Enter.
4. Tell Claude to fix what it found, worst first, then look yourself, on your phone too.
These are the mistakes I see most:
- Prices and stock go stale. Decide how they get refreshed before launch: by hand each week, or a .
- Thin pages. A list of products with no real comparison won't rank. Say which one is best for whom, and why.
- Broken or untagged links quietly earn nothing. Check them.
- Leftover drafts going public. Check the live site, not the code.
Good place to stop. Steps 6 to 11 put it online, with waits in between.
script A list of instructions your Mac follows in order, written down so it can do them again whenever you ask. All words
You should see:
Claude reads PRD.md, marks each "Done means" item pass or fail, then lists what it found, worst first. It doesn't change anything.
That's not what I see
Some buy links go to the wrong page.
Ask Claude to check every link and list the ones that don't land on the right product. Then click a few yourself. Broken links quietly earn nothing.
It says everything is fine.
Ask it: What's the weakest part? If you had to find one more problem, what would it be? Reviewers who everything aren't reviewing.approve Say yes when Claude Code asks before it changes something. In manual mode, nothing gets written until you do. All words
Send the finished version to GitHub
Cloudflare Pages, in the next step, puts your site up from . This prompt sends the latest version there and asks Claude what Cloudflare needs to know.
1. Copy the prompt below, paste it into Claude Code and press Enter.
```
Save this version of the site and send it to GitHub on a new branch, then open a pull request. Don't merge it. Give me the link. Then tell me what Cloudflare Pages needs to build this site: the build command and the build output directory, or say plainly if it needs no build step.
```
1. Open the link, read the , and it, the way you did in Branches and pull requests.
2. Write down the build and the build output directory Claude gave you.
3. Back in Claude Code, type Switch back to main and get the change from GitHub. and press Enter.
GitHub A website that keeps a copy of your git project, with every version saved. Your backup, and where changes get reviewed. All wordspull request A request to bring a branch's change into the main version. You read it first, then merge it or don't. All wordsmerge Bring a change from a branch into the main version. All wordscommand An instruction you type into Terminal. Your Mac does it when you press Enter. All wordsmerged Brought into the main version. Merged doesn't mean working. You still check. All words
You should see:
Claude opens a pull request and gives you its link. Then it tells you the build command and the build output directory, or says there's no build step.
That's not what I see
Claude says this folder isn't on GitHub.
Do Branches and pull requests first. It puts my-idea on GitHub as a private . Then come back.repository One project on GitHub, with all its files and every saved version. People say repo for short. All words
Put the site on the internet with Cloudflare Pages
Cloudflare Pages takes your site from GitHub and puts it on the internet. Each time you merge a pull request into main after this, it puts the new version up by itself. You set it up in your , so there's nothing to install. Check the current price on Cloudflare's own pricing page before you sign up.
1. Go to dash.cloudflare.com and sign up with your project email. Turn on , the way you did in Security basics.
2. Open Workers & Pages. Click Create application, then choose Pages and Connect to .
3. Choose GitHub. On GitHub's page, choose Only select repositories, pick my-idea and click Install & Authorize. Back on Cloudflare, pick my-idea and click Begin setup.
4. Under Set up builds and deployments, check that Production says main. Type the build command and build output directory from step 6. If Claude said there's no build step, type exit 0 in the build command box.
5. Click Save and Deploy. When it finishes, click Continue to project.
browser The app you use to visit websites, like Safari or Chrome. All wordstwo-step sign-in Signing in with your password plus a second thing, like a code on your phone, so a stolen password isn't enough. All wordsgit A tool that saves a snapshot of your project every time you ask, so you can always go back. All wordsbranch A copy of the project where you try a change without touching the main version. All words
You should see:
Your project's page, with an address ending in .pages.dev. Opening it shows your site.
That's not what I see
My my-idea repository isn't in the list.
Cloudflare only sees the GitHub repositories you let it. Follow what the GitHub page asks to give it access to my-idea, then go back and pick it.
The deploy failed.
Copy the last lines of the build , paste them into Claude Code, and ask: The Cloudflare Pages build failed with this. What do I change? Fix it on a branch, merge it, and Cloudflare tries again.log A running list a program writes as it works, saying what it did and what went wrong. All words
Buy your domain and point it at the site
Your domain is your site's name, like yourname.com. Buying it from Cloudflare is the shortest road here, because a name like that has to have its settings on Cloudflare to work with Cloudflare Pages. You do the buying yourself, on Cloudflare's own site. Claude never sees your card. The price is on the page before you pay, and it depends on the ending, like .com or .org.
1. Cloudflare only sells domains to accounts with a verified email, so click the link in its sign-up email first.
2. In the Cloudflare dashboard, go to Register domains. Type the name you want and click Search.
3. Click Purchase on the one you pick. Fill in your contact details and payment, read the agreements, and click Complete purchase.
4. Go back to Workers & Pages, click your project, then click Custom domains.
5. Click Set up a domain, type your domain, like yourname.com, and click Continue. Then follow what the page asks to finish.
You should see:
Your domain in the Custom domains list. Once Cloudflare finishes setting it up, typing your domain in the browser opens your site.
That's not what I see
I already bought a domain somewhere else.
For a name like yourname.com, Cloudflare Pages needs the domain's settings on Cloudflare. In Custom domains, type it anyway and follow what Cloudflare asks. It may tell you to change the domain's nameservers at the company you bought it from. Their help pages show where.
Typing my domain doesn't open the site yet.
A new domain can take a while to start working. Check what the Custom domains list says it's waiting on, and try again later.
My site stopped working a week or two after I bought the domain.
Check your email for Cloudflare's message asking you to confirm your contact email, and click the link. Until you do, ICANN's rules make Cloudflare hold the domain.
Add your site to Google Search Console
is free, from Google. It tells you whether Google has found your site and what people searched to get there. A Domain property covers every version of your address, with or without www. You prove the domain is yours by adding one line to its settings, called a .
1. Go to search.google.com/search-console and sign in with your Google .
2. Open the menu at the top left and click Add property. If Google asks what kind, pick Website property, then Domain.
3. Type your domain with nothing in front, like yourname.com, and continue.
4. Copy the TXT record Search Console shows you. Leave this tab open. If Search Console shows Cloudflare with a Start verification button, click it, sign in to Cloudflare, allow it, and skip to action 7.
5. In another tab, in the Cloudflare dashboard, click your domain, then , then Records. Click Add record.
6. For Type, choose TXT. For the name, type @. Paste what you copied as the record's value, and click Save.
7. Back in Search Console, click Verify.
A week later, follow Step 5 of "Set up Google Search Console for your site" to read your first numbers.
Search Console A free Google tool that shows whether Google has found your site and what people searched to get there. All wordsTXT record A line of text in your domain's DNS settings. Google reads it to check that the domain is yours. All wordsaccount A sign-in with a company, like a domain, email or hosting. Whoever owns the account controls what's in it. All wordsDNS The settings that tell the internet where your domain's website and email live. All words
You should see:
A message saying Ownership verified, or a message saying what Google couldn't find. The reports stay empty for the first few days.
That's not what I see
It says it couldn't verify my domain.
The record can take a while to show up. Google says a record added by hand can take up to two or three days. Wait a day and click Verify again.
My domain's settings aren't on Cloudflare, and I can't find where to add the record.
Choose prefix instead, type your full address like https://yourname.com/, and pick the HTML tag method. The tag isn't a password. It sits in your home page where anyone can see it, so it's fine to give to Claude. Copy the tag and ask Claude: Add this tag to the head of the home page on a new branch and open a pull request. Then paste the tag. Merge it, wait for Cloudflare to put it up, and click Verify.URL The address of a page on the internet, like gethomebydark.com. You type it in the bar at the top of your browser. All words
Set up visitor stats in Google Analytics
Pick one tool for visitor stats and stay with it. This track uses Google Analytics, because it counts clicks on links that leave your site, like your buy links, without extra setup. Google calls them outbound clicks.
1. Go to analytics.google.com and sign in. The first time, click Start Measuring.
2. Name the account and the property after your site. Pick your time zone and currency, answer the questions about your business, and click Create. Read and accept the terms.
3. When it asks where to collect data, choose Web. Type your domain and a name, leave Enhanced measurement on, and click Create stream.
4. Under Stream Details, copy the . It starts with G-.
The Measurement ID isn't a password. It goes into every page of your site, where anyone can see it, so it's fine to give it to Claude.
Measurement ID The short code, starting with G-, that tells Google Analytics which website a visit belongs to. All words
That's not what I see
It didn't ask me to make a data stream.
Click Admin, then under Data collection and modification, click Data streams, then Add stream, and choose Web.
I'd rather not use Google for this.
PostHog is one alternative. Pick one tool, check on its own site that it counts clicks on links to other sites, and follow its setup page. In the next step, tell Claude which tool you picked.
Add the stats and a privacy page, then check the live site
Google's terms for Analytics say your site has to have a that tells visitors you use it, and that it uses cookies. This prompt adds the tag and a privacy page on a branch, so you can read both before they go live. Where the law asks for visitors' consent first, you need that too. Steps 8 and 9 of the lesson "Visitor stats: Google Analytics or PostHog" find the official rules where your visitors are and turn on a .
1. If Claude Code isn't open, open Terminal and go to your my-idea folder. Type this and press Enter:
  cd ~/Backyard/my-idea
  cd ~\Backyard\my-idea
2. Check the prompt line says my-idea, then type this and press Enter:
  claude
3. Copy the prompt below.
```
Add Google Analytics to every page of this site with the Measurement ID I give at the end, using Google's tag in the head of each page. Do it on a new branch. Then add a privacy page, linked from the bottom of every page. Put a line at the top saying it's a draft for me to check. In plain words, say this site uses Google Analytics to count visits and clicks on links to other sites, and that it may collect things like which pages people visit, their rough location, their device and browser, and how they found the site. Say whether the tag as you added it sets cookies, and mark that line CHECK. Add a line pointing to Google's page "How Google uses information from sites or apps that use our services". If the site has affiliate links, say so. Write FILL IN for my name, how to contact me and the date. Don't promise anything I haven't told you, and don't say it meets any particular law. End with a list of each thing it says Analytics collects, so I can check them against Google's help. Don't add anything else that collects data. Open a pull request, don't merge it, and give me the link. My Measurement ID:
```
1. Paste it into Claude Code with Cmd+VCtrl+V.
2. Type a space, then your Measurement ID, like G-A1B2C3D4E5.
3. Press Enter.
4. Open the link and read the pull request, the privacy page most of all. Fill in every FILL IN and CHECK before you merge. If it's right, merge it. Cloudflare puts the new version up by itself.
5. Back in Claude Code, type Switch back to main and get the merged change from GitHub. and press Enter.
6. Open your domain on your phone, and click one of your buy links.
7. In Google Analytics, click Reports, then Realtime, and look for your visit, and a click event under event names.
Later: a weekly job that checks prices and broken links for you, and a for the same niche, fed by the same data.
privacy policy A page that tells visitors what information your site collects about them and what you do with it. All wordscookie banner The notice on a website that asks visitors whether it may store cookies, the small files that remember them between visits. All wordsnewsletter A regular email for people who signed up to hear about one topic. All words
You should see:
Claude opens a pull request and gives you its link. Within about 30 minutes of your first visit after the merge, the Realtime report in Analytics shows at least one visitor: you.
That's not what I see
It says "cd: no such file or directoryCannot find path … because it does not exist".
The name was spelled differently. Type ~/Backyard/my-idea~\Backyard\my-idea exactly as it's written here and press Enter.cd The command that moves Terminal into a folder. Type cd, a space and the folder's name. It's short for change directory, an old word for folder. All words
It says "zsh: command not found: claudeThe term 'claude' is not recognized".
This Terminal window doesn't know about Claude Code. Close the window with Cmd+WCtrl+Shift+W, open a new one and try again. If it still says that, go back to Install Claude Code and sign in.
Realtime shows nobody.
Google says data can take up to 30 minutes to start. Check the pull request is merged and Cloudflare's latest deploy finished, then open your site again on your phone. An ad blocker can hide your own visit, so try on your phone using cellular data.

Your challenge

Pick your niche and list 10 products in it, with the three facts people compare most. Do it before you build anything.

Last checked 2026-10-20

Build something new › 3. Pick a track and build it