Chakra + Next13 + MDX blog

This a simple starter template for Chakra + Next13 + MDX blog. Live demo is available here.

Blog screenshot

Features

  • Posts as .mdx directly in the repo with working fast refresh
  • SEO optimized with SSR, Meta and OG tags
  • 100s on Lighthouse Page insights
  • Integrated with Chakra UI and Next13 App router
  • Responsive design based on Chakra template

Getting Started

npm i
npm run dev

Open http://localhost:3000 with your browser to see the result.

Adding posts

All posts are stored in /app/posts directory. You can just create new mdx files there. The code assumes the format of the header stays the same.

Documentation

You can start by reading a tutorial at https://www.uprightly.app/blog/fast-blog and then following the commit history to understand how we got into this state.

Production use

Currently used on www.uprightly.app.