A modern, minimalist personal blog built with Next.js 16 and UnoCSS.

• ✨ Clean, minimalist design
• 📝 MDX support with syntax highlighting (Shiki)
• 🎨 Atomic CSS with UnoCSS
• 🚀 Next.js 16 App Router
• 📱 Fully responsive
• 💬 Real-time online presence (Liveblocks)
• 🖼️ Photo album with lightbox
• � RSS feed (Atom)
• 🗺️ Auto-generated sitemap

• Framework: Next.js 16
• Styling: UnoCSS
• Content: MDX with next-mdx-remote + gray-matter
• Syntax Highlighting: Shiki
• Icons: Lucide via @unocss/preset-icons
• Real-time: Liveblocks
• Language: TypeScript

• Node.js 18+
• pnpm 9+

pnpm install

Copy .env.example to .env.local and configure:

NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY=your_liveblocks_public_key

pnpm dev

Open http://localhost:3000 to view the blog.

pnpm build
pnpm start

cube-blog/
├── src/
│   ├── app/              # Next.js App Router
│   │   ├── layout.tsx    # Root layout
│   │   ├── page.tsx      # Home page
│   │   ├── posts/        # Blog posts
│   │   ├── stack/        # Tech stack page
│   │   ├── album/        # Photo album
│   │   ├── atom.xml/     # RSS feed
│   │   └── sitemap.ts    # Sitemap generator
│   ├── components/       # React components
│   ├── data/             # Static data
│   ├── lib/              # Utilities
│   └── types/            # TypeScript types
├── content/
│   └── posts/            # Markdown/MDX posts
├── blog.config.ts        # Site configuration
├── uno.config.ts         # UnoCSS configuration
└── next.config.js        # Next.js configuration

Edit blog.config.ts to customize site info:

export const siteConfig = {
  name: "Your Blog Name",
  title: "Your Blog Title",
  description: "Your blog description",
  url: "https://your-domain.com",
  author: {
    name: "Your Name",
    email: "you@example.com",
  },
  // ...
}

Create a new .mdx file in content/posts/:

---
title: "Your Post Title"
date: "2024-11-30"
excerpt: "A brief description"
tags: ["tag1", "tag2"]
---

Your content here with **MDX** support...

1. Push to GitHub
2. Import on Vercel
3. Add environment variables
4. Deploy

Compatible with Netlify, Cloudflare Pages, AWS Amplify, or self-hosted.

MIT

Thank you design by suss.me.