Build a website with AI: about $20 a month, then $0 for the server

You hear that “you can build a website with AI,” and you still do not know, specifically, what to subscribe to and what to type. This article is for the person who is stopped there.

The money, first. This is all it costs.

Something that costs several hundred thousand yen if you hire a production company can be kept, in effect, for the domain fee alone.

I am building Shoryaku AI ( https://shoryaku.net ), a marketing-support service, as an indie developer. Almost every page on the site was written by AI, and there are 7 pages by industry. I will write, in order, what I asked for and how.

Programming knowledge is not assumed. I also do not write that “AI does all of it.” This includes how far you can hand it off, and where it always fails.

What you use is an “AI agent,” which is a different thing from ChatGPT

Get this aligned first. ChatGPT and Claude, which you usually use in a browser, are tools that return an answer when you ask. Even if they teach you the code, saving it and running it is your job.

What this article uses is a kind of tool called an AI agent. The difference is only one thing.

Ask it to “make the top page,” and the agent actually creates the files. Say “the type is small,” and it opens that file and fixes it. That is the decisive difference.

There are three representative ones.

For someone who has been wondering “what is Codex?”, think of it as the mode inside ChatGPT that can touch files itself.

Price: each starts at about $20 a month

These are the individual prices on each company’s official page as of September 5, 2026. Prices change often, so check the official page yourself before you subscribe.

(Sources: claude.com/pricing, learn.chatgpt.com/docs/pricing, cursor.com/pricing. All confirmed on 2026-09-05.)

You do not need to subscribe to all three. To build one website, any one of them is enough.

The three differences are “which models you can choose” and “how usage is counted”

On Shoryaku AI I subscribe to paid plans for all three and use them for different jobs. On top of that, two differences actually mattered.

Difference 1: one company’s models, or several companies’

Claude Code uses Anthropic’s models. Codex uses OpenAI’s models. Only Cursor can choose from several companies. According to the official documentation, in addition to Cursor’s own models you can use models from Anthropic, OpenAI, Google, and others, and switch among them inside the pricing plan.

“This model is off today, so I’ll try another” is possible only in Cursor. The other side of that is that more choices means you are lost at the start.

Difference 2: when usage resets

This is the one you feel the most. None of them is “unlimited.” Use a certain amount, and you are made to wait. The counting differs.

(Confirmed on 2026-09-05 in each company’s official documentation or help center. The numeric limits themselves are not published by any of the three. Check them on each tool’s usage screen.)

In practice it works like this. If you want to build a lot at once on the weekend, Cursor is easier to handle, because it is less likely to stop on a time window. If you move a little at a time on weekdays, any of them is fine.

If you already use Claude in the browser, watch the point that Claude Code work eats that allowance. On the day you build the website, the usual chat stops sooner.

If you are unsure

Codex. It is included in ChatGPT’s free plan, so you can try it without subscribing, and if it is not enough you can move up to Plus as it is. You do not need to pay $20 only to decide on the first one.

The steps: make one folder, and have it open that folder

Once you have subscribed, this is all you do.

1. Anywhere on the computer, make one empty folder (for example, mysite)
2. Start the AI agent, and have it open that folder
3. Talk to it

In the Claude Code desktop app, a screen for choosing a folder appears. In Cursor it is “Open folder.” The contents of this folder become your website as they are.

Prompts I actually type

You do not need a long spell. Short, specific, and in order works better.

1. First, explain what you are making

If you say “make a website” right away, you get something bland. Say first who the page is for, and what it tells them.

I want a one-page site for a bodywork clinic.
The customers are women in their 30s to 50s, and many come for stiff shoulders and lower-back pain.
The main thing I want them to do is book by phone. Next is booking on LINE.
I want the first-visit ¥2,980 campaign to stand out the most.
Start with a simple one-pager in HTML and CSS only.

It is better to add “HTML and CSS only, to start.” If you do not specify, the agent sometimes brings out a full framework (React, Next.js, and so on). You get something that runs, and afterward you cannot touch any of it yourself.

2. Look at what was made with your own eyes

The report “it’s done” and the actual screen ordinarily diverge. Always look. There are three ways to look.

If you are unsure, drag and drop is the reliable one. It does not go through the agent, so you do not have to wonder “is that file really like that?”

Then show it to the agent too.

Open the finished page in a browser, take a screenshot, and show it to me.

3. Fix the look

This is where you type the most. You do not need technical terms. Say what you see.

The headline at the top is small, and on a phone it wraps to 3 lines and is hard to read.
Make it larger, and fit it in 2 lines.

The phone-number button is toward the bottom, and people do not notice it.
Keep it shown at the bottom of the screen even while scrolling.

There is too much color overall. Use only blue, white, and gray.

4. Always specify how it looks on a phone

This is worth saying every time.

Check that it does not break when viewed at the width of an iPhone SE (375px).
Take a screenshot and show it to me.

The agent tends to be satisfied once “it looks correct on a computer screen.” Real visits are mostly on phones, so specify the width as a number and have it check.

5. When you add pages, say “the same build”

Shoryaku AI’s pages are 7, by industry. At that point, if you ask plainly, all 7 are copied as separate files. Then changing one phone number means editing 7 places.

So you ask like this.

I want to expand this page into 5 pages, by industry.
Do not make copies of the page.
Put only the headline, the problem, the price, and the FAQ
into one file as data for each industry,
and reuse one shared look.

Shoryaku AI’s pages are in this form. Each page’s file is only 6 lines, and all of the differences in content are in one data file. When you want to fix the wording, you only have to look at that file.

Three things that always happen if you leave it to AI

This is the main part. If you leave it, they always happen. All of them actually happened on Shoryaku AI.

1. It writes fictional results

This is the most dangerous one. “500 companies using it,” “customer quotes,” “98% satisfaction.” Website templates ordinarily have slots like these, so if you do not instruct it, the AI helpfully fills them in.

Shoryaku AI still has not a single paying customer. Even so, a slot for “logos of companies using it” appeared.

The text you publish is subject to the Act against Unjustifiable Premiums and Misleading Representations. Leave it in by accident and publish, and there is real harm.

The way to stop it is to say it every time.

Do not write results, customer quotes, companies using the product, or user counts
except for facts I passed.
When you put out a number, also write where the basis for it is.

2. A different color comes out every time

Yesterday blue, today purple. Say “put it back to the color from before,” and it becomes yet another blue.

The cause is that “the correct color” is not written anywhere. Because it is not written, the agent guesses it every time.

The way to stop it is to decide the colors, and write them down in a file.

I want to decide the colors this site uses.
The main indigo is #1e3a5f, the accent is #e8a317, and the text is #101a26.
Do not use any other color.
Write this rule in a file called COLORS.md and keep it.
From now on, always read that file before you touch a color.

3. It rewrites places you did not ask for

You ask “make the headline bigger,” and the layout has changed along with it.

There are two ways to stop it.

Before you change anything, tell me which file and which part you plan to change.
Do not make the actual change yet.

The other is to save at each break in the work. The agent will do it if you ask.

Save the current state with git. I want to be able to go back later.

git is a mechanism that keeps a history of changes. You do not need to understand the insides. It is enough to be able to say “save” and “put it back to the state from before.”

Going further: write the rules in a file

Read this once the pages have grown and the fixes have piled up. You do not need it to make one page.

The three ways to stop it above have something in common. A caution written in a prompt disappears when that conversation ends. Tomorrow you make the same mistake again.

The countermeasure is simple. Write what you want followed in a single file inside the folder.

Make a RULES.md in this folder.
I want the contents followed from now on. Always read it at the start of a conversation.

- Do not invent results or numbers
- Colors are only #1e3a5f, #e8a317, #101a26, and white
- Every time, check that it does not break on a phone (375px)
- Before a large change, explain the change first

After that, say “read RULES.md” at the start of the conversation. One file is enough, and the cautions you were writing every time are no longer needed.

The point is to keep it to one file. There was a period on Shoryaku AI when the same contents were written in several files, and only one of them went stale, and an agent that read the old one wrote with the old rules. Now the source of truth is one, and the other files only point at it and say “read that one.”

What you cannot leave to AI

I will write this plainly.

• It cannot judge “this looks somehow cheap.” It can point out a violation of the color rules, but cramped spacing, or a photo that looks dated, has to be seen by a person
• It does not know what to write in order to sell. What the customer is stuck on, and which words land, is something you know. AI’s job is to put that in order
• Do not trust “it’s done.” Always look with your own eyes, on both a computer and a phone

Aside from these three, you can mostly leave the rest to it. You do not need to learn how to write HTML, or how to make it work on a phone.

If you get stuck, show the screen

While you are working, “the screen I was told about does not appear” always happens. Admin screens change often, so the written steps and the screen in front of you diverge.

At that point, put the Chrome extension (Claude in Chrome) on Claude’s desktop app, and you can show the screen you have open and ask “where do I press?” It is more reliable than reading the steps as text.

The continuation is written in How to publish a website without paying for hosting. That is the procedure for publishing at a server cost of ¥0, and how to get your own domain.

• AI
• Indie development
• Product