Getting Started

Quick Start

1. Clone & Install

git clone [repo] my-saas
cd my-saas
npm install

2. Set up Supabase

• Create a project at supabase.com
• Copy SQL from supabase/schema.sql → paste in SQL Editor → Run
• Copy API keys to .env.local

3. Set up Stripe

• Create products/prices in Stripe Dashboard
• Copy price IDs to config.ts
• Copy API keys to .env.local

4. Configure

• Rename .env.example → .env.local
• Edit config.ts (app name, billing plans)
• Edit /components/landing/*.tsx (your landing page content)

5. Run

npm run dev

Project Structure

├── app/
│   ├── (marketing)/    # Public pages (landing, blog, docs)
│   ├── (auth)/         # Login, signup, reset password
│   ├── (dashboard)/    # Protected user dashboard
│   └── (admin)/        # Admin panel
├── actions/            # Server Actions (data mutations)
├── components/
│   ├── landing/        # Landing page sections
│   ├── forms/          # Form components
│   └── layout/         # Header, sidebar, etc.
├── config.ts           # Central configuration (edit this!)
├── content/
│   ├── blog/           # Blog MDX files
│   ├── changelog/      # Changelog MDX files
│   └── docs/           # Documentation MDX files (you are here)
├── emails/             # React Email templates
├── lib/                # Utilities, clients, helpers
└── supabase/           # Database schema

Key Concepts

Security-First Architecture

All database queries go through Server Actions using createAdminClient() (service role key). The browser Supabase client is used only for authentication - never for data access. RLS is enabled on all tables with no policies, meaning the anon key has zero access.

Central Configuration

Everything customizable lives in config.ts. Plans, pricing, app name, theme, admin emails, i18n, and more. Edit this one file to make the template yours.

Landing Page Sections

Sections are pre-built components in /components/landing/. The main landing page imports and composes them. Customize by editing the component files directly.