AI website stack
- Open source parts (MIT)
- Astro on GitHub
- Keystatic on GitHub
- Every change is a Git commit
How we build websites, using AI coding tools, from the first commit to a live page, with every change checked before it ships.
- 13 Oct 2026this site went live on it
- 1-2 minfrom save to the site
- 6tools it connects to
Why we build our own site this way
We build it, AI is a tool
We use Claude Code and Cursor to work faster. We decide what the site says, review every pull request and choose when it goes live.
Fast by default
Astro turns every page into plain HTML and only sends JavaScript for the parts that need it, like the menu or an animation.
Editing in a form
Keystatic gives each kind of page its own form. You fill in the fields and click Save. No code, no Designer.
Every change kept in Git
Each code change and each save is a commit on GitHub, so you can see who changed what and put any page back.
Pages built from blocks
Every section is a block with its own reference. We add, reorder and hide them in the editor, and the style guide shows every version side by side.
Checks before it ships
Tests and a content check run on every change, and we screenshot the changed pages at desktop and phone width before a merge, so a broken reference or a cramped phone layout never reaches the site.
We build our websites ourselves, with AI tools like Claude Code and Cursor to speed us up, and we check every change before it ships. This site is the worked example. It used to be a Webflow site. Since 13 October 2026 it has been built with Astro, an open-source web framework, from content files in GitHub. Keystatic is the editor, and one Cloudflare Worker serves the site.
Who does what
We build the site. Claude Code and Cursor are the AI tools we use to do it faster. We decide what the site says, review every pull request, check the pages and choose when they go live.
How a change gets to the site
- We make the change: code goes through a pull request, a copy edit is a save in Keystatic.
- Either way it is a commit on GitHub, so we can see who changed what and put it back.
- GitHub runs the tests and the content check, builds the site and deploys it to Cloudflare, usually within a minute or two.
The checks
Tests, a content check that stops a broken reference before it deploys, screenshots of the changed pages at desktop and phone width before a merge, and a person reviewing each pull request. A change that fails any of them does not ship.
Content is just files
Every tool, case study and post is a small JSON file in the project, so we and our AI tools can search, check and change content the same way we change code.
Blocks, not one-off pages
Each section is a block with a permanent reference. Most pages are a list of blocks put in order in Keystatic. All the tool pages share one layout, so a change there reaches every tool at once.
Forms go straight to our systems
Every form posts to the Worker, which checks it and hands it to n8n. n8n saves the lead and tells us. The site itself never sends email.
When we would not use this stack
It is the right call when a site needs custom code. It is not the right call for every site. Pick what yours needs to do and we will tell you what we would use.
Your team edits it visually
| What matters | ||
|---|---|---|
| How you edit | Fields in a form. A new kind of section needs a developer to build the block first | On the page itself, and designers can move and restyle anything in the Designer |
| A brand-new page design | A developer builds the blocks, then anyone can use them | Your designer builds it in the browser |
| Hosting | You set it up (ours is a Cloudflare Worker) | Included in the site plan |
| Undo | Every save is a Git commit you can revert | Automatic backups you can restore |
| What you pay for | Hosting, plus developer time for new blocks | A site plan for each site, plus seats for your team |
| Who looks after it | A developer, or us | Webflow runs the hosting and the platform |
Our pick: Not this stack. Webflow, if your marketing team wants to change layouts and publish without a developer.
You need custom code
| What matters | ||
|---|---|---|
| Custom logic | Written in the site's own code, server endpoints included | Custom code embeds, marketplace apps or a separate service |
| Pages made from data | Generated from content files when the site builds | CMS collections, with an item limit on each plan |
| Forms | Post to your own endpoint, which passes them on (ours go to n8n) | Webflow's form handling, or a webhook out to your tools |
| Checks before publishing | Scripts run on every change and stop broken content | You check it in the Designer before you publish |
| What loads in the browser | HTML, plus JavaScript only where a component needs it | jQuery and Webflow's own scripts by default |
| Your content | JSON or Markdown files in your own Git repo | In Webflow's CMS, out through the API or a CSV export |
Our pick: This stack. Forms that feed your CRM, pages built from data and checks before anything ships are all code in one project, and our AI tools can read it as easily as we can.
You sell online
| What matters | ||
|---|---|---|
| Products and stock | You'd build them or connect a service | Shopify handles products, variants and stock |
| Checkout | Not included, you'd connect a payment provider | Shopify's own checkout, so the design hands people into the cart |
| Storefront design | Fully custom, built as blocks in code | A Shopify theme, or a Webflow design on top, joined by an app such as Smootify |
| Tracking | You build and test it yourself | We send purchase events server-side, because browser tags often fail on a Shopify checkout |
| Who looks after it | A developer, or us | Shopify runs checkout and the platform, and you edit products in Shopify and pages in the storefront |
| What you pay for | Hosting, plus developer time | A Shopify plan, plus a Webflow site plan and the sync app if the storefront is on Webflow |
Our pick: Not this stack. Shopify for the products and checkout. The storefront is whatever suits the brand: a Shopify theme, or a custom Webflow storefront on top.
Webflow and Shopify facts are from their own sites and docs, October 2026, and from our own ecommerce builds. Prices change, so we've kept their numbers out. Our side is from this site's own code and docs.
What we connect it to
A fast site still needs tracking, good content and a quick follow-up on every enquiry before it brings in customers.
GitHubHolds the code and the content. Every pull request and every CMS save is a commit.
CloudflareServes the site from a Worker and stores the uploaded images.
Claude CodeAn AI tool we use for code. Changes are tested and reviewed before they merge.
CursorAnother AI tool we use for code, working in its own branch.
n8nGets every form the site sends and follows it up.
WebflowWhat this site moved off. We still build sites on it when the team wants to edit visually.
It's one part of the setup.
If another part is broken, this one wastes money.
What's a customer worth?
- 1
- 2
- 3
- 4
Where we've used AI website stack
- Built by us
Pacing AI
The Cursor skills, connector notes and workspace setups we use on client work, on one site. Copy a folder, or ask us to set it up on your tools.
See the build - Built by us
This website
How we rebuilt pacing.agency in Astro, with Keystatic as the editor and one Cloudflare Worker, in three weeks.
See the build+4
- Built by us
biio.link
Your social bios send people to a page on your own website, not someone else's, and Google Analytics shows how many came. Free for Pacing clients.
See the build
Services that use it
We don't sell it on its own. Each of these services uses it alongside the rest of your setup.
- Place in the loop: WebsiteWebsite Design & DevelopmentWebsites that look the part, turn visitors into enquiries, and that your team can update without a developer.Related tools: Webflow, AI website stack, Shopify, FigmaHow it fits
- Custom BuildsWe build the one tool your current software can't give you, and connect it to your website, tracking and CRM. You get the working tool, the connections and a plain write-up of how it runs.How it fits
What AI website stack is
Two open-source tools do most of the work. Astro is a web framework for content sites: it turns pages into HTML when the site builds and only sends JavaScript for components marked as interactive. It is MIT-licensed, and its team joined Cloudflare in January 2026. Keystatic, made by Thinkmill and also MIT-licensed, edits the Markdown, JSON and YAML files in a project through a form in the browser and saves them straight to GitHub.
Questions about AI website stack
Straight answers on how we work, what it costs and what to expect. If yours isn't here, just ask.
Still have questions?
Talk to usShould I move my Webflow site to Astro?
Probably not, if your team edits pages in Webflow every week and the site does what you need. Webflow's visual editor is hard to beat for that.
It's worth it when the site needs things Webflow makes awkward: custom logic, pages built from data, forms that go straight into your own systems, or content kept in Git with checks before anything ships. That's why we moved our own site.
Start with your numbers.
We'll tell you which tools you need and which connections are missing.
Bring your numbers.
We'll tell you if the spend makes sense.
- A 15-minute callYour goals, your challenges, and whether we're the right fit.
- A 1-hour discovery callWe dig into your numbers. Worth a hundred emails.
- A concrete planAds, a custom build or both, as a one-off project or ongoing.





























