OneStopShop

OneStopshop

警告此应用程序正在进行中，不应将其视为准备就绪。它使用尚未稳定的新技术，例如服务器操作和毛毛雨ORM。

关于

使用Next.js应用程序路由器构建的在线市场，该路由器允许用户购买产品，注册并列出自己的产品出售产品。用户可以创建卖方资料，管理产品并收集付款。

关键功能：

• Next.js应用程序路由器带有React服务器组件
• 用于产品快速视图的截距路线（带有并行路由），并在管理员中创建新产品
• 服务器动作突变
• Planetscale Mysql数据库，带有细雨orm
• typesafe文件上传的上载（例如，产品图像）
• 用店员的用户身份验证
• Stripe Connect集成市场付款（包括平台费和卖方支出）

演示

要演示结帐体验，请使用测试卡号进行结帐，例如4242 4242 4242 4242 ，并使用未来的任何日期以及CVC的任何3位数字。您只能与将其连接到其商店的Stripe帐户（例如Tim's Toys）的卖家的产品结帐。您还可以创建自己的卖方帐户，并将其连接到Stripe，以获得完整的体验。

主页

管理产品页编辑器

运行该应用程序

请按照以下步骤在本地运行该应用程序：

1. 创建一个MySQL数据库。
2. 根据.env.example文件创建带有变量的本地.env文件。
3. 运行npm install 。
4. 使用npx drizzle-kit generate:mysql生成迁移。这将在根中创建一个名为migrations-folder ，其中包含SQL查询以创建数据库表。通过db.ts中的迁移函数自动与数据库自动同步。另外，您可以通过行星尺度控制台手动从迁移中运行生成的SQL查询，并在db.ts中删除迁移功能。
5. 运行npm run dev以在开发模式下打开应用程序。

就是这样。现在，您应该能够通过http://localhost:3000访问该应用程序。

笔记

• 当第一次使用毛毛雨生成迁移时，请确保根中的migrations-folder是空的或不存在的。

故事书

自从该应用程序最初创建以来，Storybook已被添加到该应用程序中。无论如何，可以使用以下命令进行运行：

1. 运行尾风构建脚本以创建一个用于尾管类的输出文件（运行并完成后，您可能必须“杀死”终端（即ctrl + c ），以停止该进程，如果该过程不自动停止）。

   命令： npm run tailwind

2. 运行故事书（这将使用上一步中创建的尾风输出文件，并在http://localhost:6006上运行）。

   命令： npm run storybook

故障排除

如果您看到与行星尺度中不存在的表有关的错误（可能是在app/(storefront)/(main)/page.tsx中丢弃，因为这是数据库的首次使用），这是由于数据库不在同步中。重新访问上面的“运行应用程序”步骤，并在PlanetsCale中检查“ Insights”选项卡，以检查表创建查询是否已运行。

贡献

随时提出问题和公关的新功能/修复程序