A full-stack monorepo template for building SaaS applications with React 19, tRPC, and Cloudflare Workers. Type-safe from database to UI, deployable to the edge in minutes.
- Type-safe full stack — TypeScript, tRPC, and Drizzle ORM create a single type contract from database to UI
- Edge-native — Three Cloudflare Workers (web, app, api) connected via service bindings
- Auth + billing included — Better Auth with email OTP, passkey, Google OAuth, organizations, and Stripe subscriptions
- Modern React — React 19, TanStack Router (file-based), TanStack Query, Jotai, Tailwind CSS v4, shadcn/ui
- Database ready — Drizzle ORM with Neon PostgreSQL, migrations, and seed data
- Fast DX — Bun runtime, Vite, Vitest, ESLint, Prettier, and pre-configured VS Code settings
React Starter Kit is proudly supported by these amazing sponsors:
| Layer | Technologies |
|---|---|
| Runtime | Bun, Cloudflare Workers, TypeScript 5.9 |
| Frontend | React 19, TanStack Router, Tailwind CSS v4, shadcn/ui, Jotai |
| Marketing | Astro |
| Backend | Hono, tRPC, Better Auth, Stripe |
| Database | Drizzle ORM, Neon PostgreSQL |
| Tooling | Vite, Vitest, ESLint, Prettier |
├── apps/ │ ├── web/ Astro marketing site (edge router, serves static + proxies to app/api) │ ├── app/ React 19 SPA (TanStack Router, Jotai, Tailwind CSS v4) │ ├── api/ Hono + tRPC API server (Better Auth, Cloudflare Workers) │ └── email/ React Email templates ├── packages/ │ ├── ui/ shadcn/ui components (new-york style) │ ├── core/ Shared types and utilities │ └── ws-protocol/ WebSocket protocol with type-safe messaging ├── db/ Drizzle ORM schemas, migrations, and seed data ├── infra/ Terraform (Cloudflare Workers, DNS, Hyperdrive) ├── docs/ VitePress documentation └── scripts/ Build automation and dev tools Each app deploys independently to Cloudflare Workers. The web worker routes /api/* to the API worker and app routes to the app worker via service bindings.
- Bun v1.3+ (replaces Node.js and npm)
- VS Code with our recommended extensions
- React Developer Tools browser extension (recommended)
- Cloudflare account for deployment
Generate a new repository from this template, then clone it locally:
git clone https://github.com/your-username/your-project-name.git cd your-project-namebun installThis project follows Vite env conventions:
.envis committed and contains shared defaults/placeholders only (no real secrets).env.localis git-ignored and should contain your real credentials.env.localvalues override.env
cp .env .env.local # then replace placeholder values with real onesAlso check wrangler.jsonc for Worker configuration and bindings.
# Launch all apps in development mode (web, api, and app) bun dev # Or, start specific apps individually bun web:dev # Marketing site bun app:dev # Main application bun api:dev # API serverEnsure DATABASE_URL is configured in your .env.local file, then set up the schema:
bun db:push # Push schema directly (quick dev setup) bun db:seed # Seed with sample data (optional) bun db:studio # Open database GUIFor production, use bun db:migrate to apply migrations instead of db:push.
| App | URL |
|---|---|
| React app | http://localhost:5173 |
| Marketing site | http://localhost:4321 |
| API server | http://localhost:8787 |
Configure your production secrets in Cloudflare Workers:
# Required secrets bun wrangler secret put BETTER_AUTH_SECRET # Stripe billing (optional — first 4 required to enable, annual is optional) bun wrangler secret put STRIPE_SECRET_KEY bun wrangler secret put STRIPE_WEBHOOK_SECRET bun wrangler secret put STRIPE_STARTER_PRICE_ID bun wrangler secret put STRIPE_PRO_PRICE_ID bun wrangler secret put STRIPE_PRO_ANNUAL_PRICE_ID # optional # OAuth providers (as needed) bun wrangler secret put GOOGLE_CLIENT_ID bun wrangler secret put GOOGLE_CLIENT_SECRET # Email service bun wrangler secret put RESEND_API_KEY # AI features (optional) bun wrangler secret put OPENAI_API_KEYRun these commands from the target app directory or pass --config apps/<app>/wrangler.jsonc. Non-sensitive vars like RESEND_EMAIL_FROM go in wrangler.jsonc directly.
# Build packages that require compilation (order matters!) bun email:build # Build email templates first bun web:build # Build marketing site bun app:build # Build main React app # Deploy all applications bun web:deploy # Deploy marketing site bun api:deploy # Deploy API server bun app:deploy # Deploy main React appDocumentation covers auth, database, billing, deployment, and more.
Our AI assistant is trained on this codebase — ask it anything on ChatGPT or Gemini. Try these questions:
- How do I add a new tRPC endpoint?
- Help me create a database table
- How does authentication work?
- Explain the project structure
- How do I deploy to Cloudflare?
- Add a new page with routing
- How do I send emails?
See the Contributing Guide to get started. Check good first issues or join Discord for discussion.
Copyright © 2014-present Kriasoft. This source code is licensed under the MIT license found in the LICENSE file.
Made with ♥ by Konstantin Tarkus (@koistya, blog) and contributors.























