My AI web development stack in 2026 — how I build websites with Claude, Astro and Cloudflare

Two years ago, a typical marketing website took me four to six weeks. Now I’m comfortably delivering the same result in one to two weeks — sometimes less. Not because I’m working harder, but because the tools have fundamentally improved.

This article is for web designers, developers and business owners who want to understand how to actually use AI in a web development workflow. Not as hype, but as concrete tooling. I’ll walk through what I use, why I use it, and when to pick which framework.

Why AI code assistants are different from what you think

Most people imagine “AI and web development” as a chatbot that generates code snippets you paste in manually. That was 2023.

What Claude Code does is fundamentally different: it understands your entire project, reads files, writes and edits code, runs terminal commands, and builds what you describe step by step. It’s not autocomplete — it’s a junior developer who never gets tired, has no ego, and is always available.

The biggest difference from tools like GitHub Copilot or Cursor: Claude thinks about architecture. If I say “build a blog post system with content collections in Astro”, it understands what that means, which files are needed, how to sort by date, and what SEO structure makes sense. It asks for clarification when something is ambiguous, and corrects itself when things go wrong.

That doesn’t mean it’s always right. Claude makes mistakes. It sometimes overestimates its knowledge of very recent libraries. And it helps enormously if you understand what’s happening under the hood. But for someone with a solid web development background, it’s a multiplier — not a replacement.

Claude Code + Ship Studio: my daily setup

I use Claude Code on the Pro subscription: €21 per month (roughly $23). For that you get access to Claude Sonnet — fast, capable and more than sufficient for virtually any web project.

If you’re building a lot or working on large codebases, upgrading to Max is worth considering. But for most freelance and agency projects, Pro is plenty.

What makes my workflow particular is Ship Studio — an editor that integrates Claude Code with a real-time preview. While Claude writes code, I see the changes immediately in a browser panel next to the terminal. No manually restarting a dev server, no context-switching between tools. You literally watch the page take shape as the AI writes.

This sounds like a minor detail, but it fundamentally changes the workflow. I give feedback based on what I see, not on what I think the code does. That cuts down on a lot of unnecessary back-and-forth.

Framework choice: Astro, Next.js or Vue?

This is the question that takes people the longest to answer. My answer: it depends on what you’re building. But let me be specific.

Astro — my default for marketing websites

For the vast majority of small and medium business websites, I choose Astro. Landing pages, portfolios, service businesses, local companies, SaaS marketing — Astro.

Why? Astro builds static HTML by default. No JavaScript unless you explicitly add it. The result: PageSpeed scores of 95–100, virtually zero maintenance after delivery, good SEO out of the box, and hosting on a CDN that’s extremely cheap (or free).

Astro also has an elegant content collections system for blogs, portfolio items and other repeating content. You write in Markdown or MDX, Astro generates the pages automatically. That’s exactly what most business websites need.

The downside of Astro: it’s less suited the moment you need user sessions, real-time data, or complex client-side interactions. For that, you need something else.

Next.js — when it becomes app-like

The moment a project feels like an application rather than a website, I reach for Next.js.

Think: a SaaS with login and dashboard, a platform where users create content, an e-commerce flow with dynamic pricing, or an internal tool. Anything where content varies per user or where you need server-side logic.

Next.js has excellent support for API routes, server components, authentication libraries and database integrations. The learning curve is steeper and the infrastructure more expensive, but for applications it’s the right call.

Claude Code works extremely well with Next.js. The conventions are well-documented and Claude knows the framework thoroughly.

Vue — the third option

Vue is my choice in two specific situations:

1. An existing Vue codebase. If a client has an existing project in Vue (or Nuxt, Vue’s framework), I work within that. Mixing frameworks is never a good idea.

2. You’re building an interactive SPA without the full weight of a Next.js project. Vue is lighter than React in setup and mental model, and Nuxt (the Vue equivalent of Next.js) is an excellent choice if you want SSR without the React ecosystem. For teams already comfortable with Vue, or for projects where Vue is the dominant community choice, this is logical.

For new projects I almost always go Astro or Next.js depending on the type of project. But Vue is not a bad choice — just less my default.

Hosting: Cloudflare vs Netlify

Both are excellent. Both have a free tier that’s more than enough for most static sites. Here’s the difference:

Netlify is easier to get started with. The interface is more intuitive, the documentation is good, and Netlify Forms (built-in form handling) is convenient if you don’t want to set up a separate form service. The downside: you hit free tier limits quickly when hosting multiple projects, and the edge infrastructure is less extensive than Cloudflare’s.

Cloudflare Pages has a larger free tier, a superior global CDN network (more edge locations than virtually any competitor), and free analytics built in. The setup is slightly more technical, but not complex. Cloudflare also has Workers for serverless functions and R2 for storage — useful if you want to expand later.

I chose Cloudflare. Page speed is measurably better due to the larger network, and the free tier is more generous. For professional projects, that’s the better long-term choice.

Forms: Web3Forms

Static sites have one problem: they can’t natively handle form submissions. You need a backend or an external service.

Two popular options:

• Netlify Forms — built-in if you host on Netlify, zero configuration, but only available on Netlify.
• Web3Forms — works with any host, free tier up to 250 submissions per month, one access key in your HTML. No backend, no server, just a fetch to their API.

I use Web3Forms. It’s the simplest thing that works. You add one hidden input with your access key, send the form data to https://api.web3forms.com/submit, and you get an email. Done.

For high volumes or advanced workflows (CRM integrations, auto-replies, conditionals), I’d look at Formspree or a custom Worker on Cloudflare. But for 95% of projects, Web3Forms is more than enough.

The full stack at a glance

Tool	Purpose	Cost
Claude Code	AI assistant for all code	€21/month (Pro)
Ship Studio	Editor with real-time preview	Included with Claude Code
Astro	Marketing websites, blogs	Free (open source)
Next.js	Web applications, SaaS	Free (open source)
Vue / Nuxt	Existing Vue projects or interactive SPAs	Free (open source)
Cloudflare Pages	Hosting	Free tier
Web3Forms	Form handling	Free tier (250/month)

Total cost to run a complete, professional website: €21 per month for the AI assistant. Everything else is free.

What changes in your workflow?

If you start with this stack today, expect a learning curve in the first few weeks. Claude Code isn’t magic — it works best when you understand how the frameworks work and when you write clear, specific instructions. “Make a contact page” is too vague. “Build a contact page in Astro with a Web3Forms form, two columns on desktop, validation on required fields and a success state after submit” is a good prompt.

After that curve, everything gets faster. Not just writing code, but also debugging, explaining what went wrong, and thinking through alternative approaches.

It also changes how I talk to clients about projects. I can demonstrate things faster, adjust to feedback faster and deliver faster. That has a direct effect on my position as a freelancer.

---

Want to know how I’d approach a specific type of project with this stack? Explore my Astro websites or AI website development, or get in touch — I’m happy to think it through with you.