About This Blog Starter

This is a premium, production-ready headless blog starter kit built with modern technologies, focused on performance, SEO, and flexibility.

🖼️ Front-end

  • Next.js (App Router): File-based routing, server components, and layout system.
  • TypeScript: Static typing for developer safety and IntelliSense support.
  • Tailwind CSS: Utility-first styling with a custom theme using CSS variables for dark/light mode.
  • Framer Motion: Smooth animations for UI transitions.
  • Lucide Icons: Clean and modern icon system.
  • Dark Mode: Custom toggle using CSS variables and a .light class on the <html> element.
  • Responsive Design: Mobile-first layouts by default.

🧠 Content Management

  • Contentlayer v2: Type-safe MDX compiler with custom schema, hot reload, and live data generation.
  • MDX v2: Markdown + JSX support with custom components.
  • Prism Highlighting: For beautiful syntax-highlighted code blocks.
  • Filesystem Source: Posts are stored in content/posts/ and compiled automatically.
  • Static Generation: All posts are pre-rendered at build time for maximum performance.

🧰 Tools & Enhancements

  • Vitest + React Testing Library: For unit and component testing.
  • SEO Meta: Open Graph + Twitter card metadata viagenerateMetadata functions.
  • Vercel Deployment: Works out of the box with Vercel.
  • AI Post Generator: CLI script uses OpenAI and Pexels API to generate complete MDX posts with metadata and cover images.