Production Deployment

This guide covers deploying Dependify to production. The system uses three separate platforms:

Vercel - Frontend hosting with edge optimization
Render - Backend API hosting with auto-scaling
Modal - Serverless containers for parallel processing

Architecture Overview

User → Vercel (Frontend) → Render (Backend API) → Modal Containers → Groq AI
                              ↓                      ↓
                         Supabase (Real-time)   GitHub API

Prerequisites

Create accounts

Vercel - Frontend hosting
Render - Backend hosting
Modal - Serverless containers

Prepare environment variables

Have all your API keys and secrets ready. See the Environment Variables page for the complete list.

GitHub repository

Ensure your code is pushed to a GitHub repository that Vercel and Render can access.

Deploy the serverless containers first, as the backend depends on them.

Install Modal CLI

pip install modal
modal setup

Follow the prompts to authenticate with your Modal account.

Create Modal secrets

modal secret create GROQ_API_KEY
modal secret create SUPABASE_URL
modal secret create SUPABASE_KEY

Enter the values when prompted.

Deploy analysis container

From the backend/ directory:

modal deploy containers.py

This deploys the groq-read app for analyzing repository files.

Deploy refactoring container

modal deploy modal_write.py

This deploys the groq-write app for refactoring code with AI.

Verify deployment

Check your Modal dashboard to confirm both apps are deployed:

groq-read with run_script function
groq-write with process_file function

Modal apps are serverless and will auto-scale from 0 to 100+ containers based on load.

Deploy Backend to Render

The backend API runs on Render’s Python environment.

Create new Web Service

Go to Render Dashboard
Click “New +” → “Web Service”
Connect your GitHub repository
Select the repository containing Dependify

Configure build settings

Use the following settings:

Name

string

dependify-api (or your preferred name)

Region

string

Choose closest to your users (e.g., Oregon, Frankfurt)

Branch

string

master or main

Root Directory

string

Leave empty (repo root)

Environment

string

Python 3

Build Command

string

cd backend && pip install -r requirements.txt

Start Command

string

cd backend && python3 server.py

These values match the configuration in render.yaml.

Set environment variables

In the Render dashboard, add all backend environment variables:

# AI & Processing
GROQ_API_KEY=gsk_...

# Database
SUPABASE_URL=https://your-project.supabase.co
SUPABASE_KEY=eyJ... # Service role key

# GitHub
GITHUB_CLIENT_ID=Iv1...
GITHUB_CLIENT_SECRET=abc...
GITHUB_TOKEN=ghp_... # Personal access token with 'repo' scope

# Security
API_SECRET_KEY=your-random-secret

# Frontend CORS
FRONTEND_URL=https://your-app.vercel.app

# Python version
PYTHON_VERSION=3.11.0

Update FRONTEND_URL with your actual Vercel domain after deploying the frontend.

Deploy

Click “Create Web Service”. Render will:

Clone your repository
Install dependencies
Start the FastAPI server
Provide you with a URL like https://dependify-api.onrender.com

Monitor the deployment logs for any errors.

Verify deployment

Once deployed, test the API:

curl https://your-render-url.onrender.com/health

Expected response:

{
  "status": "healthy",
  "version": "2.0.0",
  "message": "Dependify API is running"
}

Deploy Frontend to Vercel

The frontend is deployed to Vercel for optimal Next.js performance.

Import project

Go to Vercel Dashboard
Click “Add New…” → “Project”
Import your GitHub repository
Select the repository containing Dependify

Configure project

Framework Preset

string

Next.js (auto-detected)

Root Directory

string

frontend

Build Command

string

pnpm build

Output Directory

string

.next (default)

Install Command

string

pnpm install

Set environment variables

Add the following environment variables in Vercel:

NEXT_PUBLIC_GITHUB_CLIENT_ID=Iv1...
NEXT_PUBLIC_API_URL=https://your-render-url.onrender.com
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJ... # Anon key, not service role

Make sure NEXT_PUBLIC_API_URL points to your Render backend URL.

Deploy

Click “Deploy”. Vercel will:

Build your Next.js app with Turbopack
Deploy to their edge network
Provide you with URLs like:
- Production: https://dependify.vercel.app
- Preview: https://dependify-git-branch.vercel.app

Update CORS configuration

After deployment, update your backend’s FRONTEND_URL on Render:

Go to Render dashboard → Your service → Environment
Update FRONTEND_URL to your Vercel production URL
Save changes and wait for redeployment

Configure GitHub OAuth

Update your GitHub OAuth app with production URLs.

Update OAuth app settings

Go to GitHub Settings → Developer settings → OAuth Apps

Edit your OAuth app

Update:

Homepage URL: https://your-app.vercel.app
Authorization callback URL: https://your-app.vercel.app/auth/callback

The callback URL must match exactly. No trailing slashes.

Test authentication flow

Visit your production site and test GitHub login to ensure OAuth is working.

Domain Configuration (Optional)

Set up custom domains for professional URLs.

Frontend Domain (Vercel)

Add custom domain

In Vercel project settings:

Go to “Settings” → “Domains”
Add your domain (e.g., dependify.yourdomain.com)
Follow DNS configuration instructions

Update DNS records

Add the following records to your DNS provider:

Type: CNAME
Name: dependify
Value: cname.vercel-dns.com

Update environment variables

Update FRONTEND_URL on Render to use your custom domain.

Backend Domain (Render)

Add custom domain

In Render service settings:

Go to “Settings” → “Custom Domains”
Add your domain (e.g., api.yourdomain.com)

Update DNS records

Add the provided CNAME record to your DNS:

Type: CNAME
Name: api
Value: your-service.onrender.com

Update frontend configuration

Update NEXT_PUBLIC_API_URL on Vercel to use your custom domain.

Monitoring and Logs

Render Logs

View backend logs in real-time:

Go to Render dashboard → Your service → “Logs”
Monitor for errors or performance issues
Set up log alerts for critical errors

Vercel Logs

View frontend logs:

Go to Vercel project → “Deployments” → Select deployment
Click “Functions” tab for serverless function logs
Use Vercel Analytics for performance monitoring

View container execution logs:

Go to Modal dashboard → Your app
Click on function name (run_script or process_file)
View recent executions and error traces

Continuous Deployment

Both Vercel and Render support automatic deployments.

Enable auto-deploy on Vercel

Automatic by default. Every push to your main branch triggers a deployment.

Enable auto-deploy on Render

In Render service settings:

Go to “Settings” → “Build & Deploy”
Enable “Auto-Deploy”
Select branch (e.g., master or main)

Preview deployments

Vercel creates preview deployments for all branches and PRs
Render can be configured for preview environments with separate services

Scaling Configuration

Render Scaling

Instance Type

string

Free: Limited hours, cold starts
Starter: Always-on, 0.5 GB RAM
Standard: Auto-scaling, 2+ GB RAM (recommended for production)

Modal auto-scales by default:

Min containers: 3 (configured in modal_write.py)
Max containers: 100 (configurable)
Timeout: 300 seconds per file (5 minutes)

To adjust scaling:

# backend/modal_write.py
@app.function(
    timeout=300,
    max_containers=100,  # Increase for larger scale
    min_containers=3,    # Keep warm for faster response
    secrets=[...]
)

Environment-Specific Secrets

Development

Use .env files locally. Never commit to git.

Production

Use platform-native secret management:

Render: Environment Variables
Vercel: Environment Variables
Modal: modal secret CLI

Security Checklist

API keys are secret

✅ All secrets stored in platform environment variables
✅ No secrets in git repository
✅ Different keys for dev and production

CORS is configured

✅ FRONTEND_URL points to production domain
✅ No wildcard CORS origins in production

Rate limiting is enabled

✅ RATE_LIMIT_PER_HOUR set appropriately
✅ Monitor rate limit violations in logs

HTTPS is enforced

✅ Vercel provides automatic HTTPS
✅ Render provides automatic HTTPS
✅ GitHub OAuth callback uses HTTPS

Troubleshooting

Backend returns 503 or times out

Render free tier has cold starts. Solutions:

Upgrade to Starter plan for always-on service
Add health check pings to keep service warm
Check Render logs for startup errors

CORS errors in production

Verify FRONTEND_URL on Render matches Vercel URL exactly
No trailing slashes in URLs
Restart Render service after changing environment variables
Check browser console for specific CORS error

Modal containers fail

GitHub OAuth fails

Verify OAuth app callback URL matches Vercel URL
Ensure GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET are correct
Test OAuth flow in incognito mode
Check Render logs for authentication errors

Next Steps

Monitor Performance

Set up monitoring with Vercel Analytics and Render metrics

Set Up Alerts

Configure email alerts for deployment failures and errors

Review Logs

Regularly check logs for errors and optimization opportunities

Scale Resources

Monitor usage and upgrade plans as traffic grows

Self-Hosting

Contributing

Production Deployment

Architecture Overview

Prerequisites

Deploy Backend to Render

Deploy Frontend to Vercel

Configure GitHub OAuth

Domain Configuration (Optional)

Frontend Domain (Vercel)

Backend Domain (Render)

Monitoring and Logs

Render Logs

Vercel Logs

Continuous Deployment

Scaling Configuration

Render Scaling

Environment-Specific Secrets

Development

Production

Security Checklist

Troubleshooting

Next Steps

Monitor Performance

Set Up Alerts

Review Logs

Scale Resources

Build docs developers (and LLMs) love

Self-Hosting

Contributing

​Architecture Overview

​Prerequisites

​Deploy Modal Containers

​Deploy Backend to Render

​Deploy Frontend to Vercel

​Configure GitHub OAuth

​Domain Configuration (Optional)

​Frontend Domain (Vercel)

​Backend Domain (Render)

​Monitoring and Logs

​Render Logs

​Vercel Logs

​Modal Logs

​Continuous Deployment

​Scaling Configuration

​Render Scaling

​Modal Scaling

​Environment-Specific Secrets

Development

Production

​Security Checklist

​Troubleshooting

​Next Steps

Monitor Performance

Set Up Alerts

Review Logs

Scale Resources

Build docs developers (and LLMs) love

Architecture Overview

Prerequisites

Deploy Modal Containers

Deploy Backend to Render

Deploy Frontend to Vercel

Configure GitHub OAuth

Domain Configuration (Optional)

Frontend Domain (Vercel)

Backend Domain (Render)

Monitoring and Logs

Render Logs

Vercel Logs

Modal Logs

Continuous Deployment

Scaling Configuration

Render Scaling

Modal Scaling

Environment-Specific Secrets

Security Checklist

Troubleshooting

Next Steps