create-next-log

A CLI scaffolder for personal developer blogs, powered by Next.js 15 and MDX. Fully responsive — works on desktop, tablet, and mobile.

Quick Start

Option 1: One-click deploy

Deploy directly to Vercel and get a blog running in seconds:

Then customize next-log.config.ts in your new repo.

Option 2: CLI (recommended)

Create a fully customized blog with interactive prompts:

npx create-next-log        # npm
yarn dlx create-next-log   # yarn
pnpm dlx create-next-log   # pnpm

cd my-blog
npm run dev   # or: yarn dev / pnpm dev

Open http://localhost:3000 — your blog is ready.

Project Structure

my-blog/
├── posts/                      # Your content lives here
│   └── hello-world/
│       └── index.mdx
├── public/
│   └── posts/                  # Post images
│       └── hello-world/
├── app/                        # Blog engine (no need to touch)
│   ├── layout.tsx              # Root layout with theme & header
│   ├── page.tsx                # Post list (root page)
│   ├── post/[slug]/            # Post detail page
│   ├── components/             # UI components
│   ├── styles/                 # CSS & theme
│   ├── utils/posts.ts          # Post loading logic
│   └── api/og/[slug]/          # Dynamic OG image generation
├── scripts/
│   ├── new-post.js             # Post scaffolding script
│   └── new-resume.js           # Resume page generator
├── next-log.config.ts          # Blog configuration
└── package.json

You only need to care about:

• posts/ — where you write
• public/posts/ — where post images go
• next-log.config.ts — your blog settings

Configuration

All settings live in next-log.config.ts:

import type { SiteConfig } from "./types/config";

const config = {
  title: "My Dev Blog",
  description: "Thoughts on web development",
  url: "https://myblog.com",
  language: "en",
  author: { name: "Jane Doe" },
  social: {
    github: "https://github.com/janedoe",
    linkedin: "https://linkedin.com/in/janedoe",
  },
  theme: { primaryColor: "#1db954" },
  googleVerification: "",
  googleAnalyticsId: "",
} satisfies SiteConfig;

export default config;

See docs/configuration.md for full details.

Deploy

Vercel (recommended)

1. Push your blog to GitHub
2. Import at vercel.com/new — Next.js is auto-detected
3. Click Deploy

Every git push to main triggers an automatic redeploy.

See docs/deploy.md for domain setup, Google Search Console, Netlify, and static export.

Documentation

Guide	Description
Writing Posts	Creating posts, frontmatter fields, images, publishing workflow
MDX Components	Timeline, FileTree, code blocks, Table of Contents, custom components
Configuration	Full config file reference, theme, social links
Deploy	Vercel, Netlify, static export, domain & SEO setup
Resume	Generate and customize the resume page
Sitemap	Auto-generated sitemap, priorities, robots.txt

Demo

create-next-log-demo.vercel.app

Use Case

• if-geon.xyz — the blog that inspired create-next-log

Tech Stack

Technology	Purpose
Next.js 15	Framework (App Router)
MDX	Rich content with React components
Tailwind CSS	Styling
Radix UI	Accessible component primitives
gray-matter	Frontmatter parsing
next-mdx-remote	MDX rendering
rehype-prism-plus	Syntax highlighting

License

MIT