Build a Free Website with GitHub and AI — and Own It Forever
How to build and maintain a modern website using GitHub, Cloudflare Pages, and AI coding tools — with no hosting fees, no lock-in, and no manual code required.
Fabian Mösli Here is a thing that used to be true: your website lived inside your hosting provider. Webflow, Framer, WordPress.com — your content, your design, your domain settings, your files — all stored on their servers, locked in their system. Switching meant migrating everything, and some things would always break. I know this firsthand: I built a site on Webflow, bought a template, put real work into it — and when I wanted to move, the only realistic option was to rebuild from scratch. You can technically export the code, but what you get back is barely yours. Before that, I was uploading site files manually via FTP. Neither option gave me something I actually owned.
Here is a thing that is now true: your website can live in a GitHub repository. Hosting is just the part that shows it to the world, and it’s interchangeable. If you’re unhappy with your hosting provider tomorrow, you point a different one at the same repository and you’re done. Nothing migrates. Nothing breaks.
This guide walks you through that model. By the end, you’ll understand how to build a modern-looking website using AI tools to write the code for you, GitHub to store it, and Cloudflare Pages to publish it — for free.
Why GitHub? What is a repository, anyway?
If you’ve never used GitHub before, the word “repository” probably sounds technical. It isn’t, really. A GitHub repository is a folder for your project that lives on the internet and tracks every change ever made to it.
Think of it as Google Docs for code — except instead of one document, it’s a whole project folder. Every file is there: the code that builds your site, the content you write, the images, the configuration. And every change is recorded, with a timestamp and a description. If something breaks, you can see exactly what changed and when.
The other thing GitHub does is act as the trigger for your website. Connect GitHub to a hosting provider like Cloudflare Pages, and every time you update your main branch, your site automatically rebuilds and publishes. Write new content, push it to GitHub, your site is updated within a minute. No FTP, no admin panel, no manual “publish” button.
Your website doesn’t live on Cloudflare’s servers in a meaningful sense. It lives in your GitHub repository. Cloudflare just reads it and shows it to the world.
What is a static site — and why does it matter?
Most traditional hosted website platforms — WordPress, Webflow, many CMSs — are dynamic. When a visitor loads a page, the server runs code, queries a database, assembles the HTML, and sends it back. That’s powerful, but it means you need a server running 24/7, a database, software updates, security patches.
A static site is different. The site is built once — HTML, CSS, and some JavaScript — and then served as plain files. No server running code on every visit. No database. Nothing that needs updating or patching. The files just sit there, and Cloudflare delivers them to visitors from servers close to wherever they are in the world.
The result: faster load times, nothing to hack, nothing to maintain, and hosting that can be completely free because serving static files at scale is nearly zero cost for Cloudflare.
Modern static sites don’t look or feel “static” to visitors. This site — goodaiguide.com — is built as a static site. It has search, filtering, dynamic-looking pages, responsive design. What it doesn’t have is a database, a monthly server bill, or a CMS I have to log into.
The AI part: you don’t write the code yourself
Here is the part that changes the calculus for non-developers.
A few years ago, building a static site still required knowing enough HTML, CSS, and a bit of JavaScript to get things working. Or paying someone who did. AI has effectively removed that requirement.
You describe what you want. The AI writes the code. You review it, ask for changes in plain language, and the AI adjusts. The technical knowledge is still there — it’s just in the AI, not in you.
Three tools are particularly good for this, and they all work with GitHub:
Claude Code is the most capable. It runs in your terminal (the command-line interface on your computer), connects to your project folder, reads all your files, and makes changes autonomously. You describe what you want in natural language — “add a newsletter signup section to the homepage” or “create a page for my portfolio” — and Claude Code writes, tests, and commits the changes. It understands your whole project as context, which means changes are consistent and nothing breaks. The trade-off: you need to be comfortable with a terminal, which takes a few minutes to set up but quickly becomes second nature.
Google Antigravity is a browser-based development environment powered by Google’s Gemini models. No installation needed — open a browser, start a project, and Antigravity’s agents plan and build for you. It’s excellent for getting a site from zero to a working first version quickly. Good for visual thinkers and for projects where you want to see something working before you refine it.
Google Jules takes an async approach. You connect it to your GitHub repository and assign tasks — “check this page for accessibility issues” or “add a blog post with this content.” Jules works in the background and presents you with a result to review. No terminal, no IDE — just a task description and a result. It works from your phone as well as your laptop. Good for maintenance and light edits once the site is built.
I use all three on this site, depending on what I need. Complex structural changes go through Claude Code. Quick visual experiments go through Antigravity. Content updates on the go go through Jules. They don’t conflict with each other — and that’s thanks to GitHub’s branching system.
Branches: why multiple AI tools don’t get in each other’s way
This is worth understanding even if you never plan to use more than one tool.
GitHub has a concept called branches. Think of them as parallel versions of your project. The main branch is your live, published website. Any other branch is a working copy where you make changes without affecting the live site.
When an AI tool — or you — makes changes, those changes happen on a separate branch. When you’re happy with them, they get merged into the main branch, which triggers a new deployment. If the changes are bad or incomplete, you discard the branch. The main branch is never touched until you’re ready.
This is how professional software teams have worked for years. And it’s the reason I can use Claude Code one day, Antigravity the next, and Jules on my phone — all on the same project — without any of them stepping on each other. Each tool works on its own branch. The main branch stays clean.
Getting hosted: connecting GitHub to the world
Once your site exists in a GitHub repository, you need to connect it to a hosting provider. This is the step that actually publishes it.
Several providers offer this for free:
| Provider | Free tier | Custom domain | Build minutes |
|---|---|---|---|
| Cloudflare Pages | Unlimited sites, unlimited bandwidth | Yes, free SSL | 500/month |
| Vercel | Unlimited personal projects | Yes, free SSL | 6,000/month |
| Netlify | 1 site per project | Yes, free SSL | 300/month |
| GitHub Pages | 1 site per account | Yes (with config) | Via GitHub Actions |
All four watch your GitHub repository and redeploy when the main branch changes. They all include HTTPS (the padlock in the browser) automatically. For a personal site or small project, any of them works.
I use Cloudflare Pages because Cloudflare also handles my domain’s DNS, which makes custom domain setup simpler. Here’s how to do it.
Setting up Cloudflare Pages: step by step
Before you start: you need a GitHub account (free at github.com) and a Cloudflare account (free at cloudflare.com). Your site’s code should already be in a GitHub repository. If you’re starting from zero, ask an AI tool to create the project and push it to GitHub — that’s a reasonable first task to hand off.
Step 1 — Connect GitHub to Cloudflare
Log into Cloudflare. In the left sidebar, go to “Workers & Pages” → “Pages.” Click “Create a project” → “Connect to Git.” Authorize Cloudflare to access your GitHub account when prompted, then select the repository you want to deploy.
Step 2 — Configure your build
Cloudflare needs to know how to build your site. The settings depend on which framework your AI tool used. Common options:
- Astro: build command
npm run build, output directorydist - Next.js: Cloudflare usually detects this automatically
- Plain HTML: no build command needed, output directory is your root folder or
public
If you’re not sure, ask your AI tool: “What are the Cloudflare Pages build settings for this project?” It will tell you exactly what to enter.
Click “Save and Deploy.” Cloudflare will run your first build. This takes a minute or two. When it’s done, you’ll have a working URL at [something].pages.dev.
Step 3 — Add a custom domain
If you have your own domain (e.g. yourbrand.com), you can connect it in the Pages project settings under “Custom domains.” Cloudflare will walk you through the DNS setup — usually adding a CNAME record that points your domain to the Pages URL.
If your domain is registered elsewhere, you’ll need to update the nameservers to point to Cloudflare, or add CNAME records at your registrar. I use Gandi — clean interface, straightforward pricing, no dark patterns — and the setup took about five minutes. If this step is confusing regardless of registrar, paste the Cloudflare instructions into your AI tool and ask it to explain what to do specifically for yours.
Step 4 — That’s it
Every time you push changes to your main branch on GitHub, Cloudflare automatically rebuilds and redeploys your site. No manual steps. The whole process takes about a minute from commit to live.
Updating from anywhere
Once the pipeline is set up, keeping your site current is surprisingly lightweight.
From your laptop: Claude Code is the tool of choice for anything beyond simple content updates. You can ask it to add features, redesign sections, update styling, or create entirely new page types. It understands your whole project and keeps changes consistent.
From any browser: Antigravity or Jules via the browser. Jules in particular is good for focused tasks: “Add a blog post about [topic],” “fix the broken link on the about page,” “update the pricing on the tools page.” You describe the task, Jules does it, you review and approve.
From your phone: Jules handles this well. Its async model — file a task, come back to a result — suits the phone workflow perfectly. I use it for content additions and light edits when I’m away from my desk. It works fine on a mobile browser.
And if you want to go further: I’ve built a WhatsApp-based assistant called Clawdia that lets me send a voice message describing a change, get a preview link back, and push it live with a single reply. That’s a separate guide, but it shows where the ceiling actually is with this setup — or rather, that there isn’t much of one.
Content specifically: If your site uses Markdown files for content (as most modern static site frameworks do), updating content is as simple as editing a text file. AI tools can draft new content, update existing pages, and handle the frontmatter metadata automatically. You write like you’d write in any notes app; the AI handles the format.
But here’s the thing that makes AI-assisted content actually work: you need to have written down your voice. What you sound like, what you believe, how you explain things, what you’d never say. I have a document that does this for goodaiguide.com — it covers my values, the audience I’m writing for, specific phrases I avoid, examples of the tone I want. Before AI writes anything for this site, it reads that document. The result is content that actually sounds like me rather than a generic newsletter. If you’re building a site where the writing matters, that brief is worth spending an hour on before you start generating content at scale.
When you hit a wall: ask the AI
You will hit walls. Something won’t work, an error message will look incomprehensible, a step in a tutorial won’t match what you see on screen. This is normal — it happens to people who have been doing this for years.
The difference now is that you have an AI available to explain it.
“I got this error message when I tried to deploy — what does it mean and how do I fix it?” Paste the error. The AI will tell you.
“Cloudflare says my build failed. Here’s the log — what went wrong?” Paste the log. The AI will find the problem.
“My custom domain is set up but the SSL certificate shows an error. Here’s what Cloudflare shows — what do I need to do?” The AI will walk you through it.
This isn’t a shortcut around understanding. It’s how you build understanding — by working through real problems in context rather than reading abstract tutorials. I built most of this site by describing what I wanted and iterating based on what came back. The gaps in my own knowledge got filled along the way, problem by problem.
One more thing worth doing once your site is built: ask your AI tool to do a security review. “Review this site for common security issues — exposed API keys, misconfigured headers, unsafe dependencies.” Static sites have a much smaller attack surface than dynamic ones, but it’s still worth a pass. It takes five minutes and occasionally catches something you’d never have thought to look for.
What you actually end up with
Let me make this concrete. Here is what this setup gives you:
Zero ongoing hosting cost. Cloudflare Pages is free for static sites at any reasonable traffic level. GitHub is free. The AI tools are subscription-based, but you’d be paying for those anyway. In practice, the only thing I pay for goodaiguide.com is the domain — around $30 a year.
No lock-in. Your website — every page, every post, every image — lives in a GitHub repository that you own. If Cloudflare changes its pricing or you find a better option, you connect a different provider to the same repository. Nothing moves.
Version history. Every change is recorded in GitHub. If something breaks, you can see exactly what changed and roll back to any previous state.
Update from anywhere. The combination of Claude Code (laptop, full power), Antigravity (browser, visual), and Jules (browser, async, mobile) means there’s always a tool that fits your current context.
A site that actually loads fast. Static sites served through Cloudflare’s global network load quickly everywhere in the world. No shared hosting, no overloaded database, no plugin that decides to phone home on every page load.
The alternative: why not Webflow, Framer, or WordPress?
These are all legitimate tools with real strengths. But they make trade-offs that this setup avoids.
Webflow and Framer are design-forward and produce beautiful results. But you’re working inside their system. The visual design is locked to their platform. Exporting code is technically possible but the output is barely portable — it’s built around their rendering pipeline, not yours. When I left Webflow, I didn’t migrate. I rebuilt. That’s not a migration story, that’s a hostage situation with a polite exit.
WordPress is enormously flexible, but it requires hosting (usually paid), a database, software updates, plugin management, and ongoing security maintenance. Plugins conflict with each other. Themes need updating. There are entire agencies whose business model is managing WordPress sites. That overhead is real, and it compounds over time.
The GitHub + static site + AI tools model gives you the flexibility of a custom-built site with the ongoing maintenance burden of almost nothing.
This site — goodaiguide.com — is built and maintained exactly this way. All the guides, all the tool reviews, all the design work: Claude Code, Antigravity, and Jules working from the same GitHub repository, with Cloudflare Pages publishing changes automatically. If you want to see it in practice before you build your own, the whole thing is the example.
If you’re building with Claude Code specifically, see the guide to getting started with Claude Code. And if you want to understand how AI tools fit into a broader toolkit, the guide on using Jules covers the async workflow.
Published: 2026-03-22
Last updated: 2026-03-22