Jimmy的博客

一个基于 Next.js 15+ 构建的极简个人博客系统。

技术栈

• 框架: Next.js 13+（App Router）
• 样式: Tailwind CSS
• Icon: Lucide Icons
• Theme: Supports dark/light mode switching
• Deployment: Vercel

Features

• 📝 Markdown article support
• 🌓 Dark/light theme switching
• 📱 Responsive design
• ⚡ Fast loading
• 📅 Article timeline display
• 🔐 Online management dashboard (create articles directly via GitHub API)

Project Structure

.
├── app/
│   ├── lib/           # 工具函数和数据处理
│   ├── posts/         # 博客文章
│   └── page.tsx       # 首页
├── content/
│   ├── notes/         # 随笔
│   └── posts/         # 文章
├── components/        # React 组件
├── public/            # 静态资源
└── styles/            # 全局样式

安装与运行

• 克隆项目

git clone https://github.com/Lily-404/blog.git
cd jimmy-blog

• 安装依赖

npm install

npm run dev

npm run build

---
title: 文章标题
date: YYYY-MM-DD
tags: ["标签1","标签2","标签3"]
---

---
date: YYYY-MM-DD
---

• 访问 GitHub 设置 > 开发者设置 > OAuth 应用
• 点击 "New OAuth App"
• 填写信息：
• Application name：Jimmy Blog Admin（或任意名称）
• Homepage URL：https://你的域名.com（生产环境）或 http://localhost:3000（本地开发）
• Authorization callback URL：
• 生产环境: https://你的域名.com/api/auth/github/callback
• 本地开发: http://localhost:3000/api/auth/github/callback
• 点击 "Register application"
• 记录 Client ID
• 点击 "Generate a new client secret"，记录 Client secret

2. 配置环境变量

在 Vercel 项目设置中添加以下环境变量：

• GITHUB_CLIENT_ID：你的 GitHub OAuth App Client ID
• GITHUB_CLIENT_SECRET：你的 GitHub OAuth App Client Secret
• GITHUB_OWNER：GitHub 用户名（默认：Lily-404，用于验证用户权限）
• GITHUB_REPO：仓库名称（默认：blog）
• GITHUB_REDIRECT_URI：OAuth 回调 URL（可选，默认自动生成）
• NEXT_PUBLIC_BASE_URL：你的网站 URL（用于生成回调 URL，生产环境必须设置）
• 生产环境: https://www.jimmy-blog.top
• 本地开发: http://localhost:3000

3. 本地开发配置

在项目根目录创建 .env.local 文件：

GITHUB_CLIENT_ID=你的Client_ID
GITHUB_CLIENT_SECRET=你的Client_Secret
GITHUB_OWNER=Lily-404
GITHUB_REPO=blog
NEXT_PUBLIC_BASE_URL=http://localhost:3000

4. 生产环境配置（Vercel）

在 Vercel 项目设置中，确保设置：

NEXT_PUBLIC_BASE_URL=https://www.jimmy-blog.top

⚠️ 注意:

• .env.local 文件已被添加到 .gitignore，不会被提交到 Git
• 本地开发时，请确保 OAuth 应用的回调 URL 设置为 http://localhost:3000/api/auth/github/callback
• 生产环境必须将 NEXT_PUBLIC_BASE_URL 设置为 https://www.jimmy-blog.top
• 生产环境下的 OAuth 应用回调 URL 应设置为：https://www.jimmy-blog.top/api/auth/github/callback`

部署

项目已配置 Vercel 部署，支持自动化部署。只需将代码推送到 GitHub 仓库，Vercel 会自动构建并部署。

使用管理后台的优势

• ✅ 无需本地开发环境
• ✅ 可以随时随地添加文章
• ✅ 自动触发 Vercel 重新部署
• ✅ 完全免费（GitHub OAuth 和 Vercel 均在免费额度内）
• ✅ 安全（GitHub OAuth 验证，仅仓库所有者/协作者可访问）
• ✅ 无需管理密码，直接用 GitHub 账号登录

贡献

欢迎提交 Issue 和 Pull Request！

许可证

MIT 许可证

--- Tranlated By Open Ai Tx | Last indexed: 2026-01-30 ---