DemoBuy

Getting Started with Blog CMS Kit

Last updated on 2026-03-22

The Blog CMS Kit is a production-ready Next.js template for building a developer blog with a full-featured CMS admin panel. It includes 25 screens covering a public blog, admin dashboard, authentication, and utility pages — all built with Tailwind CSS v4 and shadcn/ui.

What's Included

  • 30+ UI components — primitives, blog composites, admin composites, and layout components
  • 25 pages — public blog, admin CMS, auth, and utility pages
  • 3 route groups — (blog), (admin), (auth) with dedicated layouts
  • Light & dark mode — oklch design tokens with amber/orange theme (hue 55)

Prerequisites

  • Node.js 18.17 or later
  • pnpm (recommended) or npm
  • A code editor — VS Code recommended

Quick Start

# 1. Clone the repository (use the URL from your purchase email)
git clone <your-repo-url> blog-cms-kit
cd blog-cms-kit

# 2. Install dependencies
pnpm install

# 3. Start the dev server
pnpm dev

Open http://localhost:3000 to browse the blog homepage.

Kit Overview

Area Screens Key Features
Public Blog 8 Featured hero, articles, categories, tags, authors, search, newsletter
Admin CMS 13 Dashboard, post editor, media library, analytics, comments, settings
Auth 2 Login, forgot password
Utility 2 RSS feed, sitemap preview

Tech Stack

Technology Purpose
Next.js 16 React framework with App Router
React 19 UI library
Tailwind CSS v4 Utility-first styling with oklch tokens
shadcn/ui Component primitives
Lucide React Icon library
Recharts Analytics dashboard charts
date-fns Date formatting and utilities
next-themes Dark mode support
sonner Toast notifications

Next Steps

Next

Installation