I just migrated my personal website from a headless WordPress + Next.js setup into a Turborepo monorepo powered by MDX. Here's why and how.

The Old Stack

My previous site was a full headless WordPress setup:

• WordPress as the CMS (hosted on WP Engine)
• WPGraphQL + Faust.js for data fetching
• Apollo Client for GraphQL state management
• Next.js 15 for the frontend
• NextAuth for preview authentication
• Gravity Forms for contact forms
• ACF Flexible Content for page blocks

It worked great. But it was complex — 67+ dependencies, a separate WordPress instance to maintain, GraphQL queries for every piece of content, and preview auth that nobody used.

Why Migrate?

Three reasons:

1. Simplify — I don't need a CMS for 3 blog posts and 8 project descriptions. MDX files in the repo are simpler, faster, and version-controlled.

2. Consolidate — I wanted everything in one monorepo. One repo, one deployment, shared components.

3. Future-proof — The monorepo structure makes it easy to add new apps, experiments, and tools alongside the website.

The New Stack

• Next.js 16 with React 19
• MDX for all content (blog posts, projects, experiences)
• gray-matter for frontmatter parsing
• rehype-pretty-code + Shiki for syntax highlighting
• Shared UI package for components
• Tailwind CSS v4 for styling
• Turborepo for builds

Total dependencies dropped from 67 to ~20. No WordPress, no GraphQL, no Apollo, no auth.

What I Kept

The visual design is identical. Same fonts (Geist Sans/Mono), same colors (neutral zinc theme), same dark mode. Every block component was migrated and simplified — removing WordPress data shapes and using plain TypeScript props.

The interactive features all made the cut:

• Morphing text animation
• Marquee logo scroll
• Popup cards with video on hover
• Command palette (⌘K)
• Theme toggle with sound effects
• Synthwave code blocks

What's Next

I'm still working on this — the monorepo isn't public yet. Once it's ready, I'll share the source and write more about the architecture. Stay tuned.