Deploy Frontend to Cloudflare Pages

The frontend is built with React + Vite and produces static files (SPA). Cloudflare Pages is the recommended deployment platform.

Prerequisites

Cloudflare account
Code pushed to GitHub repository

1. Create Pages Project

Login to Cloudflare Dashboard → Workers & Pages → Create
Select Pages → Connect to Git
Select your GitHub repository

2. Build Configuration

Since the project uses a monorepo structure, pay attention to the configuration:

Setting	Value
Build command	`npm ci && npm run build --workspace=console`
Output directory	`console/dist`
Root directory	`/` (keep default)
Node.js version	`22`

Set Node.js version: Add NODE_VERSION = 22 in Environment variables.

3. Environment Variables

In Cloudflare Pages → Settings → Environment variables, add the required frontend variables:

PUBLIC_BACK_END=https://api.yourdomain.com
PUBLIC_CONSOLE_URL=https://console.yourdomain.com
...

Frontend environment variables must be prefixed with PUBLIC_ to be accessible in code. They share the same .env file with the backend.

4. Custom Domain

Pages project → Custom domains → Set up a custom domain
Enter your domain, e.g. console.yourdomain.com
Cloudflare will automatically add DNS records and provision SSL

Deployment Triggers

Push to main branch → automatic production deployment
Push to other branches → automatic preview deployment (Preview URL)

5. SPA Routing (Pages deployment only)

If deploying via Pages (not Workers), create a _redirects file in console/public/:

/*  /index.html  200

If deploying via Workers (wrangler deploy), wrangler.jsonc already includes not_found_handling: "single-page-application". This file is not needed.

Notes

The build command includes npm ci because Cloudflare Pages doesn’t automatically install monorepo dependencies
If the build fails, check the Node.js version