A monorepo template for Cloudflare Workers using Turborepo, with a React frontend and Hono backend.
apps/web: React frontend built with Viteapps/server: Hono API backend deployed as a Cloudflare Workerpackages/shared: Common code used by either app (TODO)
- 🖥️ Frontend App: React 19, TypeScript, Vite for fast builds & HMR
- 🌐 Backend App: Hono on Cloudflare Workers, end-to-end type-safe API with tRPC & Zod
- 🔒 Authentication: Email OTP & social OAuth using Better Auth
- 💾 Database: Cloudflare D1 via Drizzle ORM with migrations & local SQLite file for development
- 🔄 Routing & Data: Tanstack Router, Query, and Form
- 🎨 Styling: Tailwind CSS, shadcn/ui components, sonner toast notifications
- 🌍 Edge-First Deployment: Cloudflare Workers provides a global CDN and cache for fast rendering
- 🧰 Tooling: Biome for linting/formatting, pnpm for package management and monorepo workspaces
- Node.js 18 or higher
- PNPM package manager
- Wrangler CLI
- Install dependencies:
pnpm install- Start the development servers:
pnpm devThis will start both the web and server apps concurrently using Turborepo:
- Web: http://localhost:3001
- Server: http://localhost:3000
During development:
- You'll mainly keep the
webdev server loaded in your browser - The
webapp will proxy API requests from theserverapp - You can make changes to either app with HMR
cd apps/web
pnpm buildThis will build both the web app.
To deploy the unified application to Cloudflare:
cd apps/server
pnpm cf:deployThis will deploy the server app with the web app's built static assets bundled in.
- Unified Development: Run both frontend and backend together with
turbo dev - Shared Code: Add shared code in the
packages/directory - Unified Deployment: Deploy as a single Cloudflare Worker for production
- Optimized Development: Fast builds with Turborepo caching
- Update the worker name in
apps/server/wrangler.jsonc - Customize API endpoints in
apps/server/src/index.ts - Add additional pages to your frontend in
apps/web/src
MIT