Skip to main content

​
Overview

Pulse Content is deployed on Cloudflare Pages, combining:
  • Static site hosting (React frontend)
  • Edge functions (Cloudflare Workers for API)
  • Global CDN (200+ data centers)
  • KV storage (rate limiting, social metadata)

​
Prerequisites

1

Cloudflare Account

Sign up at cloudflare.com if you don’t have an account
2

Wrangler CLI

Install Cloudflare’s CLI tool:
npm install -g wrangler@latest
3

Authenticate Wrangler

wrangler login
Opens browser for authentication

​
Project Configuration

​
wrangler.toml

name = "pulse-content"
compatibility_date = "2024-03-01"
pages_build_output_dir = "dist"

# KV Namespace for social approval metadata
[[kv_namespaces]]
binding = "SOCIAL_META"
id = "21b5593775dd4a75b0fcbb56de55c06d"
Note: Do NOT add account_id in wrangler.toml for Pages projects. It’s passed via GitHub Actions secrets.

​
Build Configuration

Build command: npm run build Output directory: dist/ Build steps:
  1. TypeScript compilation (tsc -p tsconfig.json)
  2. Vite bundling with code splitting
  3. Asset optimization and minification

​
Environment Variables

​
Required Secrets

# Navigate to:
# Workers & Pages > pulse-content > Settings > Environment Variables

# Add the following secrets:
SANITY_PROJECT_ID=your-project-id
SANITY_DATASET=production
SANITY_API_TOKEN=your-token-with-editor-role
ANTHROPIC_API_KEY=your-anthropic-key
OPENROUTER_API_KEY=your-openrouter-key
PINECONE_API_KEY=your-pinecone-key
PINECONE_HOST=https://your-index.svc.region.pinecone.io
KIEAI_API_KEY=your-kie-api-key
RAPIDAPI_KEY=your-rapidapi-key
JWT_SECRET=your-32-byte-hex-string
RESEND_API_KEY=re_xxx
RESEND_FROM_EMAIL="Pulse Studio <[email protected]>"
APP_BASE_URL=https://production.youvebeenheard.com
ASSEMBLYAI_API_KEY=your-assemblyai-key

​
Optional Variables

# YBH Sales Integration
YBH_SALES_API_URL=https://api.youvebeenheard.com
YBH_SALES_API_KEY=your-shared-api-key

# Backfill API Protection
YBH_BACKFILL_API_KEY=your-backfill-key

# Pulse Bot API Key
PULSE_BOT_API_KEY=your-bot-key

​
KV Namespace Setup

​
Create KV Namespace

# Create production namespace
wrangler kv:namespace create "SOCIAL_META"

# Output:
# { binding = "SOCIAL_META", id = "21b5593775dd4a75b0fcbb56de55c06d" }
Add the id to wrangler.toml: 
[[kv_namespaces]]
binding = "SOCIAL_META"
id = "21b5593775dd4a75b0fcbb56de55c06d"

​
Preview Namespace (Optional)

For testing in preview environments: 
wrangler kv:namespace create "SOCIAL_META" --preview

​
Manual Deployment

​
Build and Deploy

1

Build the project

npm run build
Creates optimized production build in dist/
2

Deploy to Cloudflare Pages

npm run deploy
# or
wrangler pages deploy dist --project-name=pulse-content
3

Verify deployment

Wrangler outputs the deployment URL:
✨ Deployment complete!
🌎 https://pulse-content.pages.dev

​
Preview Production Build Locally

Test the production build before deploying: 
npm run preview
# or
wrangler pages dev dist
Access at http://localhost:8788

​
Custom Domain Setup

1

Add custom domain

In Cloudflare dashboard:
  1. Navigate to Workers & Pages > pulse-content
  2. Go to Custom domains tab
  3. Click Set up a custom domain
2

Configure DNS

Add CNAME record pointing to pulse-content.pages.dev:
CNAME  production  pulse-content.pages.dev
3

Enable HTTPS

Cloudflare automatically provisions SSL certificate

​
Deployment Checklist

Before deploying to production:
1

Run all tests

npm run test:run
npm run typecheck
2

Test production build locally

npm run build
npm run preview
3

Verify environment variables

Check all required secrets are set in Cloudflare dashboard
4

Update APP_BASE_URL

Ensure APP_BASE_URL matches production domain
5

Deploy

npm run deploy
6

Verify deployment

  • Check production URL loads correctly
  • Test authentication flow
  • Verify API endpoints respond
  • Test content generation

​
Rollback

Cloudflare Pages keeps deployment history:
  1. Go to Workers & Pages > pulse-content > Deployments
  2. Find previous successful deployment
  3. Click ⋯ > Rollback to this deployment
Rollback only affects code, not data. Database changes are not rolled back.

​
Monitoring

​
View Logs

# Tail production logs
wrangler pages deployment tail --project-name=pulse-content

# Filter by status
wrangler pages deployment tail --status error

​
Analytics

View analytics in Cloudflare dashboard:
  • Workers & Pages > pulse-content > Analytics
  • Request volume, error rates, response times
  • Top endpoints, geographic distribution

​
Performance

​
Cloudflare Global Network

  • 200+ data centers worldwide
  • Sub-100ms latency for most users
  • Automatic caching of static assets
  • Edge computing for API endpoints

​
Build Optimizations

// vite.config.ts - Code splitting
rollupOptions: {
  output: {
    manualChunks(id) {
      if (id.includes('@tiptap')) return 'tiptap'        // ~300KB
      if (id.includes('react-dom')) return 'react-vendor' // ~130KB
      if (id.includes('@sanity')) return 'sanity'         // ~80KB
    }
  }
}

​
Troubleshooting

Run type checking locally:
npm run typecheck
Fix all errors before deploying
  • Verify secrets are set in Cloudflare dashboard
  • Redeploy after adding new secrets
  • Check variable names match code references
Check Worker logs:
wrangler pages deployment tail --status error
Common causes:
  • Missing environment variables
  • API rate limits exceeded
  • Invalid API credentials
Ensure KV namespace ID in wrangler.toml matches actual namespace:
wrangler kv:namespace list

​
Next Steps

Environment Config

Learn about environment configuration

CI/CD Pipeline

Set up automated deployment

Setup Guide

Local development setup

Architecture

System architecture overview

Build docs developers (and LLMs) love

Get started for freeTalk to us