跳转到主要内容

Documentation Index

Fetch the complete documentation index at: https://help.helloazhenweb.top/llms.txt

Use this file to discover all available pages before exploring further.

Vercel 是 Birthday Wall 推荐的托管平台,因为它为 Next.js 而生,自动处理构建和运行时,并提供慷慨的 Hobby 免费套餐,对一个个人生日站来说绰绰有余。本页将带你完成从 GitHub 推送到上线 URL 的每一步。

本地开发

部署前可以先在本地运行 Birthday Wall 来验证你的配置:
npm install
npm run dev
开发服务器会启动在 http://localhost:3000。在推送前如需本地测试生产构建:
npm run build && npm run start
如果带着 .env.local 在本地构建成功,Vercel 上的部署也会成功。

部署到 Vercel

1

把 Fork 推送到 GitHub

确保你的仓库已经推送到 GitHub(或 GitLab / Bitbucket — Vercel 这三家都支持)。Vercel 需要访问仓库以拉取源代码并设置自动部署。
git add .
git commit -m "initial setup"
git push origin main
2

在 Vercel 中导入仓库

  1. 登录 vercel.com,点击 Add New… → Project
  2. Import Git Repository 下点击 Continue with GitHub(或你的 Git 服务商),按提示授权 Vercel。
  3. 在列表中找到你的 Birthday Wall 仓库,点击 Import
3

确认框架预设

Vercel 会自动识别 Next.js 项目并设置正确的构建配置:
  • Framework Preset:Next.js
  • Build Commandnext build
  • Output Directory.next
  • Install Commandnpm install
你不需要修改这些设置中的任何一项。
4

添加环境变量

在点击 Deploy 之前,请向下滚动到 Environment Variables 区域,添加全部五个必需变量:
变量
NEXT_PUBLIC_SUPABASE_URL你的 Supabase 项目 URL
NEXT_PUBLIC_SUPABASE_ANON_KEY你的 Supabase anon 密钥
SUPABASE_SERVICE_ROLE_KEY你的 Supabase service role 密钥
NEXT_PUBLIC_SITE_URL暂时留作占位 — 首次部署完成后再回来更新
ADMIN_PASSWORD你为管理后台选定的密码
每个变量的说明以及如何在 Supabase 中找到对应值,请参阅 环境变量页面
5

部署

点击 Deploy。Vercel 会克隆你的仓库,运行 npm install,然后执行 next build 并发布结果。首次构建通常需要 2 到 3 分钟。部署完成后,Vercel 会显示 Congratulations 页面,并给出你的上线 URL(如 https://birthday-wall-abc123.vercel.app)。
6

设置 NEXT_PUBLIC_SITE_URL 并重新部署

复制 Vercel 刚刚分配给你项目的生产 URL。然后:
  1. 进入 Project Settings → Environment Variables
  2. 编辑 NEXT_PUBLIC_SITE_URL,把生产 URL 粘贴为它的值。
  3. 触发一次重新部署:在 Deployments 标签页找到最新部署,点击 菜单并选择 Redeploy
这样,认证回跳和任何绝对 URL 的生成才会指向你真实的域名。
7

(可选)绑定自定义域名

如果你希望站点跑在自定义域名(如 happy-birthday-alex.com)下:
  1. 在 Vercel 项目中前往 Settings → Domains
  2. 输入你的域名并点击 Add
  3. 按提示在域名注册商处添加 DNS 记录(Vercel 会给出需要创建的精确记录)。
  4. NEXT_PUBLIC_SITE_URL 更新为你的自定义域名并重新部署。
Vercel 会自动为你的域名签发并续期 TLS 证书。

自动部署

一旦项目连接到了 GitHub,Vercel 会将每次推送到 main 分支的提交自动作为新的生产部署。推送到其他分支会得到一个独立的预览 URL,方便你在上线前查看变更。

管理员子域名(可选)

Birthday Wall 支持一个可选的管理员子域名。指向 admin.<your-domain> 的请求会被自动路由到 /admin 后台。如果你希望通过子域名访问后台:
  1. 在 Vercel 中前往 Settings → Domains
  2. 添加 admin.<your-domain> 作为附加域名,并按提示配置 DNS。
重写会自动生效 — 无需修改任何代码。
Vercel 的 Hobby 免费套餐对个人生日站来说完全够用。在典型的个人使用场景下,无需担心带宽或构建时长。