> ## Documentation Index
> Fetch the complete documentation index at: https://shipfast.so/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Deploy

> Get your app live on the internet in 10 minutes. From local to production.

<Info>
  We'll use Vercel - it's free, fast, and built for Next.js. One-click deploy.
</Info>

<Steps>
  <Step title="Push to GitHub">
    Create a new repo on [github.com](https://github.com/new), then:

    ```bash Terminal theme={null}
    git remote add origin https://github.com/yourusername/your-app.git
    git branch -M main
    git push -u origin main
    ```
  </Step>

  <Step title="Connect to Vercel">
    Time to deploy:

    1. Go to [vercel.com](https://vercel.com)
    2. Sign up with GitHub
    3. Click **Add New** → **Project**
    4. Import your repository
    5. Vercel auto-detects Next.js settings:
       * Framework: Next.js ✓
       * Build Command: `npm run build` ✓
       * Output Directory: `.next` ✓

    <Tip>
      Everything is pre-configured. Just click through.
    </Tip>
  </Step>

  <Step title="Add Environment Variables">
    **Before deploying**, add your secrets:

    Click **Environment Variables** and your your envs from .env.local.

    <Warning>
      Use **production keys**:

      * Stripe: Live mode (`pk_live_`, `sk_live_`)
      * Auth0: Production domain
      * All other services: production credentials
    </Warning>

    <Accordion title="Where do I find these keys?">
      * **Auth0**: Dashboard → Applications → Your App
      * **Supabase**: Dashboard → Settings → API
      * **Stripe**: Dashboard → Developers → API keys (toggle to Live mode)
      * **Resend**: Dashboard → API Keys
    </Accordion>
  </Step>

  <Step title="Deploy">
    Hit the **Deploy** button.

    <Info>
      Takes \~1 minutes. Grab a coffee ☕
    </Info>

    Done? Your app is live at `https://your-app.vercel.app` 🎉
  </Step>

  <Step title="Update Auth0 URLs">
    Tell Auth0 about your production URL:

    1. Go to Auth0 Dashboard → Applications → Your App
    2. Add to **Allowed Callback URLs**:

    ```
    https://your-app.vercel.app/api/auth/callback
    ```

    3. Add to **Allowed Logout URLs**:

    ```
    https://your-app.vercel.app
    ```

    4. Click **Save**

    <Note>
      Using a custom domain? Add that URL too.
    </Note>
  </Step>

  <Step title="Set Up Production Webhook">
    Stripe needs to know where to send events:

    1. In Stripe (Live mode), go to **Developers** → **Webhooks**
    2. Click **Add endpoint**
    3. **Endpoint URL**: `https://your-app.vercel.app/api/stripe/webhook`
    4. **Events to send**:
       * `checkout.session.completed`
       * `checkout.session.expired`
       * `customer.subscription.updated`
       * `customer.subscription.deleted`
       * `invoice.paid`
       * `invoice.payment_failed`
    5. Click **Add endpoint**
    6. Copy the **Signing secret** (starts with `whsec_`)
    7. Update `STRIPE_WEBHOOK_SECRET` in Vercel
    8. Redeploy: Vercel → Deployments → ⋯ → **Redeploy**
  </Step>
</Steps>

## Test Everything

Your app is live. Now test:

<Tabs>
  <Tab title="Authentication">
    * Sign up with new account
    * Log in
    * Log out
    * Check dashboard access
  </Tab>

  <Tab title="Payments">
    * Go to pricing page
    * Click "Get Started"
    * Complete checkout (use real card)
    * Verify access granted
    * Check Stripe dashboard
  </Tab>

  <Tab title="Email">
    * Sign up (should get welcome email)
    * Make payment (should get receipt)
    * Check spam folder if nothing arrives
  </Tab>

  <Tab title="Database">
    * Create/read/update data
    * Check Supabase dashboard
  </Tab>
</Tabs>

<Check>
  Everything working? Congrats, you're live! 🚀
</Check>

## Auto-Deployments

Every push to `main` auto-deploys. No manual work.

```bash Terminal theme={null}
git add .
git commit -m "Update homepage"
git push
```

Vercel builds and deploys automatically. Takes 1-2 minutes.

<Tip>
  Preview branches: Push to any other branch for a preview URL.
</Tip>

## Monitoring

Keep an eye on your app:

**Enable Analytics:**

1. Vercel Dashboard → Your Project
2. Click **Analytics** tab
3. Click **Enable Analytics**

**View Logs:**

1. Go to **Deployments**
2. Click any deployment
3. Check **Logs** tab for errors

**Set Up Alerts:**

1. Vercel → Project Settings → Notifications
2. Enable error notifications
3. Add Slack/Discord webhook (optional)

## Troubleshooting

<AccordionGroup>
  <Accordion title="App loads but features broken?">
    Check these:

    * All environment variables set in Vercel?
    * Using production keys (not test)?
    * Auth0 URLs updated with production domain?
    * Browser console showing errors?

    Debug: Vercel → Deployments → Logs
  </Accordion>

  <Accordion title="Payments not working?">
    Common issues:

    * Using test keys instead of live keys
    * Webhook URL incorrect
    * Webhook secret doesn't match
    * Stripe in test mode instead of live mode

    Check: Stripe → Developers → Webhooks → Recent deliveries
  </Accordion>

  <Accordion title="Emails not sending?">
    Verify:

    * `RESEND_API_KEY` in Vercel env vars
    * Domain verified in Resend
    * Check Resend dashboard for errors
    * Not hitting rate limits
  </Accordion>

  <Accordion title="Database queries failing?">
    Check:

    * Supabase keys correct in Vercel
    * Row Level Security policies allow access
    * Tables exist in production database
    * Connection not timing out
  </Accordion>

  <Accordion title="Build failing?">
    Common causes:

    * TypeScript errors
    * Missing dependencies
    * Environment variables needed at build time

    Fix: Check build logs in Vercel → Deployments
  </Accordion>
</AccordionGroup>

## Performance Tips

<CardGroup cols={2}>
  <Card title="Images" icon="image">
    Use Next.js `<Image>` component. Vercel optimizes automatically.
  </Card>

  <Card title="Caching" icon="clock">
    Vercel caches static assets globally. No config needed.
  </Card>

  <Card title="Edge Functions" icon="bolt">
    Your API routes run on the edge. Fast everywhere.
  </Card>

  <Card title="Analytics" icon="chart-line">
    Monitor performance in Vercel Analytics tab.
  </Card>
</CardGroup>

## Going Live Checklist

Before announcing your launch:

* All features tested in production
* Custom domain set up (optional)
* SSL certificate active (auto-generated)
* Analytics enabled
* Error monitoring set up
* Stripe in live mode
* Auth0 production URLs configured
* Webhooks working
* Email sending tested
* Database queries working
* Mobile responsive tested
* SEO metadata set (`/lib/config.ts`)
* Privacy policy live
* Terms of service live

***