构建电商应用意味着要同时处理产品、认证、支付、状态管理和部署。

在本课程中，你将学习如何使用 Next.js、Supabase、Zustand 和 Paystack 构建一个全栈电商应用。

你还将学习身份认证、服务端操作（Server Actions）、API 路由、商品评价、购物车状态管理，以及如何将成品部署到 Vercel 上。

https://freecodecamp.org/news/build-an-e-commerce-web-app-with-paystack-nextjs-supabase/…

使用 Paystack、NextJS、Supabase 构建电商 Web 应用

来源：https://www.freecodecamp.org/news/build-an-e-commerce-web-app-with-paystack-nextjs-supabase/ 使用 Paystack、NextJS、Supabase 构建电商 Web 应用。Paystack 是一个让企业无缝接受在线支付的支付网关，类似于 Stripe，但专注于非洲市场。

我们刚刚在 freeCodeCamp.org (http://freecodecamp.org/) YouTube 频道发布了一门课程，教你如何利用 Next.js、Supabase、Zustand 和 Paystack 这一强大组合，构建一个全栈电商应用。

本课程涵盖开发流程的每一步，从使用 React Context API 管理复杂状态，到将成品部署到 Vercel。通过本课程，你将学会使用行业标准工具构建和扩展真实世界的应用。

以下是视频的各章节：

• 介绍
• 快速应用演示
• NextJS 安装
• Figma 简介
• Supabase 简介
• 表与触发器的 SQL 查询
• Supabase 存储
• 为 NextJS 设置 Supabase
• 服务端操作（Server Actions）
• 将代码提交到 GitHub
• 身份认证
• Zod
• Supabase 触发器与函数
• Context API
• 商品详情
• 立即购买功能
• Paystack 集成实现
• API 路由
• 地址表
• 触发器
• 评价
• 使用 Zustand 存储购物车商品
• 准备托管
• 将所有代码提交到 GitHub
• Vercel 托管
• 解决一个 Bug
• 结束语

在 freeCodeCamp.org (http://freecodecamp.org/) YouTube 频道观看完整课程（时长 8 小时）。

免费学习编程。freeCodeCamp 的开源课程已帮助超过 40,000 人成为开发者。开始学习 (https://www.freecodecamp.org/learn)