How to Build a Website with Claude: 3 Ways Compared

Published 2026-09-19

Asking Claude for a website is easy. Getting that website to a URL other people can open, with a contact form that actually reaches your inbox, is where the question usually stalls.

There are three realistic answers, and they are good at different things. This guide compares them honestly, then walks through the one that needs the least setup.

The three options at a glance

None of these is "the best one". Pick by what you are actually trying to do.

Option 1 — Artifacts: fastest, but it is not your website

Ask Claude for a landing page and you get a working page you can look at immediately, iterate on in the same conversation, and share with a link.

What it is good at: showing a layout to a colleague, testing a headline, prototyping before you commit to anything.

Where it breaks: the page lives inside Claude rather than on an address you control, and a form on it has nowhere to send submissions. Treat it as a sketch, not as your storefront.

Option 2 — Claude Code, GitHub and Cloudflare Pages: real site, real setup

Claude Code writes the files on your machine, you commit them to GitHub, and Cloudflare Pages builds and serves the result on a domain you own.

What it is good at: you own every file, hosting a static site is inexpensive, and you can take the project anywhere later.

Where it breaks: it assumes you are comfortable with a terminal, Git and a deploy pipeline. And a contact form still needs a backend — a static host will serve your HTML, but it will not store what someone types into it. That is usually the step people underestimate.

Option 3 — A connector: Claude publishes the page for you

A connector gives Claude a way to operate another service directly from your conversation. FormEdge exposes one over MCP, so Claude can build the page, save it as a draft, hand you a preview link, and publish it once you approve — while the form on that page stores submissions, and emails you about them once you set a notification address (the last step).

What it is good at: no terminal, no deploy step, and the form works on the first try.

Where it breaks: you are working inside one service's page builder rather than arbitrary code, and connecting an AI agent requires a paid plan.

Walkthrough: publishing with the connector

1. Create a FormEdge account

   Sign up with an email address. The free plan is enough to build and publish a page from the dashboard; the connector in the next step is what needs Starter.

2. Add the connector in Claude

   In claude.ai, open Settings > Connectors and connect FormEdge from the list — it is in the directory, so there is no URL to type. Claude sends you to FormEdge to sign in.

   In Claude Code, or in a client with no directory, register the server URL instead and authenticate from the session.

   Connector URL

   Copy

   https://mcp.formedge.app/mcp

3. Approve what Claude may do

   The first time you ask Claude to do something, FormEdge answers that the connection is not approved yet, and Claude passes you a link to the approval page. There you choose the workspace and the scopes Claude gets. Approve, then ask again. Those scopes are the whole boundary, so grant narrowly:

   • Grant create and edit, or Claude has nothing to build the page with.
   • Leave publishing out if you want to review and publish yourself; you can add it later.
   • Grant the notification settings scope if you want Claude to set where new submissions are sent (the last step uses it). It is off by default; without it, set the destination in the dashboard.
   • Delete permissions are off by default and cannot be undone. There is an unpublish action for taking a page offline, so you rarely need delete at all.

   You can change or revoke this later under Settings > External app connections in the dashboard.

4. Describe the site and ask for a preview

   Give Claude the facts rather than letting it invent them, and ask it to stop before publishing.

   Prompt to paste

   Copy

   Build a one-page site in FormEdge for my business.
   
   - Name: (e.g. Sunny Spot Bakery)
   - What we do: (e.g. sourdough bread and pastries, baked in-house every morning)
   - Address: (e.g. 123 Main Street, Springfield)
   - Phone: (e.g. (555) 555-0142)
   - Hours: (e.g. 7 AM to 4 PM, closed Mondays)
   - What makes us different: (e.g. locally milled flour, naturally leavened, nothing frozen)
   
   Sections: intro, what we offer, how to find us, and a contact form.
   Contact form fields: name, email, message.
   
   Do not publish it yet — give me a preview link first.

5. Read the preview before you trust it

   Open the preview on a phone as well as a desktop, and check the things Claude could not have known:

   • Hours, address and phone number, exactly as you gave them
   • Claims you never made — "free parking", "open daily", award language
   • Whether the page still reads like your business at the length it ended up
   • Layout that leans to one side, or gaps that look unintended

   Corrections go back into the same conversation. For layout, describing what you see is enough.

   Prompt to paste

   Copy

   Shorten the headline.
   We are also closed on Tuesdays.
   Add "Corner of Main and 3rd" to the directions section.
   The menu section looks pushed to the left — center it.

   

6. Publish the page

   When the page reads correctly, ask Claude to publish it and give you the public URL.

   Prompt to paste

   Copy

   Looks right. Publish it and send me the public URL.

   

   You can open the example page that was built by following these steps. It is a fictional shop.

7. Make sure enquiries reach you

   Last, set where the form sends a notification when someone submits it.

   Prompt to paste

   Copy

   When someone submits the contact form, notify me by email at (your email address).

   By default the email only tells you that a submission arrived. Ask Claude to include the submitted content if you want it in the email; either way, every submission stays readable in the dashboard.

   Paid plans can also notify Slack or LINE, or call an external system through a webhook.

   Then submit the form once yourself and confirm that the notification reaches the address you set — a form nobody has tested is the most common way a new site quietly loses enquiries.

Going further than a contact form

Once the page is live, the same form can collect more than a message.

• Booking requests — add the fields you need for a date and time. What arrives is a request, not a confirmed booking; you check availability and reply.
• Payments — take card payments after submission as a fixed amount multiplied by a quantity.

Which one should you pick?

If you are exploring, start with an artifact — it costs nothing and takes a minute. If you want to own the code and you already live in a terminal, Claude Code with a static host is the right shape. If what you need is a page at a real URL with a form that works today, the connector route skips the parts that usually stall.