带有 GPT API、Google 认证、Tailwind 和 Stripe 支付的 SaaS 模板

[!警告] 此模板已过时，已被新模板 OpenSaaS.sh 取代。新模板功能更强大，使用更简单。快来看看吧！

Free SaaS Template (GPT, Stripe, Auth) - A free React/NodeJS SaaS template for quick idea execution | Product Hunt

这是什么？

完全免费的 SaaS 模板，使用 Prisma/Postgres、Express、React、Node（PERN 技术栈）构建。可以作为构建优秀产品的起点！

它预先配置了：

🔐 身份验证（邮箱 + 社交）
📩 邮件发送
🤑 支付（Stripe）
🤖 GPT API

并使用了：

⌨️ TypeScript
🎨 Tailwind CSS

在这里测试：https://saas-template-gpt-client.fly.dev/

本地运行

确保安装了最新版本的 Wasp，在终端中运行 curl -sSL https://get.wasp-lang.dev/installer.sh | sh。
运行 wasp new <项目名称> -t saas 使用此模板创建新应用。
将 env.server.example 文件重命名为 .env.server，并按照文件中的说明填写 API 密钥。
确保已连接并运行数据库。这里有两个快速选项：

如果安装并运行了 Docker，运行 wasp start db（在 MacOS 上，如果没有安装，运行 brew install docker-machine docker，然后在启动台中找到并运行应用）。这将为你启动一个 Postgres 数据库。无需其他操作！🤯
或在 Railway 上配置 Postgres 数据库，进入设置并复制 connection url。将其粘贴为 DATABASE_URL=<你的 postgres 连接 url> 到 env.server 文件中。

运行 wasp db migrate-dev
运行 wasp start。这将安装所有依赖并为你启动客户端和服务器 :)
在浏览器中访问 localhost:3000（你的 NodeJS 服务器将在 3001 端口运行）
安装 VSCode 的 Wasp 扩展以获得最佳开发体验
查看文件中包含具体说明的注释。
如果你想在本地测试 Stripe Webhooks，下载 Stripe CLI。这个 YouTube 视频很好地解释了如何使用 Stripe CLI 在本地测试 webhooks（观看至 27:00）。
享受并玩得开心。当你使用此模板创建应用时，请友善地在 twitter 上标记我 @hot_town

快速部署到 Fly.io

在 Fly.io 上创建账户
在 Linux/MacOS 上运行 curl -L https://fly.io/install.sh | sh 安装 Fly CLI
运行 wasp deploy fly setup my-wasp-app mia
运行 wasp deploy fly cmd secrets set ENV_VAR_EXAMPLE=<你的环境变量> --context=server，确保填写所有环境变量
运行 wasp deploy fly create-db mia
运行 wasp deploy fly deploy
确保在 Stripe 仪表板中更新了 Stripe webhook URL，指向你的 Fly 应用 URL
还要确保更新了 Google Auth 回调 URL，指向你的 Fly 应用 URL

你也可以在这里查看手动部署到 Fly、Railway 和 Netlify 的指南。

工作原理

🐝 Wasp - 允许你用少 10 倍的样板代码构建全栈应用
🎨 Tailwind CSS - 易于使用的 CSS
🤖 OpenAI - GPT-3.5 turbo API
💸 Stripe - 用于支付
📧 SendGrid - 用于发送邮件

Wasp 作为全栈框架，允许你在根目录的 main.wasp 配置文件中描述应用的核心功能。然后它为你构建并组装这些功能到一个 React-Express-Prisma 应用中，这样你就可以专注于编写客户端和服务器端逻辑，而不是配置。例如，我不需要使用任何第三方库来实现 Google 认证。我只需在配置文件中写几行代码说明我想使用 Google Auth，Wasp 就为我配置好了。查看 main.wasp 文件中的注释以了解更多。

Stripe 使支付功能变得非常简单。我只使用了他们的 Subscription 功能。用户付款后，通过 src/server/webhooks.ts 文件中的 webhook 更新数据库中的 hasPaid 和 datePaid 字段。

Wasp 的集成 Jobs 功能用于每周运行一个 cron 作业发送新闻邮件。我使用 SendGrid 作为邮件服务。

如果你有任何其他问题，欢迎在 twitter 或 Wasp discord 服务器上联系我。