Skip to main content
Skip to content

Last updated on 4 June 2026

SaaS Starter Kit -- Next.js

A SaaS starter with authentication, billing, analytics, and a dashboard built on Next.js, PostgreSQL, and Stripe.

Quick Start

Prerequisites: Node.js 22.13.x (engine range >=22.13.0 <23), pnpm 10+, PostgreSQL 15+ (local install or Docker).

  1. Clone or extract the ZIP
  2. cp .env.example .env (PowerShell: Copy-Item .env.example .env)
  3. pnpm install
  4. Start PostgreSQL (skip if already running):
    bash
    docker compose -f docker-compose.demo.yml up -d
    
  5. pnpm db:migrate
  6. pnpm db:seed
  7. pnpm dev
  8. Visit http://localhost:3000

See INSTALLATION.md for full setup options including Docker Compose and production deployment.

Demo Credentials

  • Email: demo@example.com
  • Password: Password123!!

Admin account: admin@example.com / Password123!!

What's Included

  • 67 features across auth, billing, analytics, settings, and API management
  • 23 pages across public, auth, legal, API docs, and dashboard routes
  • Dark & light mode
  • Responsive (375px to 2560px)
  • API reference and buyer setup docs

Tech Stack

  • Framework: Next.js 16 (App Router)
  • Database: PostgreSQL via Drizzle ORM
  • Auth: JWT access tokens + httpOnly refresh cookies
  • Payments: Stripe
  • Styling: Tailwind CSS v4 + shadcn/ui

Project Structure

src/
  app/
    (auth)/           — Login, register, forgot-password, magic-link, reset-password, verify-email
    (dashboard)/      — Dashboard, analytics, billing, settings, audit-log, notifications, profile
    (marketing)/      — Pricing, terms, privacy
    api/              — REST API routes (auth, billing, analytics, webhooks, etc.)
    page.tsx          — Landing page
  components/
    charts/           — Recharts dashboard visualisations
    dashboard/        — Dashboard-specific components
    landing/          — Marketing page sections
    layout/           — Sidebar, header, theme provider
    ui/               — shadcn/ui primitives (fully editable)
  lib/
    auth/             — JWT, OAuth, session management
    db/               — Drizzle schema, migrations, seed
    email/            — Nodemailer + email templates
    demo/             — Template Empire live-demo banner helper
    site-config.ts    — Buyer-facing branding (single source of truth)
  services/           — Business logic layer
  validators/         — Zod schemas for API validation

Environment Variables

See .env.example for all required variables. For development, the defaults work out of the box.

For production, you MUST set:

  • DATABASE_URL -- PostgreSQL connection string
  • JWT_SECRET -- Auth signing secret, 32+ chars (generate with openssl rand -base64 48)
  • OAUTH_STATE_SECRET -- Separate signing secret for OAuth state param, 32+ chars (generate with openssl rand -hex 32). Required when OAuth is enabled — missing this causes a runtime crash on the first OAuth callback.
  • SMTP_HOST / SMTP_FROM -- Transactional email sender for verification, reset, and magic-link flows
  • WEBHOOK_ENCRYPTION_KEY -- 64 hex chars for encrypted webhook secrets (generate with openssl rand -hex 32)
  • NEXT_PUBLIC_APP_URL -- Your public URL (e.g. https://your-domain.com)
  • STRIPE_SECRET_KEY -- From your Stripe dashboard (when billing is enabled)
  • STRIPE_WEBHOOK_SECRET -- From Stripe webhook settings (when billing is enabled)
  • STRIPE_PRICE_ID_PRO_MONTHLY / STRIPE_PRICE_ID_PRO_ANNUAL -- Pro plan Price IDs
  • STRIPE_PRICE_ID_BUSINESS_MONTHLY / STRIPE_PRICE_ID_BUSINESS_ANNUAL -- Business plan Price IDs

Optional tunables:

  • LOG_LEVEL -- Pino level (trace/debug/info/warn/error/fatal). Default info.
  • SEED_PASSWORD -- Override the default seed-user password (Password123!!). Strongly recommended if DEMO_MODE=true on a public deployment.

Deployment

See DEPLOYMENT.md for deployment instructions covering Docker, health checks, rate limiting, token cleanup, OAuth setup, and production hardening.

Customisation

See CUSTOMIZATION.md for theming, colours, fonts, branding, legal pages, and demo-content replacement. All buyer-facing branding is centralised in src/lib/site-config.ts.

Version

  • Version: see package.json and CHANGELOG.md
  • Edition: Kiln
  • Stack: Next.js

Support

  • Documentation: Start with INSTALLATION.md, then CUSTOMIZATION.md, DEPLOYMENT.md, and COMPLIANCE.md
  • Issues: Use your repository's issue tracker

Licence

Commercial licence included. See LICENCE.md for full terms.