← back

Building This Blog with NextJS and Claude Code

March 30, 2026

This blog was built almost entirely by talking to an AI. Not through a drag-and-drop website builder, but through Claude Code — Anthropic's CLI tool that operates directly on your codebase. I want to write about what that experience was actually like, because it was different from what I expected.

Starting Point

I started with the Vercel portfolio blog starter — a Next.js template with MDX support, Tailwind, and some basic SEO wiring. A solid base, but it needed work before it felt like mine.

Rather than reading through the code and making changes manually, I opened Claude Code and started describing what I wanted.

The First Problem

The first thing that happened was an error:

Error: Functions cannot be passed directly to Client Components unless you
explicitly expose it by marking it with "use server".

The root cause was a version mismatch: the template shipped with next-mdx-remote@4, which was not compatible with React 19. Claude Code diagnosed this immediately, upgraded all dependencies to their latest versions, and in the same pass fixed a Next.js 15 breaking change where route params became a Promise.

That would have taken me a while to debug on my own. It took Claude Code about thirty seconds.

Iterating on the Design

From there I worked through changes conversationally:

  • Remove the navbar, but keep a way to get back to the blog list from a post
  • Remove dead code left over from the template (ArrowIcon, nav.tsx, an unused cx helper)
  • Add a tagline under the blog heading
  • Make the footer link back to my main site
  • Set the correct base URL for SEO metadata and sitemaps

Each of these was a single sentence of instruction. Claude Code read the relevant files, made the change, and explained what it did and why. I never had to say "look at file X" — it figured out where things lived.

The Workflow

The thing that surprised me most was how little I had to context-switch. In a normal development session I am constantly jumping between browser, editor, terminal, and documentation. With Claude Code running in the terminal alongside my editor, the loop was:

  1. Notice something that needs changing
  2. Describe it in plain language
  3. Review the diff in the editor
  4. Accept or ask for adjustments

There were a couple of small misses — a CSS change that fixed the wrong problem, a date column width that needed a second pass — but correcting course was as easy as saying "no, the problem is actually X." It did not argue or over-explain. It just fixed it.

What It Is Good At

Based on building this blog, Claude Code excels at:

Debugging unfamiliar errors. It reads the stack trace, traces it back to the root cause, and fixes it — often in the same step. It does not just address the symptom.

Knowing the ecosystem. When upgrading dependencies, it knew what changed between Next.js 14 and 15, what the next-mdx-remote v4→v6 migration involved, and which files used the affected APIs. I did not have to point it anywhere.

Respecting the existing code. It did not rewrite things for style or add abstractions nobody asked for. Changes were surgical.

Keeping things simple. When I asked it to clean up the codebase, it removed unused code rather than refactoring everything. It matched the scope of the task to what was actually requested.

What Still Requires Your Judgement

Claude Code is not a replacement for understanding your own project. A few things that needed human input:

  • Knowing what you want. It can execute precisely, but you have to articulate the goal. Vague instructions produce vague results.
  • Reviewing the diff. Most changes were clean, but reading what changed before accepting it is still important. It caught its own mistakes when I pointed them out, but it did not always catch them unprompted.
  • Domain decisions. Choosing a base URL, deciding on the site structure, picking what to write about — none of that comes from the AI.

The Stack

For anyone curious, this blog runs on:

  • Next.js 16 with the App Router
  • next-mdx-remote for rendering MDX posts
  • Tailwind CSS v4 for styling
  • Geist font from Vercel
  • Vercel Analytics and Speed Insights
  • Hosted on Vercel at blog.tobymeyers.com

Posts are plain .mdx files in app/blog/posts/. Writing a new one is just creating a file with a frontmatter block and markdown content.

Closing Thought

The honest summary: Claude Code handled roughly 90% of the keystrokes involved in setting up this blog. What it could not do was decide what the blog should be, what it should look like at a high level, or what to write. Those are still my job.

What it changed is the cost of acting on an idea. The gap between "I want a blog" and "I have a blog" used to involve several evenings of setup, debugging, and configuration. Now it is an afternoon, most of which I spent writing content rather than fighting with tooling.

And yes, this 'lorem ipsum' initial blog post was naturally written by Claude.