Skip to content

travisvn/next-mdx-template

Repository files navigation

Next.js MDX Template

GitHub stars GitHub forks GitHub repo size GitHub language count GitHub top language GitHub last commit Hits

Simple, easy-to-modify template to use for creating a blog, portfolio, or content-based website

Features ⭐️

  • ✅ Next.js 14 App Directory
  • next-mdx-remote
  • ✅ RSS Feed
  • ✅ Sitemap generation
  • Tailwind CSS
  • Syntax highlighting in .mdx
  • Custom components embeddable in .mdx files
  • Utility functions to customize further

View live demo

Config ⚙️

  • config/site.ts - Site title, description, and URL
  • .env to set BASE_URL if you'd like to override the base URL you set in config/site.ts

Structure 📂

The majority of the structure should be self evident, based on Next.js docs

  • content/ - Location for posts (.mdx files)
  • utils/mdx-utils.ts - Main functions for handling .mdx and converting frontmatter
  • lib/helpers.ts - extra (i.e. not required) Options for handling .mdx

Notes ℹ️

  • gray-matter and date-fns are included but not required
    • If you'd like to remove them, remove the lib/helpers.ts file and its connections
  • Based off of leerob.io repo