canvas-website/DEPLOYMENT_SUMMARY.md

Deployment Summary

Current Setup

✅ Frontend: Cloudflare Pages

• Deployment: Automatic on push to main branch
• Build: npm run build
• Output: dist/
• Configuration: Set in Cloudflare Pages dashboard
• Environment Variables: Set in Cloudflare Pages dashboard (VITE_* variables)

✅ Worker: GitHub Actions

• Production: Deploys on push to main branch → uses wrangler.toml
• Dev: Deploys on push to automerge/** branches → uses wrangler.dev.toml
• Manual: Can trigger via GitHub Actions UI with environment selection

❌ Vercel: Can be disabled

• Frontend is now on Cloudflare Pages
• Worker was never on Vercel
• You can safely disconnect/delete the Vercel project

Why GitHub Actions for Workers?

GitHub Actions is better than Cloudflare's automatic worker deployments because:

1. ✅ More Control: You can add tests, checks, conditional logic
2. ✅ Better Branching: Different configs for dev vs prod
3. ✅ Manual Triggers: Deploy specific environments on demand
4. ✅ No Conflicts: Single source of truth (no competing deployments)
5. ✅ Version Tracking: All deployments tracked in GitHub
6. ✅ Flexibility: Can add deployment gates, notifications, etc.

Cloudflare's automatic worker deployments:

• ❌ Less control over the process
• ❌ Can conflict with GitHub Actions
• ❌ Harder to debug when issues occur
• ❌ Limited branching/environment support

Environment Switching

For Local Development

You can switch between dev and prod workers locally using:

# Switch to production worker
./switch-worker-env.sh production

# Switch to dev worker  
./switch-worker-env.sh dev

# Switch to local worker (requires local worker running)
./switch-worker-env.sh local

This updates .env.local with VITE_WORKER_ENV=production or VITE_WORKER_ENV=dev.

Default: Now set to production (changed from dev)

For Cloudflare Pages

Set environment variables in Cloudflare Pages dashboard:

• Production: VITE_WORKER_ENV=production
• Preview: VITE_WORKER_ENV=dev (for testing)

Deployment Workflow

Frontend (Cloudflare Pages)

1. Push to main → Auto-deploys to production
2. Create PR → Auto-deploys to preview environment
3. Environment variables set in Cloudflare dashboard

Worker (GitHub Actions)

1. Production: Push to main → Auto-deploys to production worker
2. Dev: Push to automerge/** branch → Auto-deploys to dev worker
3. Manual: Go to Actions → "Deploy Worker" → Run workflow → Choose environment

Testing Both Environments

Local Testing

# Test with production worker
./switch-worker-env.sh production
npm run dev

# Test with dev worker
./switch-worker-env.sh dev
npm run dev

Remote Testing

• Production: Visit your production Cloudflare Pages URL
• Dev: Visit your dev worker URL directly or use preview deployment

Next Steps

1. ✅ Disable Vercel: Go to Vercel dashboard → Disconnect repository
2. ✅ Verify Cloudflare Pages: Ensure it's deploying correctly
3. ✅ Test Worker Deployments: Push to main and verify production worker updates
4. ✅ Test Dev Worker: Push to automerge/test branch and verify dev worker updates