cali.so：基于 Next.js 的现代化个人博客开源项目

本文介绍 cali.so，一个基于 Next.js 构建的现代化个人博客网站开源项目。该项目由 Cali Castle 开发维护，采用全栈技术栈，集成了丰富的功能特性，适合开发者作为个人网站模板使用。

项目简介

cali.so 是 Cali Castle 的个人官网开源项目，完整实现了个人博客网站的各项功能。截至目前，该项目在 GitHub 上已获得 1.9k stars 和 555 forks，主要使用 TypeScript (91.2%) 编写，代码质量高，架构清晰。

该项目不仅是一个展示型的个人网站，更是一个功能完整的博客系统，包含文章发布、评论互动、邮件订阅、CMS 内容管理等功能。

核心特性

• 现代化设计：采用 Tailwind CSS 构建响应式界面，配合 Framer Motion 实现流畅动画效果
• 博客系统：完整支持文章发布、分类管理、评论互动等功能
• CMS 集成：使用 Sanity 作为无头 CMS，方便内容管理和发布
• 用户认证：集成 Clerk 提供安全、便捷的用户认证方案
• 邮件订阅：支持 Newsletter 功能，使用 React Email 和 Resend 发送邮件
• 数据库支持：使用 Neon PostgreSQL 数据库，配合 Drizzle ORM 进行数据操作
• SEO 优化：基于 Next.js 14 App Router，支持服务端渲染，有利于搜索引擎优化

技术栈

安装指南

前置要求

• Node.js >= 18
• pnpm >= 8（推荐）

安装步骤

# 克隆仓库
git clone https://github.com/CaliCastle/cali.so.git
cd cali.so

# 安装依赖
pnpm install

# 配置环境变量
cp .env.example .env.local
# 编辑 .env.local 文件，填入必要的环境变量

环境变量配置

项目需要配置多个第三方服务的环境变量才能正常运行：

• Clerk：用户认证服务配置
• Neon：PostgreSQL 数据库连接
• Sanity：CMS 内容管理配置
• Resend：邮件发送服务 API Key

详细配置请参考 .env.example 文件。

快速开始

# 启动开发服务器
pnpm dev

# 构建生产版本
pnpm build

# 启动生产服务器
pnpm start

部署指南

项目推荐使用 Vercel 进行一键部署：

1. 将代码推送到 GitHub
2. 在 Vercel 中导入项目
3. 配置环境变量
4. 完成部署

详细的部署教程可以参考 Cali 的官方教程。

项目结构

cali.so/
├── app/              # Next.js App Router 页面
├── components/       # React 组件
├── lib/              # 工具函数和库
├── db/               # 数据库配置和 schema
├── sanity/           # Sanity CMS 配置
├── emails/           # React Email 邮件模板
├── public/           # 静态资源
└── config/           # 配置文件

变更日志

• 2024-03-13 (v2.0)：更新 Sanity 到最新版，Next.js 升级到 v14.1，提取首页图片和工作经历到 Sanity 设置
• 2024-03-10 (v1.1)：从 PlanetScale (MySQL) 迁移到 Neon (PostgreSQL)

项目链接

• GitHub 仓库：https://github.com/CaliCastle/cali.so
• 在线演示：https://cali.so/
• 部署教程：https://cali.so/blog/guide-for-cloning-my-site

总结

cali.so 是一个功能完善、技术栈现代化的个人博客开源项目，适合开发者作为个人网站模板使用。项目采用最新的 Next.js 14 App Router 架构，集成了丰富的功能特性，代码质量高，文档完善，是学习和参考的优秀开源项目。