Development & Deployment

This guide covers the complete development workflow for LaunchKit, from local setup to production deployment.

Local Development

Quick Start

Bun (Recommended)

# Clone and setup
git clone https://github.com/flyingwebie/launchkit-nextjs.git [YOUR_APP_NAME]
cd [YOUR_APP_NAME]
git remote remove origin

# Install and run
bun install
cp .env.example .env.local
bun dev

npm

# Clone and setup
git clone https://github.com/flyingwebie/launchkit-nextjs.git [YOUR_APP_NAME]
cd [YOUR_APP_NAME]
git remote remove origin

# Install and run
npm install
cp .env.example .env.local
npm run dev

yarn

# Clone and setup
git clone https://github.com/flyingwebie/launchkit-nextjs.git [YOUR_APP_NAME]
cd [YOUR_APP_NAME]
git remote remove origin

# Install and run
yarn install
cp .env.example .env.local
yarn dev

Your app will be available at http://localhost:3000.

Environment Configuration

Configure your .env.local file with these essential variables:

# -----------------------------------------------------------------------------
# GitHub
# -----------------------------------------------------------------------------
GITHUB_TOKEN=

# -----------------------------------------------------------------------------
# Resend
# -----------------------------------------------------------------------------
RESEND_API_KEY=

# -----------------------------------------------------------------------------
# Database URI
# -----------------------------------------------------------------------------
NEXT_PUBLIC_APP_URL=http://localhost:3000
NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_ANON_KEY=
SUPABASE_SERVICE_ROLE_KEY=

# -----------------------------------------------------------------------------
# Stripe
# -----------------------------------------------------------------------------
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_...
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...

Development Commands

# Development server with Turbopack
bun dev

# Build for production
bun build

# Preview production build
bun preview

# Linting
bun run lint

# Type checking
bun run type-check

# Create blog article
bun run create-article

# Email development
bun run email:dev

# Sync Stripe products
bun run sync-products

Testing Integrations

Stripe

# Install Stripe CLI
brew install stripe/stripe-cli/stripe

# Login and forward webhooks
stripe login
stripe listen --forward-to localhost:3000/api/webhook/stripe

# Test webhook events
stripe trigger checkout.session.completed

Email

# Start email development server
bun run email:dev

# Test email templates
curl "http://localhost:3000/api/test-email?type=purchase-confirmation&[email protected]"

Production Deployment

Vercel (Recommended)

Manual Deployment

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel --prod

Environment Variables

Add these production variables in Vercel dashboard:

# Core Configuration
NODE_ENV=production
NEXT_PUBLIC_APP_URL=https://yourdomain.com

# Supabase (Production)
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_prod_anon_key
SUPABASE_SERVICE_ROLE_KEY=your_prod_service_role_key

# Stripe (Live Keys)
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_live_...
STRIPE_SECRET_KEY=sk_live_...
STRIPE_WEBHOOK_SECRET=whsec_...

# Resend
RESEND_API_KEY=re_...

# GitHub
GITHUB_TOKEN=ghp_...

Alternative Platforms

Netlify

# netlify.toml
[build]
  command = "bun run build"
  publish = ".next"

[build.environment]
  NODE_VERSION = "18"

Railway

# railway.toml
[build]
  builder = "nixpacks"

[deploy]
  healthcheckPath = "/api/health"
  restartPolicyType = "on_failure"

Configuration Setup

Domain Configuration

1. Add custom domain in your platform dashboard
2. Configure DNS records:

   Type: CNAME
   Name: www
   Value: cname.vercel-dns.com
   
   Type: A
   Name: @
   Value: 76.76.19.61

Email Domain (Resend)

Add these DNS records for email delivery:

Type: MX
Name: @
Value: feedback-mx.resend.co
Priority: 10

Type: TXT
Name: @
Value: "v=spf1 include:_spf.resend.co ~all"

Stripe Webhooks

1. Create webhook endpoint: https://yourdomain.com/api/webhook/stripe
2. Select events:
   • checkout.session.completed
   • customer.subscription.updated
   • customer.subscription.deleted
   • invoice.paid
   • invoice.payment_failed
3. Copy webhook secret to environment variables

Performance Optimization

Build Configuration

// next.config.mjs
/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    optimizePackageImports: ['lucide-react', '@supabase/supabase-js'],
  },
  
  images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'your-supabase-project.supabase.co',
        pathname: '/storage/v1/object/public/**',
      },
    ],
  },
  
  compress: true,
};

export default nextConfig;

Database Optimization

-- Add performance indexes
CREATE INDEX CONCURRENTLY idx_profiles_has_access ON profiles(has_access) WHERE has_access = true;
CREATE INDEX CONCURRENTLY idx_products_active ON products(is_active) WHERE is_active = true;
CREATE INDEX CONCURRENTLY idx_purchases_user_product ON purchases(user_id, product_id);

Monitoring

Error Tracking

// Install Sentry
bun add @sentry/nextjs

// Configure in app/layout.tsx
import { SpeedInsights } from '@vercel/speed-insights/next';
import { Analytics } from '@vercel/analytics/react';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <SpeedInsights />
        <Analytics />
      </body>
    </html>
  );
}

Troubleshooting

Common Issues

Build Errors:

# Clear cache and rebuild
rm -rf .next node_modules
bun install
bun build

Database Connection:

# Test connection
node -e "console.log(process.env.NEXT_PUBLIC_SUPABASE_URL)"

Environment Variables:

• Client-side variables must start with NEXT_PUBLIC_
• Restart server after changing .env.local
• Check for quotes around values with special characters

Production Issues

Performance:

# Analyze bundle size
ANALYZE=true bun build

Database:

-- Check slow queries
SELECT query, mean_exec_time 
FROM pg_stat_statements 
ORDER BY mean_exec_time DESC 
LIMIT 10;

Maintenance

# Update dependencies
bun update

# Security updates
bun audit

# Database maintenance
VACUUM ANALYZE;

Next Steps

1. Test Your SaaS - Comprehensive testing guide
2. Scale Your Application - Performance optimization
3. Security Best Practices - Secure your application