saas-bootstrap

name	saas-bootstrap
description	Full SaaS project scaffolding. One prompt → Next.js 15 app with auth, billing, DB schema, UI components, API routes, email, and CI/CD. Chains bootstrap + better-auth + stripe + drizzle + nextjs + resend + cicd. Outputs a production-ready repo structure.
argument-hint	[product name] [description] [stack preferences]
layer	orchestrator
category	backend
triggers	["saas bootstrap","new saas","scaffold project","bootstrap saas","start saas","new project scaffold","full stack bootstrap","saas starter"]
linksTo	["bootstrap","better-auth","stripe","drizzle","nextjs","resend","cicd","tailwindcss","brandkit-gen"]
inputs	Product name, description (what it does), audience (B2B/B2C/developer tool), billing model (subscription/one-time/usage-based/freemium), whether multi-tenant org/team support is needed, and any stack overrides (e.g. "use Supabase").
outputs	Full Next.js 15 App Router project tree (28+ files) including: src/app/ route groups, src/lib/ (auth, db, stripe, email), src/components/, src/hooks/, src/types/, middleware.ts, .github/workflows/, .env.example, scripts/setup.sh (generated at runtime during scaffolding, not pre-existing)
preferredNextSkills	["brandkit-gen","ship","cicd"]
fallbackSkills	["bootstrap","nextjs"]
memoryReadPolicy	selective
memoryWritePolicy	always
sideEffects	Scaffolds entire project directory. Creates .env.example (never .env.local), GitHub Actions workflow files, Drizzle migration files, and scripts/setup.sh. No secrets are written to disk.

SaaS Bootstrap

One prompt → production-ready Next.js SaaS scaffold.

Default Stack

Layer	Choice	Why
Framework	Next.js 15 App Router	RSC, Server Actions, edge-ready
Auth	Better Auth	Multi-provider, sessions, orgs
Database	Neon Postgres + Drizzle ORM	Serverless, type-safe queries
Payments	Stripe (subscriptions)	Industry standard
Email	Resend + React Email	Dev-friendly, deliverable
UI	Tailwind v4 + shadcn/ui	Composable, accessible
Deploy	Vercel	Zero-config, edge
CI/CD	GitHub Actions	Automated test + deploy

Override any layer via $ARGUMENTS: e.g. "use Supabase instead of Neon"

---

Phase 0 — Discovery

Parse $ARGUMENTS for:

• productName — app name
• description — what it does
• audience — B2B / B2C / developer tool
• billing — subscription / one-time / usage-based / freemium
• multiTenant — org/team support needed? (default: yes for B2B)
• stackOverrides — any tech swaps

---

Phase 1 — Repo Structure

1. Invoke bootstrap — Scaffold the full directory tree, generate package.json with all dependencies, and set up the Next.js 15 App Router route groups.

src/
├── app/
│   ├── (auth)/
│   │   ├── login/page.tsx
│   │   ├── register/page.tsx
│   │   └── forgot-password/page.tsx
│   ├── (dashboard)/
│   │   ├── layout.tsx          # sidebar + header
│   │   ├── page.tsx            # home/overview
│   │   ├── settings/page.tsx
│   │   └── billing/page.tsx
│   ├── (marketing)/
│   │   ├── page.tsx            # landing page
│   │   └── pricing/page.tsx
│   └── api/
│       ├── auth/[...all]/route.ts   # Better Auth handler
│       └── stripe/webhook/route.ts
├── components/
│   ├── ui/                     # shadcn primitives
│   ├── auth/                   # login form, user menu
│   ├── billing/                # plan cards, usage meter
│   └── layout/                 # sidebar, header, breadcrumbs
├── lib/
│   ├── auth.ts                 # Better Auth config
│   ├── db/
│   │   ├── index.ts            # Drizzle client
│   │   └── schema.ts           # all tables
│   ├── stripe.ts               # Stripe client + helpers
│   └── email/
│       ├── client.ts           # Resend client
│       └── templates/          # React Email templates
├── hooks/                      # useSession, useBilling, etc.
├── types/                      # shared TypeScript types
└── middleware.ts               # auth route protection

---

Phase 2 — Database Schema

2. Invoke drizzle — Generate src/lib/db/schema.ts with users, organizations (if multiTenant), and subscriptions tables. Run drizzle-kit generate to create the migration.

Generate src/lib/db/schema.ts:

// Users (handled by Better Auth, extended)
export const users = pgTable("users", {
  id: text("id").primaryKey(),
  email: text("email").notNull().unique(),
  name: text("name"),
  avatarUrl: text("avatar_url"),
  stripeCustomerId: text("stripe_customer_id"),
  plan: text("plan", { enum: ["free", "pro", "enterprise"] }).default("free"),
  createdAt: timestamp("created_at").defaultNow(),
});

// Organizations (if multiTenant)
export const organizations = pgTable("organizations", {
  id: text("id").primaryKey().$defaultFn(() => createId()),
  name: text("name").notNull(),
  slug: text("slug").notNull().unique(),
  ownerId: text("owner_id").references(() => users.id),
  plan: text("plan").default("free"),
  stripeSubscriptionId: text("stripe_subscription_id"),
  createdAt: timestamp("created_at").defaultNow(),
});

// Subscriptions
export const subscriptions = pgTable("subscriptions", { ... });

Generate migration: drizzle-kit generate

---

Phase 3 — Auth

3. Invoke better-auth — Generate src/lib/auth.ts with email/password + GitHub/Google OAuth, organization plugin, and all auth UI pages (login, register, password reset) plus middleware route protection.

Generate src/lib/auth.ts:

import { betterAuth } from "better-auth";
import { drizzleAdapter } from "better-auth/adapters/drizzle";
import { organization, stripe as stripePlugin } from "better-auth/plugins";

export const auth = betterAuth({
  database: drizzleAdapter(db, { provider: "pg" }),
  emailAndPassword: { enabled: true },
  socialProviders: {
    github: { clientId: process.env.GITHUB_CLIENT_ID!, clientSecret: process.env.GITHUB_CLIENT_SECRET! },
    google: { clientId: process.env.GOOGLE_CLIENT_ID!, clientSecret: process.env.GOOGLE_CLIENT_SECRET! },
  },
  plugins: [
    organization(),
    // stripePlugin({ stripeClient: stripe, ... }) // if billing integrated
  ],
});

Generate:

• Login page with email/password + OAuth buttons
• Registration with email verification
• Password reset flow
• middleware.ts protecting /dashboard/* routes
• useSession() hook

---

Phase 4 — Billing

4. Invoke stripe — Generate src/lib/stripe.ts, the webhook handler, billing page UI, Checkout flow, and customer portal integration. Handle all four key subscription webhook events.

Generate Stripe integration:

Products & prices (in Stripe dashboard setup script):

// Free: no Stripe product
// Pro: $29/month or $290/year
// Enterprise: custom / $299/month

Generate:

• src/lib/stripe.ts — Stripe client + webhook handler
• /api/stripe/webhook/route.ts — handle subscription events
• /app/(dashboard)/billing/page.tsx — plan management UI
• Checkout flow via Stripe Checkout (not custom form)
• Customer portal link for self-service management

Webhook events to handle:

• customer.subscription.created → set user plan
• customer.subscription.updated → update plan
• customer.subscription.deleted → downgrade to free
• invoice.payment_failed → send dunning email

---

Phase 5 — Email

5. Invoke resend — Generate all 5 React Email transactional templates and wire the Resend client into src/lib/email/client.ts.

Generate React Email templates:

src/lib/email/templates/
├── WelcomeEmail.tsx        — on signup
├── VerifyEmail.tsx         — email verification
├── PasswordResetEmail.tsx  — password reset
├── PaymentFailedEmail.tsx  — dunning
└── TeamInviteEmail.tsx     — org invite

All templates: brand colors, responsive, plain-text fallback.

---

Phase 6 — UI Foundation

6. Invoke tailwindcss — Generate app/globals.css with design tokens (color, radius, shadow) and Tailwind v4 config.
7. Invoke nextjs — Generate the dashboard layout (collapsible sidebar + header + main), shadcn/ui primitive components, loading skeletons, and error boundary.

Generate:

• app/globals.css — design tokens (color, radius, shadow)
• Dashboard layout: collapsible sidebar + header + main
• components/ui/ — Button, Input, Card, Badge, Avatar, Dialog, Toast
• Loading skeletons for data-fetching routes
• Error boundary with retry button

---

Phase 7 — CI/CD

8. Invoke cicd — Generate .github/workflows/ci.yml (lint, typecheck, test, build) and deploy.yml (CI + Vercel production deploy + smoke tests + Slack notification).

Generate .github/workflows/:

# ci.yml — on every PR
- lint (biome)
- typecheck (tsc --noEmit)
- test (vitest)
- build check (next build)

# deploy.yml — on main merge
- run CI
- deploy to Vercel (production)
- run smoke tests
- notify Slack on failure

---

Phase 8 — Environment Setup

Generate .env.example:

# Database
DATABASE_URL=postgresql://...

# Auth
BETTER_AUTH_SECRET=
BETTER_AUTH_URL=http://localhost:3000
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=

# Stripe
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=
STRIPE_PRO_PRICE_ID=

# Email
RESEND_API_KEY=

# App
NEXT_PUBLIC_APP_URL=http://localhost:3000

Generate scripts/setup.sh at runtime (this file does not pre-exist — it is scaffolded during Phase 8) that:

1. Installs deps (pnpm install)
2. Creates .env.local from .env.example
3. Runs DB migrations (drizzle-kit migrate)
4. Seeds dev data (pnpm db:seed)
5. Opens browser to http://localhost:3000

---

Output Summary

✓ Repo structure     28 files scaffolded
✓ Database schema    5 tables + migrations
✓ Auth               Email + GitHub + Google OAuth
✓ Billing            Stripe subscriptions (3 tiers)
✓ Email              5 transactional templates
✓ UI                 Dashboard layout + components
✓ CI/CD              GitHub Actions (lint/test/deploy)
✓ Setup script       scripts/setup.sh

Run:
  pnpm install && ./scripts/setup.sh

---

Usage

/saas-bootstrap Plano — AI proxy with usage-based billing, B2B, team support
/saas-bootstrap InuAuth — Auth library portal, freemium, solo developers
/saas-bootstrap Meey — RE platform, subscription, B2B/B2C hybrid