Intermediate~6 hours
Markdown Blog with Dynamic Routes
Build a blog that reads Markdown files and generates a page per post using dynamic routes and static generation.
Dynamic RoutesSSGMarkdown
1
Set up the content folder
Create a `content/` directory with a few `.md` files. Each file is one blog post with frontmatter.
2
List posts on the index page
Read the content directory on the server and render a list of links to each post.
3
Render a post with [slug]
Create `app/blog/[slug]/page.tsx`, await the params, and render the matching Markdown file as HTML.
4
Pre-render with generateStaticParams
Export `generateStaticParams` so every post is built ahead of time for instant loads and great SEO.
Finished building?
Ship it and share it in a community challenge — or move on to the next project.