Why MDX is the Right Choice for Technical Blogs
MDX lets you embed React components inside Markdown — making it perfect for technical writers who want interactivity without sacrificing the simplicity of plain text authoring.
By Majilesh
When I set out to build this blog, I had a simple requirement: write in plain text, publish fast, but keep the door open for richer experiences when the post calls for it. MDX ticked every box.
What is MDX?
MDX is Markdown with superpowers. It lets you use JSX — React components — directly inside your .mdx files. So you can write a paragraph, then drop in an interactive chart, then keep writing. The file stays readable in any text editor, but the rendered output can be as rich as you need.
The authoring experience
The authoring workflow is simple:
- Create a new file in
content/posts/ - Add frontmatter (title, date, category, excerpt)
- Write in Markdown
- Deploy — the post is live
No CMS login. No database. No editor latency. Just a file on disk that becomes a page.
SEO and performance
Because posts are statically generated at build time, every page is fast and fully crawlable. There's no client-side rendering delay — Google sees the full HTML on the first request.
The trade-offs
MDX is not perfect. Editing complex components inside a Markdown file can get awkward. For collaborative publishing where non-developers are involved, a headless CMS like Contentlayer or Sanity might be a better fit.
But for a solo author who's comfortable with code, MDX-on-Next.js is hard to beat.
The setup you're reading right now uses exactly this stack. Every post lives in content/posts/ as an .mdx file, frontmatter tells the site about the post, and Next.js generates a static page at build time.