Rebuild WordPress to Next.js with AI | by Peter van Barneveld

AI coding tools have changed what's possible in a weekend. I rebuilt my personal website, moving from WordPress to a fast static Next.js site deployed on Cloudflare Pages, in just 6 hours. An AI agent handled most of the coding. The result is a noticeably faster, more modern site that's easier to maintain.

This isn't about becoming a developer. It's about modern tools collapsing the gap between wanting a better website and actually creating one. If you're running a small personal site on WordPress, this approach might surprise you with what's achievable in a single weekend.

Why Move from WordPress to Static Next.js?

WordPress worked, but it felt outdated. For a small personal site, editing and maintaining it took more time than it should. Parts of the site were slow, partly due to hosting limitations.

A static Next.js site solves these problems. Static means the pages are pre-built files. No database queries, no server processing. The result is lightning-fast loading and dead-simple hosting. Next.js gives you modern development tools while still exporting to static files. And with an AI coding assistant, you don't need to be a React expert to build one.

What Tools Do You Actually Need?

Here's what made this project possible in 6 hours:

AI coding agent (I used Google Antigravity): Does the actual coding, handles Git commands, builds the site structure
Development environment: I ran Antigravity in WSL (Windows Subsystem for Linux) through VS Code. Some familiarity with Linux, Bash, or VS Code helps since you'll work across the editor, terminal, and browser
ChatGPT or similar AI assistant: For "how does this work?" questions, especially around deployment and DNS
Cloudflare Pages (free tier): Hosting that auto-deploys when you push code changes
GitHub: Stores your code and triggers automatic builds
Domain name: If you already have one (like I did from WordPress), you'll just point it to Cloudflare's DNS

Antigravity is currently in preview with generous free credits. I rebuilt my site and completed another project with just one week's allocation. If the free tier becomes more limited, Visual Studio Code with the Claude extension (which can use a Pro subscription) is a good alternative for projects that aren't too large.

Antigravity has a familiar VS Code-like interface (it's built on VS Code) plus an Agent Manager that acts as mission control for your AI agents. This combination makes it feel both familiar and surprisingly capable.

Before starting the actual coding, I discussed the approach with my AI assistant. We discussed the design for a simple approach with a modern design, components that work well together and are perfectly suited for Cloudflare Pages. This outcome of the conversation shaped the design specifications for the entire build.

The technical stack underneath: Next.js, TypeScript, Tailwind CSS. Content lives directly in configuration files. Simple and straightforward for a small site. You edit text in TypeScript objects rather than dealing with a separate content management system. But here's the thing: you don't need to know these technologies deeply. The AI handles the implementation. You focus on what you want.

What's the Actual Process?

The rebuild happened in two main stages.

Stage 1: Building the site (4 hours)

I started by sharing the link to my WordPress site with the AI coding agent. It analyzed the layout and generated a Next.js version inspired by that structure. Then came the fun part: tuning the layout, adjusting the design, and rewriting content.

One challenge: I couldn't test the mobile version locally. After the first deployment, some layout choices didn't work well on mobile. My image display and spacing were off. But I could fix these with simple AI instructions and a quick git push. The whole fix-deploy cycle took minutes, not hours.

The first build worked surprisingly well. Not "proof of concept" quality. Actually good. That set the tone for the rest of the project.

Stage 2: Publishing and migration (2 hours)

This part had the steeper learning curve. Publishing to Git, connecting Cloudflare Pages, updating DNS. Some parts I knew, others were no longer readily available knowledge, and some were completely new.

Fortunately, Antigravity handled the Git workflow completely. I had forgotten the exact commands, but I could just instruct it: "push these changes to GIT" and the steps were executed.

For Cloudflare Pages configuration and DNS migration, I needed some help from my ChatGPT assistant. My current domain for my WordPress setup only needed to be moved to Cloudflare's DNS. The good news: Cloudflare automatically copied my entire DNS configuration when I transferred. I just pointed my domain to Cloudflare's nameservers, and everything came over. My AI assistant walked me through the trickier steps and answered my "how does this actually work?" questions.

Having that second AI assistant for infrastructure questions while the coding agent focused on building was surprisingly effective.

What Challenges Should You Expect?

The learning curve isn't just code, it's the development environment and deployment

The Next.js building went smoothly because the AI handled it. The challenging parts were getting comfortable with the development setup (WSL, VS Code, terminal workflows) and deployment concepts (connecting repositories, configuring build settings, DNS propagation). If these environments are new to you, budget extra time for this learning curve. An AI assistant helps, but you still need to understand what you're configuring.

Review before running anything important

AI suggestions are often solid, but I always reviewed commands before executing them, especially anything touching Code, Cloudflare, Git. This isn't about lack of trust; it's about staying in control of your project. The same applies to the generated code itself. AI can introduce security vulnerabilities like missing input validation or insecure dependencies, so reviewing what gets deployed matters. After this project, I'm going to explore further how to better secure my website.

Cloudflare Pages has build limits on the free tier

The free plan limits the number of builds per month. This is perfect for a small personal site that doesn't change often. It's therefore advisable to test locally first, then push a batch of changes at once rather than pushing every tiny edit.

When Should You Use This Approach?

This method works well if:

Your WordPress site is basically a personal website with a few sections
You want a faster, more modern site
You're willing to try a weekend project with AI assistance
You don't need WordPress features like user login or complex plugins

Keep in mind:

You'll need time to learn the development environment and deployment workflow
Content updates require Git commits rather than a visual editor
This approach works best for sites you control yourself

What's the Real Result?

The site feels noticeably faster and updates are easy to implement. Edit the text directly in the repository, or ask AI to modify the text, where a simple new git push ensures the site is updated. I could also easily move my vCard download, which I use with an NFC business card, and SEO is cleaner without relying on plugins.

Most importantly: 6 hours to go from "my WordPress site feels dated" to "I have a modern, fast static site on professional infrastructure" is genuinely impressive. That time includes partly learning new tools and concepts.

The game has changed. AI coding agents make projects like this accessible that were previously seen as impossible by many. You still need to think through what you want and review the results. But the gap between "I have an idea" and "I have a working site" has collapsed enormously.

What I'm Considering Exploring Next

This first version was more than sufficient for my intended new site, but there's more I might explore as my site evolves:

Code security scanning: AI-generated code can contain vulnerabilities like missing input validation or insecure dependencies. GitHub's Dependabot automatically checks for vulnerable dependencies and can create pull requests to update them. It's built in and easy to enable for any repository.

MDX for interactive content: Right now, content lives in configuration files. Simple and direct. But if I start writing articles regularly, I might explore MDX. It's Markdown (simple text formatting) with the ability to embed React components. Want to add a calculator, live code demo, or interactive chart to an article? MDX makes that possible while keeping most of your writing simple.

Lightweight analytics: Understanding who visits the site without the bloat of traditional analytics. Services that preferably give insights while respecting privacy.

I haven't implemented these yet, but they're on my radar to explore further, even as needs change. The foundation is flexible enough to grow.

About the Author

Peter van Barneveld is a Group Innovation Manager exploring practical paths to digital autonomy. He tests what actually works in real daily use. His approach: figure it out, document the journey, share honest results.

Connect with Peter on LinkedIn or join the discussion on r/Dimaginar.

Frequently Asked Questions

Can I do this without coding experience? You need some understanding of technical concepts, but not coding expertise. The AI writes the code. You guide the decisions and review the results. If you can follow instructions for Git commands and DNS settings, you can handle this. An AI assistant can explain concepts as you go.

Can I migrate my existing WordPress content? Yes. The AI migrated all the content from my WordPress site in the first generated version. It pulled the text, structure, and layout automatically. The editing time I spent afterward was mostly refining the site's theme and rewriting some text to match the new direction, not fixing migration issues.

How much does this actually cost? The setup I used costs nothing if you stay within free tiers:

Antigravity: Free credits during preview phase (very generous). Alternative: VS Code with Claude extension (works with Claude Pro subscription)
Cloudflare Pages: Free tier handles small personal sites easily
GitHub: Free for private and public repositories

You might pay for a domain name if you don't already have one (~€15-20/year). That's it.

What if something breaks after deployment? Static sites are surprisingly resilient. There's no database to corrupt or plugins to conflict. If something does break, you have two safety nets. First, Git keeps your entire history, so you can roll back to any previous version. Second, besides local testing, Cloudflare Pages lets you preview changes before making them live. Test first, then deploy with confidence.

How do I update content for my site? Edit the text files in your repository (using any text editor) and push the changes. Cloudflare automatically rebuilds and deploys the site. Or use an AI assistant to help you make the edits. The workflow becomes natural quickly.

Is this faster than keeping WordPress? For a small personal site, absolutely. WordPress requires updates, plugin management, and database maintenance. A static site just sits there working. You only touch it when you want to change content or need to implement important security updates.