用 Supabase + Next.js 搭建全栈应用的最佳实践

为什么选择 Supabase

在做小野旅行时，我需要一个能快速搭建后端的方案。Supabase 提供了：

• PostgreSQL 数据库
• 实时订阅
• 认证系统
• 存储服务
• Edge Functions

这意味着我不需要自己搭建任何后端服务。

数据库设计原则

好的数据库设计是应用成功的基础。花时间在 schema 设计上，后面会省很多事。

1. 善用 PostgreSQL 特性

PostgreSQL 不只是一个关系数据库，它还有很多强大的特性：

• JSONB - 灵活存储半结构化数据
• Array - 标签、技术栈等列表数据
• 全文搜索 - 内置的搜索引擎
• 触发器 - 自动更新时间戳、计算阅读时间

2. RLS 策略设计

Row Level Security 是 Supabase 的核心安全机制：

-- 公开读取已发布内容
CREATE POLICY "Public read" ON posts
  FOR SELECT USING (published = true);

-- 管理员完全控制
CREATE POLICY "Admin all" ON posts
  FOR ALL USING (auth.uid() = admin_id);

3. 性能优化

• 为常用查询字段创建索引
• 使用 select 只获取需要的字段
• 合理使用 .single() 和 .maybeSingle()

Next.js 集成

Supabase 提供了 @supabase/ssr 包，完美支持 Next.js 的服务端渲染：

• Server Component 使用服务端客户端
• Client Component 使用浏览器客户端
• API Routes 可使用 Service Role 客户端

这种架构保证了安全性和性能的平衡。