AI导哈

全栈开发模板

JabStack是一个现代的、全栈的个人项目启动模板，集成了SvelteKit、Turso、Better Auth、Stripe等多种技术，支持快速开发和部署。

  • by jabarihunt
  • Svelte
  • 本地部署
  • 更新于
在 GitHub 查看 jabarihunt/jabstack

使用说明

JabStack

一个现代的、全栈的个人项目入门模板。使用SvelteKit、Turso、Better Auth、Stripe构建，并部署在Fly.io上。

特性

  • 包子 -快速JavaScript运行时和包管理器
  • SvelteKit 的 -支持SSR/SSG/SPA的全栈web框架
  • 语言/SQLite -LibSQL用于生产，SQLite用于本地开发
  • 更好的认证 -使用Google OAuth进行现代身份验证
  • 条纹 -订阅的付款处理
  • 重发 -交易电子邮件服务
  • shadcn苗条 -仪表板的漂亮UI组件
  • Bits用户界面 -营销页面的无头组件
  • Fly.io -使用Docker进行边缘部署

快速入门

1. git clone https://github.com/yourusername/jabstack.git
2. cd jabstack
3. bun install
4. cp .env.example .env
5. bun run dev

该应用程序运行于 http://localhost:5173 SQLite开箱即用。只有在中配置API密钥后，身份验证和支付才能工作 .env.

完整设置

先决条件

环境变量

这 .env.example 该文件为本地开发提供了合理的默认设置。您需要配置：

变量 必需 来源
BETTER_AUTH_SECRET 认证 openssl rand -base64 32
GOOGLE_CLIENT_ID 谷歌OAuth 谷歌云控制台
GOOGLE_CLIENT_SECRET 谷歌OAuth 谷歌云控制台
STRIPE_SECRET_KEY 付款 条纹仪表板
STRIPE_WEBHOOK_SECRET Webhooks stripe listen --forward-to localhost:5173/api/stripe/webhook
PUBLIC_STRIPE_PUBLISHABLE_KEY 付款 条纹仪表板
RESEND_API_KEY 电子邮件 重新发送仪表板

项目结构

jabstack/
├── src/
│   ├── lib/
│   │   ├── components/
│   │   │   ├── ui/           # shadcn-svelte components (dashboard)
│   │   │   ├── dashboard/    # Dashboard-specific components
│   │   │   └── marketing/    # Bits UI components (marketing)
│   │   ├── server/           # Server-only code
│   │   │   ├── db/           # Database (Drizzle)
│   │   │   ├── auth.ts       # Better Auth config
│   │   │   ├── stripe.ts     # Stripe config
│   │   │   └── email.ts      # Resend config
│   │   ├── env.ts            # Environment validation
│   │   └── utils.ts          # Utility functions
│   └── routes/
│       ├── +page.svelte      # Marketing home page
│       ├── auth/             # Auth pages
│       ├── dashboard/        # Dashboard pages
│       └── api/              # API routes
├── Dockerfile                # Bun-based Docker image
├── fly.toml                  # Fly.io configuration
└── drizzle.config.ts         # Drizzle ORM config

脚本

bun run dev          # Start development server
bun run build        # Build for production
bun run preview      # Preview production build
bun run test         # Run tests
bun run db:generate  # Generate database migrations
bun run db:migrate   # Apply migrations
bun run db:studio    # Open Drizzle Studio
bun run stripe:cli   # Forward Stripe webhooks to localhost

UI库

JabStack使用两个UI库用于不同的目的：

仪表板页面→ shadcn苗条

  • 预先设计、一致的组件
  • 位于 $lib/components/ui/
  • 用于 /dashboard/* 路线

营销页面→ Bits用户界面

  • 用于定制设计的无头图元
  • 位于 $lib/components/marketing/
  • 用于所有非仪表板路线

数据库

本地开发

使用SQLite文件(local.db)为了简单起见。

生产

用途 图尔索 （libSQL）用于边缘分布式数据库。

# Create Turso database
turso db create jabstack

# Get connection URL
turso db show jabstack --url

# Get auth token
turso db tokens create jabstack

部署

Fly.io

部署前，更新 fly.toml:

  1. app -您的Fly.io应用程序名称
  2. PUBLIC_APP_URL 在 [build.args] -您的生产URL
# Create app
fly apps create your-app-name

# Set secrets
fly secrets set DATABASE_URL=libsql://... DATABASE_AUTH_TOKEN=...
fly secrets set BETTER_AUTH_SECRET=...
fly secrets set GOOGLE_CLIENT_ID=... GOOGLE_CLIENT_SECRET=...
fly secrets set STRIPE_SECRET_KEY=... STRIPE_WEBHOOK_SECRET=...
fly secrets set RESEND_API_KEY=...

# Deploy
fly deploy

MCP服务器

JabStack包括用于人工智能辅助开发的MCP服务器配置：

  • 条纹MCP -查询条纹数据，管理产品/价格
  • MCP系统 -查询数据库，探索模式
  • shadcn MCP -通过自然语言浏览、搜索和安装shadcn-svelte组件
  • Svelte MCP -提供Svelte/SvelteKit文档上下文和静态分析，以更好地生成代码

看 .mcp/mcp.json 用于配置。

文档

许可证

麻省理工学院

相关 MCP