一天一个开源项目（第200篇）：next-forge - 生产级 Next.js SaaS 启动模板

引言

"Stop wasting time on boilerplate. Start building."

这是"一天一个开源项目"系列的第 200 篇文章。

两百篇，是个值得停下来想一想的数字。这两百个项目里有底层引擎、有 AI 框架、有开发工具、有内容平台------各种形态的开源创造力。第200篇，我想选一个能代表"从想法到产品"这条路的项目。

next-forge 就是这样一个东西。

它的定位很直接：生产级 Next.js SaaS 启动模板。不是玩具级 demo，不是"你还需要自己配齐 10 个库"的半成品，而是一套经过生产验证、可以直接跑起来的全栈基础设施。由 Vercel 工程师 Hayden Bleasel 基于十余年构建 Web 应用的经验打磨而成，7,700+ Stars，MIT 许可。

如果你曾经做过 SaaS 或独立产品，你一定遇到过这种痛苦：光是把认证、支付、邮件、数据库、错误监控、分析这些"必须有"的基础设施配好，就能花掉一周时间。而这些时间和你的核心业务毫无关系。next-forge 的价值就在这里------把这些"不得不做但不该耗时"的工作一次性解决。

你将学到什么

next-forge 的五大设计理念（Fast / Cheap / Opinionated / Modern / Safe）及背后的工程哲学
7 个 app + 20+ 个 package 的 Monorepo 架构是如何组织的
认证（Clerk）、支付（Stripe）、数据库（Prisma + Neon）等核心集成的设计思路
如何用一行命令初始化一个生产就绪的 SaaS 项目
next-forge 和其他 SaaS 模板的本质区别

前置知识

了解 Next.js 基础概念（App Router 更好）
熟悉 TypeScript 基本语法
了解 Monorepo 的基本概念（不需要深入，知道"多个项目在一个仓库里"即可）

项目背景

项目简介

next-forge 是一个 Turborepo Monorepo 模板，专为需要快速搭建 SaaS 或全栈 Web 应用的开发者设计。

它不只是一个 Next.js 应用的脚手架，而是一套完整的技术决策集合：帮你预先选好每一个功能的实现方案，并把它们集成好、配置好、跑通了，交到你手里。你需要做的只是填入自己的业务逻辑。

目标用户非常明确：

独立开发者和一人公司：想快速验证想法、上线产品，不想在基础设施上浪费时间
小团队技术负责人：需要一个经过实战检验的架构起点，而不是从零讨论"我们用什么认证方案"
经验丰富的全栈工程师：想要一个符合最佳实践、可以直接在生产环境用的模板

作者/团队介绍

主要作者 ：Hayden Bleasel，澳大利亚设计工程师，现旅居旧金山
所属组织：Vercel（现任职 OpenAI）
背景：十余年 Web 应用构建经验，同时维护 Ultracite（代码格式化工具）等多个开源项目
项目创建：基于实际 SaaS 开发经验蒸馏而成，不是"演示用例"

项目数据

⭐ GitHub Stars: 7,700+
🍴 Forks: 712+
📄 License: MIT
🌐 官网: next-forge.com
📚 文档: next-forge.com/docs
🔗 Demo: demo.next-forge.com

主要功能

核心作用

next-forge 解决的是 SaaS 开发的**"地基问题"**：在你开始写第一行业务代码之前，需要把多少"必须有的东西"搭好。

一个典型的 SaaS 需要：用户认证、付款收取、数据存储、邮件发送、错误监控、用户行为分析、文档站、内部管理......next-forge 把这些全部预先集成好：

perl 复制代码

没有 next-forge 的路径：
idea → 选认证方案 → 配 Stripe → 选 ORM → 接邮件服务 →
配错误监控 → 搭文档 → ... → 两周后终于开始写业务逻辑

有 next-forge 的路径：
npx next-forge@latest init → 填环境变量 → 开始写业务逻辑

使用场景

SaaS 产品快速启动
- 想验证一个订阅制产品的市场可行性，不想花两周配基础设施。next-forge 提供现成的订阅计划、付款流程和用户管理，一天内可以跑通完整的"注册-付款-用户仪表盘"路径。
独立开发者的副业项目
- 下班后的时间有限，next-forge 把"不值得自己做的配置工作"全部外包给模板，让有限的时间都花在产品差异化上。
团队新项目的架构基线
- 不用从零讨论"我们用什么认证""数据库选什么 ORM"------next-forge 的技术选型经过实战验证，可以直接作为团队新项目的起点。
学习现代 Next.js 全栈架构
- 对于想深入理解 Next.js App Router 生产实践的开发者，next-forge 是一个真实参考------不是教程级 demo，而是实际能上线的代码组织方式。

快速开始

bash 复制代码

# 一行命令初始化项目
npx next-forge@latest init

# 环境要求：Node.js 20+，Bun（推荐），Stripe CLI

初始化后，进入项目目录：

bash 复制代码

# 安装依赖
bun install

# 启动开发环境（同时启动所有 apps）
bun run dev

访问地址：

localhost:3000 --- 主应用（用户登录后的界面）
localhost:3001 --- 营销网站（对外展示页）
localhost:3002 --- API 服务
localhost:3003 --- 邮件模板预览
localhost:3004 --- 项目文档
localhost:6006 --- Storybook 组件库

核心特性

1. 完整的认证系统（Clerk）

邮箱登录、社交账号登录（Google / GitHub 等）开箱即用
路由按认证状态自动分组：(authenticated)/ 和 (unauthenticated)/
组织/团队支持，适合 B2B SaaS 场景

2. 订阅付款（Stripe）

订阅计划、一次性付款、使用量计费三种模式
Webhook 处理已预先配置（在 apps/api 里）
客户门户（Customer Portal）支持用户自助管理订阅

3. 类型安全数据库（Prisma + Neon）

Prisma ORM 提供端到端类型安全查询
默认连接 Neon（无服务器 PostgreSQL），按需付费
在 React Server Components 中直接调用，无需 API 层

tsx 复制代码

// 在 Server Component 中直接查询
import { database } from '@repo/database';

const users = await database.user.findMany({
  where: { active: true }
});

4. 邮件系统（Resend + React Email）

用 React 组件写邮件模板（真的是 JSX，不是 HTML 字符串）
apps/email 提供实时预览服务器
Resend 负责实际发送，高送达率

5. 可观测性（Sentry + BetterStack）

Sentry 负责错误追踪和性能监控
BetterStack 负责日志聚合和告警
两者均已预配置，部署后直接生效

6. 用户行为分析（PostHog + Google Analytics）

PostHog 提供产品分析、功能开关（Feature Flags）、A/B 测试
Google Analytics 负责流量统计
统一封装在 @repo/analytics 包里

7. 安全防护（Arcjet）

速率限制（Rate Limiting）
Bot 检测
邮箱验证（防止虚假注册）
开发环境自动禁用，不影响本地调试

8. 实时协作（Liveblocks）

多人光标（Live Cursors）
用户头像堆叠（Avatar Stack）
适合需要协作功能的 SaaS 场景

9. 国际化（Languine）

i18n 方案已集成，支持多语言
@repo/internationalization 包统一管理翻译资源

10. 推送通知（Knock）

应用内通知、邮件通知、短信通知统一管理
可视化通知流程编排

项目优势

对比项	next-forge	create-t3-app	手动搭建
开箱集成数	20+ 服务全部配好	核心技术栈，其余手动	全部手动
多应用架构	✅ 7 个独立 app	❌ 单应用	手动设计
生产验证	✅ 实战背景	✅ 广泛使用	取决于经验
文档质量	✅ 完整文档站	✅ 活跃社区	---
付款集成	✅ Stripe 预配	❌ 无	手动接入
可观测性	✅ Sentry + BetterStack	❌ 无	手动接入
协作功能	✅ Liveblocks	❌ 无	手动接入
初始化时间	一行命令	一行命令	数天~数周

为什么选择 next-forge？

决策成本为零：每个领域（认证/支付/数据库）都已做出经过验证的选择，不用自己比较方案
不是 demo，是生产模板：集成的都是真实 SaaS 在用的服务，不是"学习用示例"
Monorepo 架构：营销站、应用、文档、邮件模板分离，职责清晰，各自独立部署

项目详细剖析

架构设计：为什么是 Monorepo

next-forge 选择 Turborepo Monorepo 而不是单一仓库，背后有清晰的工程逻辑。

一个完整的 SaaS 通常包含几个独立但相关的"应用"：

对外的营销网站（给潜在用户看的，SEO 优先）
登录后的主应用（给付费用户用的，功能优先）
API 服务（处理 Webhook、定时任务等）
文档站（给用户和开发者看）

把这些放在一个仓库、但保持独立部署能力，同时共享认证逻辑、UI 组件、类型定义------这正是 Monorepo 的适用场景。

less 复制代码

next-forge/
├── apps/
│   ├── app/         ← 主应用 (localhost:3000)
│   │   └── env.ts   ← 聚合该 app 依赖的所有环境变量
│   ├── web/         ← 营销网站 (localhost:3001)
│   ├── api/         ← API + Webhook 处理 (localhost:3002)
│   ├── email/       ← 邮件模板预览服务器 (localhost:3003)
│   ├── docs/        ← Mintlify 文档站 (localhost:3004)
│   ├── storybook/   ← 组件库 (localhost:6006)
│   └── studio/      ← Prisma 数据库可视化 (localhost:3005)
│
└── packages/
    ├── auth/              ← Clerk 认证封装
    ├── database/          ← Prisma + Neon 客户端
    ├── payments/          ← Stripe 封装
    ├── email/             ← React Email 模板
    ├── analytics/         ← PostHog + GA 统一入口
    ├── observability/     ← Sentry + BetterStack
    ├── security/          ← Arcjet 安全防护
    ├── collaboration/     ← Liveblocks 实时协作
    ├── notifications/     ← Knock 通知
    ├── internationalization/ ← i18n 管理
    ├── feature-flags/     ← Vercel Flags + PostHog
    ├── storage/           ← Vercel Blob 文件存储
    ├── ui/                ← 共享 UI 组件（基于 shadcn/ui）
    ├── design-system/     ← 字体、主题、全局样式
    └── typescript-config/ ← 共享 TS 配置

关键设计原则 ：apps 之间不互相依赖 。web 不能 import app 里的模块。共享代码统一放在 packages/，通过 @repo/xxx 引用。

tsx 复制代码

// ✅ 正确：通过 package 引用共享逻辑
import { auth } from '@repo/auth';
import { database } from '@repo/database';
import { Button } from '@repo/ui';

// ❌ 错误：跨 app 引用
import { UserCard } from '../../app/components/UserCard';

这个边界约束通过 Turborepo 的 boundaries 功能在 CI 中强制检查：

bash 复制代码

bun run boundaries  # 检测跨 app 依赖违规

环境变量管理：env.ts 模式

next-forge 用了一个优雅的设计解决"环境变量管理混乱"的问题：每个 app 的根目录有一个 env.ts 文件，专门负责聚合和验证该 app 所需的所有环境变量。

typescript 复制代码

// apps/app/env.ts
import { env as authEnv } from '@repo/auth/env';
import { env as databaseEnv } from '@repo/database/env';
import { env as paymentsEnv } from '@repo/payments/env';

export const env = {
  ...authEnv,
  ...databaseEnv,
  ...paymentsEnv,
  NEXT_PUBLIC_APP_URL: process.env.NEXT_PUBLIC_APP_URL!,
};

每个 packages/xxx/env.ts 用 @t3-oss/env-nextjs 做运行时验证------如果某个必要的环境变量没配，启动时就会报错，不会等到运行时才爆。

这个模式解决了 Monorepo 里常见的问题："我到底需要配哪些环境变量？" 只看 apps/app/env.ts 就一目了然。

包的设计哲学：自包含，可替换

next-forge 里每个 package 的设计遵循一个原则：自包含，对外暴露干净的接口，内部实现可随时替换。

以 @repo/auth 为例：

typescript 复制代码

// packages/auth/index.ts --- 对外暴露的接口
export { auth, currentUser, signIn, signOut } from './clerk';

// 使用方完全不感知 Clerk 的存在
// 如果有天要换掉 Clerk，只需修改这个包，app 代码不变

这个设计让技术选型的迁移成本最小化------如果 Clerk 某天不再适合你，替换成 Auth.js 或 Supabase Auth，只需修改 packages/auth 这一个包。

类型安全的全栈体验

next-forge 从数据库 schema 到前端 UI 全程保持类型安全：

arduino 复制代码

Prisma Schema（数据库结构定义）
    ↓ prisma generate
Prisma Client（类型安全的查询函数）
    ↓ import { database } from '@repo/database'
Server Component（直接调用，无 API 层）
    ↓ 返回数据给
Client Component（TypeScript 类型自动推导）

整条链路没有任何类型断裂点------数据库字段改了，TypeScript 会立刻在编译阶段告诉你哪里需要跟着改。

部署方案

next-forge 支持三种部署方式：

方式	适合场景
Vercel（推荐）	快速上线，零运维，按用量付费
Netlify	类 Vercel 体验，有偏好可选
Docker 自托管	需要完全控制基础设施，或有合规要求

Vercel 部署最简单------每个 app 单独连接 GitHub 仓库对应的子目录，turbo.json 已配好构建依赖关系。

项目地址与资源

官方资源

🌟 GitHub : github.com/vercel/next...
📚 文档 : next-forge.com/docs
🌐 官网 : next-forge.com
🎮 Demo : demo.next-forge.com
🐛 Issues : github.com/vercel/next...

总结与展望

核心要点回顾

5 大设计原则（Fast / Cheap / Opinionated / Modern / Safe）是整个模板技术选型的指导纲领
7 个独立 app + 20+ 个共享 package 的 Monorepo 架构，职责清晰，可独立部署
env.ts 模式统一管理环境变量，运行时校验，消除"配了什么变量"的心智负担
自包含 package 设计让技术选型可随时替换，避免厂商锁定
一行命令初始化，直接跑起来一个包含认证/支付/数据库/邮件/监控的完整 SaaS 骨架

适用人群

想快速验证 SaaS 想法的独立开发者：next-forge 帮你把"不该花时间"的地基搭好
不想重复造轮子的小团队：直接用经过验证的架构，专注核心业务
想学习 Next.js 生产实践的开发者：next-forge 是少数"真实生产级"而非"教程级"的参考架构

一句话评价

如果你正在做一个 SaaS 或独立产品，next-forge 不是"可以考虑的选项"，而是"强烈建议的起点"------它把所有"不应该花时间"的配置工作一次性解决了，剩下的都是真正属于你的产品决策。

欢迎访问 PrimeSkills ------ 一个精心策划的 AI Agent 与技能市场，所有内容均经过真实企业级工作流验证。没有噱头，只有真正有效的东西。

更多实用知识和有趣产品，欢迎访问我的个人主页

一天一个开源项目（第200篇）：next-forge - 生产级 Next.js SaaS 启动模板

引言

你将学到什么

前置知识

项目背景

项目简介

作者/团队介绍

项目数据

主要功能

核心作用

使用场景

快速开始

核心特性

项目优势

项目详细剖析

架构设计：为什么是 Monorepo

环境变量管理：env.ts 模式

包的设计哲学：自包含，可替换

类型安全的全栈体验

部署方案

项目地址与资源

官方资源

相关资源

总结与展望

核心要点回顾

适用人群

一句话评价