🚀 Supabase + Stripe SaaS Quickstart

Build a complete SaaS application with authentication, database, and payments in under 10 minutes using boiler.plate's pre-configured Supabase + Stripe stack.

Prerequisites

• Supabase account (free tier works)
• Stripe account (test mode)
• Node.js 18+ and pnpm installed
• Git for version control

Step 1: Select the Preset

Navigate to boiler.plate and select the "Supabase + Stripe SaaS" preset from the Quick Start Stacks section.

Step 2: Configure Project Details

Enter your project name, description, and target directory. The UI will automatically select the required modules.

Step 3: Set Up Supabase Environment

The auth-supabase configuration modal will open. You'll need to provide your Supabase project credentials.

Step 4: Configure Stripe Settings

Configure your Stripe test keys and webhook settings in the stripe-core configuration modal.

Step 5: Generate Your Project

Click "Create" to generate your complete SaaS boilerplate. The UI will show you exactly what files will be created.

Step 6: Set Up Environment Variables

Copy the generated .env.example and fill in your actual credentials:

# SUPABASE
NEXT_PUBLIC_SUPABASE_URL=your_supabase_project_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
SUPABASE_SERVICE_ROLE=your_supabase_service_role_key

# STRIPE (test mode)
STRIPE_SECRET_KEY=sk_test_your_stripe_secret_key
STRIPE_WEBHOOK_SECRET=whsec_your_webhook_secret
NEXT_PUBLIC_APP_URL=http://localhost:3000
PRICE_LIFETIME=price_your_lifetime_price_id
PRICE_SUB_MONTH=price_your_monthly_subscription_price_id

# REDIS (if entitlements module)
REDIS_URL=redis://localhost:6379

Step 7: Install Dependencies & Start Development

Navigate to your project directory and install dependencies:

cd your-project-name
pnpm install
pnpm dev

Step 8: Test Your Application

Verify that your application is running correctly:

# Test the pricing page
curl -I http://localhost:3000/pricing

# Should return: HTTP/1.1 200 OK

Step 9: Test Stripe Integration

Test the complete payment flow using Stripe test cards:

1. Visit http://localhost:3000/pricing
2. Click "Subscribe" on any plan
3. Use test card: 4242 4242 4242 4242
4. Complete the checkout flow
5. Test the billing portal at http://localhost:3000/billing

Step 10: Deploy to Vercel

Deploy your application to Vercel with proper environment variables:

1. Push your code to GitHub
2. Connect your repository to Vercel
3. Add all environment variables in Vercel dashboard
4. Update NEXT_PUBLIC_APP_URL to your production domain
5. Configure Stripe webhook endpoint for production

Verification Checklist

Next Steps

Now that your basic SaaS is running, explore these modules to add more features:

• Auth Module - Customize authentication flows
• Stripe Modules - Add more payment features
• Analytics Module - Track user behavior
• Emails Module - Send transactional emails