Skip to content

Cloudflare Deployment Guide

This guide covers deploying the SUDIGITAL platform to Cloudflare's edge network using Workers and Pages.

Prerequisites

  1. Cloudflare Account: Sign up at cloudflare.com
  2. Wrangler CLI: Already installed globally (wrangler --version)
  3. Domain Setup: Configure your domain in Cloudflare dashboard

Authentication

First, authenticate with Cloudflare:

bash
wrangler login

This will open a browser window to complete OAuth authentication.

Deployment Architecture

  • API: Cloudflare Workers (serverless backend)
  • Web: Cloudflare Pages (React application)
  • Docs: Cloudflare Pages (VitePress documentation)
  • Database: Azure PostgreSQL (external service)

Environment Setup

1. API Environment Variables

Set these variables for your API Workers deployment:

bash
# Production environment
wrangler secret put DATABASE_URL --env production
wrangler secret put JWT_SECRET --env production

# Staging environment
wrangler secret put DATABASE_URL --env staging
wrangler secret put JWT_SECRET --env staging

2. Web Environment Variables

Configure these in the Cloudflare Pages dashboard:

  • VITE_API_URL: Your API Workers URL
  • VITE_ENVIRONMENT: production or staging

Deployment Commands

Deploy All Services

bash
# Deploy all services to production
bun run deploy

# Deploy all services to staging
bun run deploy:staging

Deploy Individual Services

bash
# API to Cloudflare Workers
bun run deploy:api
bun run deploy:api:staging

# Web to Cloudflare Pages
bun run deploy:web
bun run deploy:web:staging

# Docs to Cloudflare Pages
bun run deploy:docs
bun run deploy:docs:staging

Service URLs

After deployment, your services will be available at:

Production

  • API: https://sudigital-api.yourdomain.workers.dev
  • Web: https://sudigital-web.pages.dev (custom domain: sudigital.com)
  • Docs: https://sudigital-docs.pages.dev (custom domain: docs.sudigital.com)

Staging

  • API: https://sudigital-api-staging.yourdomain.workers.dev
  • Web: https://sudigital-web-staging.pages.dev
  • Docs: https://sudigital-docs-staging.pages.dev

Custom Domains

  1. Add Domain to Cloudflare: Add your domain to Cloudflare DNS
  2. Configure Pages: Set custom domains in Cloudflare Pages dashboard
  3. SSL Certificates: Automatic SSL certificate provisioning
sudigital.com              → Web application
api.sudigital.com          → API Workers
docs.sudigital.com         → Documentation
staging.sudigital.com      → Staging web
api-staging.sudigital.com  → Staging API
docs-staging.sudigital.com → Staging docs

Database Configuration

The API connects to Azure PostgreSQL. Ensure your database:

  1. Allows Cloudflare IPs: Configure firewall rules
  2. SSL Enabled: Use SSL connections for security
  3. Connection Pooling: Optimize for serverless connections

Monitoring & Analytics

Cloudflare provides built-in analytics:

  • Workers Analytics: API performance and usage
  • Pages Analytics: Web traffic and Core Web Vitals
  • Real User Monitoring: Performance insights

Troubleshooting

Common Issues

  1. Build Failures: Check package.json scripts and dependencies
  2. Environment Variables: Verify all secrets are set correctly
  3. Database Connections: Ensure Azure PostgreSQL allows Cloudflare IPs
  4. Domain Configuration: Check DNS settings and SSL status

Debug Commands

bash
# Check deployment status
wrangler deployments list

# View logs
wrangler tail

# Test locally with Wrangler
wrangler dev

# Check Pages deployments
wrangler pages deployment list

Performance Optimization

Workers Optimization

  • Bundle size limit: 1MB
  • Cold start optimization: ESBuild configuration
  • Edge caching: Proper cache headers

Pages Optimization

  • Static asset optimization: Vite build configuration
  • Image optimization: WebP format with fallbacks
  • CDN caching: Automatic global distribution

Security

  • Environment Variables: Use Wrangler secrets for sensitive data
  • HTTPS Only: All services served over HTTPS
  • CORS Configuration: Proper CORS headers for API
  • Content Security Policy: Configure CSP headers

This deployment setup provides global edge distribution, automatic scaling, and zero-downtime deployments across the SUDIGITAL platform.