subscription-store 是 Vercel Academy 课程《Launch a Subscription Store with Vercel and Stripe》的配套技能。该课程以 The Forager's Guild 为例，使用 Next.js 16、React 19、Supabase Auth 和 Stripe 构建一个生产可用的订阅制商店前端。当用户提到“subscription store”等相关话题时，可使用该技能获得与课程配套的指导。
用途 该技能服务于一个由 17 节课、4 个部分组成的引导式学习流程，依次覆盖身份认证、支付、访问控制和生产部署。
命令
- /subscription-store learn：启动引导式学习循环。共 17 节课、4 个部分，覆盖认证、支付、访问控制与生产。
- /subscription-store new：脚手架新建订阅商店项目，包括：通过第一课的 Deploy 按钮将 starter 部署到 Vercel（复制 vercel/academy-starters/vercel-stripe-subscription-storefront/starter）；在本地克隆并使用 pnpm 安装依赖；创建 Supabase 项目并将 URL 与 publishable key 写入 .env.local；在测试模式下设置 Stripe 账户并添加 secret key；验证 pnpm dev 在 http://localhost:3000 提供首页。
- /subscription-store submit：对照当前课程目标评估你的实现进度。
课程内容与核心概念 课程共 17 节，按顺序包括：1.1 部署 Starter、1.2 Supabase 项目设置、1.3 Supabase 客户端工具、1.4 注册与登录页面、1.5 代理与受保护路由；2.1 连接 Stripe、2.2 带套餐的定价页、2.3 Stripe Checkout 流程、2.4 订阅管理、2.5 订阅操作；3.1 理解访问控制、3.2 服务端检查、3.3 客户端检查、3.4 受保护的 API 路由；4.1 错误处理与加载、4.2 页头与导航、4.3 部署到生产。
身份认证（Supabase Auth）方面，通过 @supabase/ssr 提供浏览器与服务端 Supabase 客户端（utils/supabase/client.ts 中的 createBrowserClient、utils/supabase/server.ts 中的 createServerClient）；使用 Server Actions 实现注册、登录和登出（app/actions.ts 中的 signUpAction、signInAction、signOutAction）；通过 proxy.ts 调用 utils/supabase/proxy.ts 的 updateSession 完成会话刷新与路由保护（Next.js 16 以 proxy.ts 替代 middleware.ts）。
支付（Stripe）方面，服务端 Stripe 客户端由 utils/stripe/config.ts 导出为 stripe；app/api/webhooks/route.ts 的 Webhook 路由校验 Stripe 签名并将产品、价格和订阅同步到 Supabase；结算流程通过 utils/stripe/server.ts 中的 checkoutWithStripe() Server Action 返回 Stripe Checkout 会话 URL，utils/supabase/admin.ts 中的 createOrRetrieveCustomer() 将 Supabase 用户与 Stripe 客户关联；订阅管理通过 Stripe Customer Portal（createStripePortal() Server Action）实现。
访问控制方面，utils/supabase/queries.ts 提供 getProducts、getSubscription、hasActiveSubscription 查询助手；服务端订阅检查在 Server Components（app/protected/paid-content/page.tsx）中进行；客户端 UI 状态在 components/field-guide-card.tsx 中调用 /api/field-guide；受保护 API 路由 app/api/field-guide/route.ts 在无有效订阅时返回 403。
进度检测 技能通过检查文件内容（starter 中许多文件是占位桩，因此需检查内容而非仅存在性）判断学习进度，例如：.env.local 是否包含 NEXT_PUBLIC_SUPABASE_URL 与 NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY；utils/supabase/client.ts 是否使用 createBrowserClient；utils/supabase/server.ts 是否导出基于 createServerClient 的 createSupabaseClient；app/actions.ts 中三个 Action 是否已实现；utils/supabase/proxy.ts 的 updateSession 是否重定向未认证的 /protected 请求；Stripe 密钥与 Webhook 签名校验是否就绪；getProducts()、checkoutWithStripe()、createOrRetrieveCustomer()、createStripePortal()、hasActiveSubscription() 等是否实现；loading.tsx、error.tsx 是否存在；是否已使用 live 密钥和 live Webhook 端点部署到生产。
教学指南 课程共 17 节课，应把握节奏、不要赶进度；每节课都有明确的“动手练习”，需确保完成；Supabase 和 Stripe 都需要外部控制台操作，应精确引导；频繁检查 .env.local，缺少密钥是最常见的阻塞点；Webhook 需要本地运行 stripe listen --forward-to localhost:3000/api/webhooks，否则产品与订阅永远不会到达 Supabase；测试模式产品不会带到 live 模式，学习者需在第 4.3 课重新创建；proxy.ts 模式是 Next.js 16 的新变化，可能会带来疑问。
限制 资料仅描述课程配套技能的内容与命令，未提供该技能独立的价格、支持的模型/平台、效果评估或替代方案等信息。