I Deployed a React 19 SPA on Cloudflare Workers — Here’s How

🚀 Project Overview

I recently built Divines Code, a modern Single Page Application (SPA) for a digital agency.
The goal was to use the latest React ecosystem while deploying globally at the edge using Cloudflare Workers.

This post breaks down the tech stack, architecture, and deployment approach.

🧰 Tech Stack

React 19 (experimental)

Vite 6

TypeScript

Tailwind CSS v4

React Router DOM v7

Cloudflare Workers (Wrangler)

🏗️ Architecture

The app is a client-side rendered SPA.

Vite builds the app into a static dist/ folder

A Cloudflare Worker serves static assets

If a route isn’t found, the Worker falls back to index.html

React Router handles routing on the client

This allows fast edge delivery without a traditional server.

🧭 Routing Strategy

Uses HashRouter for compatibility with static hosting

Routes include:

/ Home

/about

/services

/work

/contact

A ScrollToTop component resets scroll on navigation

⚡ Performance Optimizations

Pages are lazy-loaded using React.lazy and Suspense

Custom loading spinner improves UX

Tailwind CSS keeps styles lightweight and consistent

☁️ Cloudflare Worker Setup

The Worker:

Serves assets from ./dist

Handles SPA fallback routing

Adds security headers:

X-Content-Type-Options

X-Frame-Options

Controls caching via Cache-Control

This keeps the app fast and secure at the edge.

📁 Project Structure
components/ reusable UI components
pages/ route-based pages
src/worker.ts Cloudflare Worker entry
App.tsx routing setup

🧠 Final Thoughts

This setup turned out to be:

⚡ Fast

🌍 Globally distributed

🧼 Clean to maintain

If you’re experimenting with React 19 or deploying SPAs on Cloudflare Workers, I’d love to hear your experience.