Type-safe β’ Serverless β’ Developer-friendly β’ Cloudflare Deployed
The ultimate combination in a template that has never been made before, in a monorepo
Features β’ Tech Stack β’ Getting Started β’ Opinionated Decisions β’ Acknowledgements β’ Why Celestial? β’ Roadmap β’ License
- π Batteries Included: Everything configured and ready to go - no setup hassle
- π Complete Platform: Everything you need in one place - powered by Cloudflare's ecosystem
- π Full Type Safety: End-to-end TypeScript with tRPC for reliable API communication
- β‘ Peak Performance: Optimized architecture from frontend to database
- π Secure by Default: Ready-to-use authentication with Better Auth
- π Data Ready: Built-in database with Drizzle ORM and D1
- π¨ Modern Interface: Latest tech with NextJS 15.2.3, React 19, and Tailwind CSS 4
- π§° Streamlined Development: Biome and Bun for a smooth coding experience
- Frontend (Next.js) and Backend (Hono) setup β
- CDN, HTTPS, custom domains, auto-scaling β
- Database with D1 and ORM with Drizzle β
- Authentication with Better Auth β
- Blob storage (coming soon with R2) β³
- Email system with Resend (β³ soon AWS SES) β
- Payment processing integration β³
- Built-in analytics through Cloudflare β
- Real-time monitoring and logs through Cloudflare β
- Development tools (CI/CD, staging environments) β
- Secure secrets management β³ (very soon)
- Next.js 15.2.3: The latest version with improved performance and features
- React 19: With enhanced server components and improved developer experience
- Tailwind CSS 4: Utility-first CSS framework with the latest optimizations
- shadcn/ui: Accessible component library built on Radix UI primitives
- tRPC Client: Type-safe API calls with Tanstack Query for data fetching
- Hono: Lightweight, fast web framework for Cloudflare Workers
- tRPC Server: Type-safe API layer integrated with Hono
- Better Auth: Comprehensive authentication and authorization
- Drizzle ORM: Type-safe database access for D1
- Cloudflare D1: Distributed SQL database built on SQLite
- TypeScript: For type safety across the entire application
- Bun: Fast JavaScript runtime and package manager
- Biome 2.0: Modern, fast linter and formatter replacing ESLint and Prettier
- Wrangler: Cloudflare's CLI for development and deployment
# Clone the repository
git clone https://github.com/celestial-rose/stack.git
# Navigate to the project
cd stack
# Install dependencies
bun install
# Create a Cloudflare Account: Sign up at cloudflare.com if you don't already have an account.
# No need to install Wrangler globally: Wrangler is included as a project dependency.
# Authenticate Wrangler: Connect Wrangler to your Cloudflare account.
bun wrangler:login
# Set up the database (very important step)
# This prepares the whole env for you by injecting the database name in important files
bun setup-db
Run the environment setup script:
bun setup-env
This script will:
- Copy all example environment files to their actual environment files if they don't exist yet
- Generate a random secret for
BETTER_AUTH_SECRET
and update it in all environment files
After running the script, you may want to update other environment variables:
- Set up a Resend account for email services and add your API key (optional: only for sending OTP for auth)
- Update domain-related variables if you're using a custom domain
# Start both API and web servers concurrently
bun dev
# Or start them individually
bun dev:api # Starts the API server on http://localhost:8787
bun dev:web # Starts the Next.js server on http://localhost:3000
The development server will:
- Start the API server using Wrangler on http://localhost:8787
- Start the Next.js web server on http://localhost:3000
- Connect to a local D1 database for development
After running the development server, you can use bun fix-db
to synchronize your database.
This is a current workaround as we couldn't manage to share the same locally simulated D1 MiniFlare database in wrangler.
# Fix database synchronization issues after running the dev server
bun fix-db
# Generate migrations after schema changes
bun generate
# Apply migrations to local development database
bun migrate
# Apply migrations to production database
bun migrate:prod
β οΈ IMPORTANT: Security Disclaimer
Never commit secrets or API keys to git. While the current setup uses wrangler.jsonc for configuration (which may contain secrets), you should never push wrangler.jsonc with secrets to production. A better approach using Wrangler CLI for secret management is being explored. In the meantime, consider leaving wrangler.jsonc in your .gitignore file if it contains sensitive information.
-
Ensure your Cloudflare account is set up and you're authenticated with Wrangler.
-
Update your production environment variables:
- Update the domain information in
packages/api/wrangler.jsonc
andpackages/web/wrangler.jsonc
- Set the correct values for
BETTER_AUTH_URL
,BETTER_AUTH_COOKIES_DOMAIN
, etc.
- Update the domain information in
-
Deploy your application:
# Deploy both API and web concurrently bun deploy:all # Or deploy them individually bun deploy:api # Deploys only the API bun deploy:web # Deploys only the web frontend
-
After deployment, your application will be available at your configured domains:
- API: https://api.your-domain.dev (or your custom domain)
- Web: https://your-domain.dev (or your custom domain)
This project uses OpenNext to deploy Next.js applications to Cloudflare. OpenNext is an open-source adapter that enables Next.js applications to run on various serverless platforms, including Cloudflare Workers.
Special thanks to Dax Raad and the SST team for creating and maintaining OpenNext, which makes it possible to deploy Next.js applications to Cloudflare's edge network with minimal configuration.
The integration is handled through the @opennextjs/cloudflare
package, which:
- Builds your Next.js application for Cloudflare Workers
- Handles asset management and routing
- Optimizes for Cloudflare's edge runtime environment
The @celestial-rose/stack is organized as a monorepo with a clear separation of concerns:
celestial-rose-stack/
βββ packages/ # Main code packages
β βββ api/ # Backend API (Hono + tRPC)
β β βββ src/
β β β βββ db/ # Database schema and connection
β β β βββ lib/ # Utility functions and helpers
β β β βββ migrations/# Database migrations
β β β βββ trpc/ # tRPC router and route handlers
β β βββ wrangler.jsonc # Cloudflare Workers configuration
β β
β βββ shared/ # Shared code between frontend and backend
β β βββ src/
β β βββ constants/ # Shared constants
β β βββ lib/ # Shared utility functions
β β βββ types/ # Shared TypeScript types
β β βββ utils/ # Shared utility functions
β β
β βββ web/ # Frontend Next.js application
β βββ public/ # Static assets
β βββ src/
β βββ app/ # Next.js app router pages
β βββ auth/ # Authentication components
β βββ components/# React components
β βββ lib/ # Frontend utility functions
β βββ styles/ # Global styles
β βββ trpc/ # tRPC client setup
β
βββ scripts/ # Utility scripts for setup and maintenance
β βββ setup-db.ts # Database setup script
β βββ setup-env.ts # Environment setup script
β
βββ biome.jsonc # Biome configuration
βββ drizzle.config.ts # Drizzle ORM configuration
βββ package.json # Root package.json with workspace config
βββ tsconfig.json # TypeScript configuration
βββ wrangler.jsonc # Root Cloudflare Workers configuration
-
API Package: Contains the Hono server with tRPC integration, database schema, and API routes. This is deployed to Cloudflare Workers.
-
Web Package: Contains the Next.js frontend application with React components, pages, and styles. This is deployed to Cloudflare Pages via OpenNext.
-
Shared Package: Contains code shared between the frontend and backend, such as types, constants, and utility functions. This ensures type safety across the entire application.
-
Scripts: Utility scripts for setting up the database and environment variables.
One of the key benefits of this monorepo structure is the end-to-end type safety:
- Database schema is defined in
packages/api/src/db/schema.ts
- This schema is used to generate TypeScript types
- These types are shared via the shared package
- The frontend can use these types for form validation and data display
- tRPC ensures that API calls are type-safe from frontend to backend
-
Wrangler Authentication Issues
Error: You need to login to Cloudflare first.
Solution: Run
bun wrangler:login
and follow the authentication flow. -
Database Connection Errors
Error: D1_ERROR: database not found
Solution: Ensure you've run
bun setup-db
and that the database ID in your wrangler.jsonc files matches. -
Environment Variable Issues
Error: Missing environment variable: BETTER_AUTH_SECRET
Solution: Check that you've copied and updated all the necessary .env files as described in the Environment Configuration section.
-
Port Conflicts
Error: Port 3000 is already in use
Solution: Stop any other services using the port or change the port in your Next.js configuration.
-
Deployment Failures
Error: Failed to deploy to Cloudflare
Solution: Check your Cloudflare account permissions and ensure your wrangler.jsonc configuration is correct.
The @celestial-rose/stack makes several opinionated technical decisions to optimize for developer experience and deployment efficiency:
- No Better Auth migrations β Full Drizzle schema: We use Drizzle for all database schema management, including auth tables, for a unified approach to database management.
- No Drizzle-kit push β Wrangler execute: Direct database operations through Wrangler for better integration with Cloudflare's ecosystem.
- Bun over npm/yarn/pnpm: Significantly faster package management and runtime execution.
- Biome over ESLint/Prettier: Single tool for linting and formatting with better performance.
- Monorepo structure: Shared types and utilities across frontend and backend for maximum type safety.
- Edge-first architecture: Built for Cloudflare Workers from the ground up, not adapted afterward.
- tRPC over REST/GraphQL: End-to-end type safety without the need for code generation or schemas.
- shadcn/ui over component libraries: Unstyled, accessible components that you own and can customize.
- D1 over other databases: Native integration with Cloudflare Workers and zero configuration needed.
Special thanks to Theo @theo for laying the foundation with the revolutionary T3 Stack. Also grateful to tRPC and Tanstack Query for building such amazing libraries that make type-safe development a joy.
No more reinventing the wheel or setting up boilerplate for every project. Everything you need is included and preconfigured, making it your one-stop solution for modern web development.
Deploy on Cloudflare's free tier and scale only when you need to. The entire stack is optimized to work within Cloudflare's free tier limits, allowing you to ship production-ready applications without upfront costs.
We've carefully selected tools that make development a joy - from Biome's lightning-fast linting to tRPC's end-to-end type safety and Bun's ultra-fast package management.
Every component of the stack is optimized for performance, from React 19 to Hono's lightweight API framework.
The modular architecture allows your applications to grow without becoming unwieldy, with clear patterns for organizing code.
The @celestial-rose/stack is continuously evolving. Here are the key features and improvements planned for future releases:
- While we already use OpenNext for Cloudflare deployment, future plans include deeper SST integration:
- Eliminate dependency on Wrangler for deployments
- Use AWS SES for more control over email delivery
- Manage all Cloudflare bindings through SST configuration
- Simplify multi-environment deployments (dev, staging, prod)
- Hono rate limiting for API protection
- Further optimizations for Cloudflare's free tier limits
- Enhanced caching strategies for static assets
- Improved local development environment
- More comprehensive documentation and examples
- CLI tool for scaffolding new features and components
- Enhanced authentication options (OAuth providers, SAML)
- Real-time capabilities with WebSockets
- File storage integration with R2
- Analytics and monitoring tools
- Emails with AWS SES
- Payment maybe ?
We welcome contributions and suggestions for the roadmap. Feel free to open issues or pull requests with your ideas!
@celestial-rose/stack is MIT licensed.