← Back to all posts

2026-05-28

Building a Blog with Next.js and Markdown

nextjstutorialmarkdown

The Stack

This blog runs on:

  • Next.js 16 — App Router, React Server Components
  • Tailwind CSS v4 — utility-first styling
  • Markdowngray-matter for frontmatter, unified + remark for rendering
  • RSS — auto-generated feed via the feed package
  • Deployed on Netlify — with a custom domain

How it works

Content pipeline

Every post is a .md file in content/posts/. At build time, Next.js reads all files, parses the frontmatter, and converts the Markdown body to HTML.

Static generation

Both the index page and individual post pages are statically generated. This means:

  1. Instant page loads (no server round-trip for content)
  2. Great SEO (fully rendered HTML)
  3. No database to manage

RSS & Sitemap

The RSS feed and sitemap are also generated at build time, making it easy for readers to subscribe and for search engines to index all posts.

Next steps

Future additions might include:

  • Tag pages for filtering by topic
  • A lightweight admin UI for writing in-browser
  • Newsletter integration
# To add a new post, just create a .md file:
echo "---\ntitle: New Post\ndate: 2026-06-01\n---\nContent here" > content/posts/new-post.md