Deploy To Vercel

1$# Add this button to your README
2$[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/yourusername/fabrk)
3
4$# Or use the Vercel CLI
5$npm i -g vercel
6$vercel
7
8$# Follow the prompts:
9$# 1. Link to existing project? No
10$# 2. Project name? your-app-name
11$# 3. Directory? ./
12$# 4. Override settings? No

1$# IMPORTANT: Select "Production" environment when adding these variables
2$# (You can add "Preview" environment variables later for testing)
3
4$# Core (Required)
5$DATABASE_URL="postgresql://..."  # Get from Supabase/Neon/Railway
6$NEXTAUTH_URL="https://your-domain.vercel.app"  # Your Vercel URL
7$NEXTAUTH_SECRET="paste-secret-from-openssl-command"  # From earlier step
8
9$# Email (Required if using email features)
10$RESEND_API_KEY="re_..."  # Get from https://resend.com
11$EMAIL_FROM="noreply@your-domain.com"  # Must be from verified domain
12
13$# Stripe (Required if accepting payments - USE LIVE KEYS FOR PRODUCTION)
14$STRIPE_SECRET_KEY="sk_live_..."  # LIVE key from https://dashboard.stripe.com/apikeys
15$STRIPE_WEBHOOK_SECRET="whsec_..."  # From Stripe webhook endpoint setup
16$NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="pk_live_..."  # LIVE publishable key
17$NEXT_PUBLIC_STRIPE_PRICE_FABRK="fabrk_purchase"  # Lookup key (NOT price_1234)
18
19$# Optional
20$GOOGLE_CLIENT_ID="..."  # For Google OAuth login
21$GOOGLE_CLIENT_SECRET="..."
22$NEXT_PUBLIC_APP_URL="https://your-domain.com"  # Your custom domain
23
24$# WARNING: Production uses LIVE Stripe keys (sk_live_/pk_live_)
25$# Preview environment should use TEST keys (sk_test_/pk_test_)

1// vercel.json
2{
3  "buildCommand": "prisma generate && next build",
4  "framework": "nextjs",
5  "regions": ["iad1"],
6  "headers": [
7    {
8      "source": "/(.*)",
9      "headers": [
10        { "key": "X-Content-Type-Options", "value": "nosniff" },
11        { "key": "X-Frame-Options", "value": "DENY" },
12        { "key": "Referrer-Policy", "value": "strict-origin-when-cross-origin" }
13      ]
14    }
15  ],
16  "crons": [
17    { "path": "/api/cron/cleanup", "schedule": "0 0 * * *" }
18  ]
19}

1$# 1. Go to Project Settings → Domains
2$# 2. Add your domain (e.g., myapp.com)
3$# 3. Add DNS records at your registrar:
4
5$# For apex domain (myapp.com)
6$Type: A
7$Name: @
8$Value: 76.76.21.21
9
10$# For www subdomain
11$Type: CNAME
12$Name: www
13$Value: cname.vercel-dns.com
14
15$# 4. Wait for DNS propagation (up to 48 hours)
16$# 5. SSL certificate is automatically provisioned

1$# Step 1: Open Stripe Dashboard
2$# Go to https://dashboard.stripe.com
3$# Make sure you're in LIVE mode (toggle in top left should say "Live")
4
5$# Step 2: Navigate to Webhooks
6$# Click "Developers" in top navigation
7$# Click "Webhooks" in the sidebar
8$# Click "+ Add endpoint" button
9
10$# Step 3: Enter your webhook URL
11$# Endpoint URL: https://your-domain.vercel.app/api/webhooks/stripe
12$# (Replace your-domain.vercel.app with your actual Vercel URL)
13
14$# Step 4: Select events to listen for
15$# Click "Select events"
16$# Search for and select these events:
17$#   ✓ checkout.session.completed
18$#   ✓ customer.subscription.created
19$#   ✓ customer.subscription.updated
20$#   ✓ customer.subscription.deleted
21$#   ✓ invoice.paid
22$#   ✓ invoice.payment_failed
23
24$# Step 5: Click "Add endpoint"
25
26$# Step 6: Copy the webhook signing secret
27$# After creating, click on your new webhook endpoint
28$# Find "Signing secret" section
29$# Click "Reveal" and copy the value (starts with whsec_)
30
31$# Step 7: Add to Vercel
32$# In Vercel: Settings → Environment Variables
33$# Name: STRIPE_WEBHOOK_SECRET
34$# Value: whsec_... (paste the signing secret)
35$# Environment: Production
36$# Click "Save"
37
38$# Step 8: Redeploy
39$# Go to Deployments tab → Click "..." on latest deployment → "Redeploy"
40$# This ensures the new STRIPE_WEBHOOK_SECRET is loaded

1$# What are preview deployments?
2$# When you create a pull request on GitHub, Vercel automatically:
3$# 1. Builds your code
4$# 2. Deploys to a temporary URL
5$# 3. Adds a comment to the PR with the preview link
6
7$# Preview URL format:
8$# https://your-project-git-branch-name-your-team.vercel.app
9
10$# Example:
11$# https://fabrk-git-feature-auth-acme.vercel.app
12
13$# Configure preview environment variables:
14$# 1. Go to Vercel Dashboard → Settings → Environment Variables
15$# 2. Click "Add New"
16$# 3. IMPORTANT: Select "Preview" environment (NOT Production)
17
18$# Use TEST Stripe keys for previews (never use live keys):
19$STRIPE_SECRET_KEY="sk_test_..."  # Test mode only
20$STRIPE_WEBHOOK_SECRET="whsec_test_..."  # From local stripe listen
21$NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="pk_test_..."
22
23$# Why separate keys?
24$# - Preview deployments are for testing - you don't want real charges
25$# - Use test credit cards (4242 4242 4242 4242) in preview
26$# - Production uses live keys for real payments