How to build a website with an AI coding agent: what to build, how to instruct it, how to preview and review its work, and to take the files and put them online
To build a website with AI, you describe the site in plain language and an AI coding agent writes the files: the HTML, the styles, the scripts, and a README that says how to run it. You preview the result, ask for changes in follow-up instructions, review exactly what each instruction changed, and download the finished files to host wherever you like. The agent does the typing. You still decide what the site says and whether it's right.
That's how Carpathian App Builder works, and it's the workflow this guide walks through. You'll need a clear idea of what the site is for, and the facts it should contain. You don't need to know how to code, though it helps when you want to fix something small by hand.
What does it mean to build a website with AI?
There are two different things sold under the name "AI website builder." One is a hosted page editor that uses AI to fill in a template, and the site lives inside that company's editor. The other is a coding agent, a model that writes source files from your instructions, and the result is a folder of code you own and can take anywhere.
The difference matters later more than it does on day one. A template editor is quick, but the site only exists in that editor, so leaving means rebuilding. A coding agent gives you ordinary files: an index.html, a stylesheet, some JavaScript, maybe a small backend. Any web developer can read them, any host can serve them, and the agent can keep changing them as long as you keep asking.
App Builder is the second kind. Each app is a workspace of text files that belongs to your organization, an AI agent writes into it, and you can download the whole thing as a zip whenever you want.
What should you prepare before you start?
Prepare the facts, not the design. The agent is good at layout and code and has no way to know your prices, your opening hours, your team's names, or what makes your business different. Anything you don't give it, it will invent, and invented copy reads like every other generated site.
A one-page brief covers most of it:
What the site is for. "Get people to book a consultation" is more useful than "a website for my firm."
The pages. Home, services, pricing, about, contact, or whatever your site needs.
The content. Your own words for the headline, the services, the prices, the FAQs. Rough is fine.
The look. Brand colors as hex codes, the fonts you use, and one or two sites whose style you like.
What it should not do. No stock testimonials, no fake statistics, no newsletter popup.
You can upload that brief to App Builder as a reference document, along with anything else the agent should work from: a price list as CSV, a menu as text, an existing page as HTML, a config as JSON or YAML. Uploaded documents go in the app's docs/ folder, and the agent is told to read them as the facts to work from and never to edit them. That keeps your source material intact however many times the site is rewritten.
Step 1: Create an app and give the first instruction
Enable App Builder from Services in the dashboard, create an app, and give it a name. Then open the Agents tab and write your first instruction. The first instruction should describe the whole site at the level of a brief, point the agent at your uploaded documents, and ask for something it can finish in one pass.
A first instruction might read:
Build a three-page website for a small accounting firm: Home, Services, and Contact.
Use the facts in docs/brief.md and the prices in docs/prices.csv, and don't invent
anything that isn't in them. Plain HTML, CSS, and JavaScript, no frameworks.
Navy and white, with the accent color from the brief. It should work well on phones.
Pick a model from the list beside the prompt box. Each model shows its per-token rates there, so you can see what you're choosing before you start. How to Write Prompts That Get AI to Build the Website You Want goes further into what makes an instruction work.
Step 2: Watch the agent plan and write
Once you start it, the agent writes a short plan as a checklist and ticks each step off as it goes, so you can see where it is. It lists and reads the existing files before changing anything, writes complete code rather than placeholders, and includes a README that explains how to run the project. Each file it changes shows up in the Agents tab with a summary.
A few habits are built in that you'd want from a careful developer:
It keeps the project runnable from its files alone, with whatever manifest or config it needs.
It puts index.html at the root and links its CSS and JavaScript by relative path, so the preview can render it.
It never writes secrets into files. Anything like an API key is read from an environment variable, and the README names the variable.
For a larger job, the agent can split the work and hand pieces to helper agents that run alongside it. You'll see those nested under the agent that started them, each with its own progress. You can stop any agent while it works.
Step 3: Preview the site
The Preview tab renders the app's main page the way a visitor would see it, inside a sandboxed frame. It's the fastest way to judge a layout, check the copy, and click through the navigation without downloading anything.
The preview is deliberately locked down, because the code was written by a model and it runs next to your dashboard. Scripts and styles in the app's own files run, but the page can't reach the network, can't submit forms, and can't load scripts from outside the app. A contact form that does nothing in the preview is expected. A page that pulls a library from a CDN will look broken in the preview even if it would work on a live host, so asking for plain, self-contained files gives you a more useful preview.
Step 4: Ask for changes in small steps
After the first pass, make changes one at a time. "Make the pricing cards stack on phones" is something the agent can do well and you can check in seconds. "Redo the whole site but better" gives it nothing to aim at and gives you nothing to check.
Each new instruction starts with the agent reading the app's current files and the last five instructions with how they turned out, so you don't have to repeat context from one step to the next. Point at things by name when you can: the page, the section, the button text. If something looks wrong, say what you see and what you expected, rather than how to fix it.
Step 5: Review what changed, and undo what you don't want
The Changes tab is the app's history. Every instruction is one entry, with the instruction as its label and a line-by-line diff of every file it touched, the same kind of diff a developer reads before merging code. Reading the diff is how you catch the agent changing something you didn't ask it to.
If an instruction went somewhere you didn't want, undo it. Undo restores every file that run wrote, and it walks back in order, so it never overwrites later work. To undo an older change, undo the ones after it first.
Step 6: Edit by hand when it's quicker
Some fixes are faster to type than to describe. The Files tab lets you open any file, edit it, upload new ones, and create, move, or delete folders. A corrected phone number or a fixed typo is quicker to type yourself than to describe to an agent.
Hand edits show up in the Changes tab like any other entry, so the history stays complete and you can undo your own edits the same way.
Step 7: Download the files and put the site online
When the site is ready, download the whole app as a zip. What you get is ordinary source code with a README, so it isn't tied to App Builder or to Carpathian.
App Builder writes and previews your site, it doesn't host it. There's no built-in "publish" button that puts the app on a public URL, and the agent can't run commands or start a server inside the workspace. Getting the site online is a step you take with the downloaded files.
What is AI website building bad at?
AI agents are good at turning a clear description into working code, and weak in the same places every language model is. They state wrong things in the same confident tone as right ones, they fill gaps with plausible inventions, and they can write code that looks finished and doesn't work.
In practice, that means:
Facts. Anything not in your brief may be made up. Check every name, number, and claim on the finished site.
Generic copy. Without your words to work from, headlines drift toward the same phrases every generated site uses.
Accessibility. Ask for it explicitly, then check it: alt text, contrast, heading order, keyboard navigation.
Anything it can't see. Forms, payments, logins, and integrations need testing on a live host, because the preview can't make network calls.
A model also won't tell you when a website is the wrong answer to your problem. That part is still your job.
What does it cost to build a website with AI?
On Carpathian, App Builder is billed as AI usage. Every agent run is charged per token at the rates of the model you picked, the same rates as the rest of Carpathian AI, and it appears on your bill as App Builder with the model's name. There's no separate seat fee or per-site charge. Current rates are on the pricing page and beside each model in the prompt box.
The Agents tab shows what the app has spent this month, how many tokens it used, and how many instructions you've given, and each agent shows its own tokens and cost. Starting an agent needs a payment method on file and an account in good standing, and your organization's spend cap applies.
Where Carpathian fits
App Builder gives your organization an AI agent that writes a website or app into files you own, a sandboxed preview, a full history with diffs and undo, and a zip download, billed per token on the same account as the rest of Carpathian's cloud and AI products. You choose the model, and you can see the rate before you start.
It doesn't host what it builds or run its code. If you want a site that's live the moment the agent finishes, with no files to handle, a hosted template builder will suit you better. If you'd rather own the code and put it where you like, App Builder fits, and a Carpathian cloud server is one place to run it.
Create an account and enable App Builder from Services, or contact us if you'd like our team to build the site with you.
How to Build a Website With AI, Step by Step | Carpathian