Skip to main content

​
Overview

ZeroStarter is built as a modern, type-safe monorepo designed for high-performance SaaS applications. The architecture emphasizes modularity, developer experience, and production readiness.
ZeroStarter is currently in Release Candidate (RC) status. All implemented features are stable and production-ready, with new features and integrations being added continuously.

​
Architecture Diagram

The following diagram illustrates how the different components interact: 
┌─────────────────────────────────────────────────────────────┐
│                         Frontend Layer                      │
│                                                             │
│  ┌─────────────────────────────────────────────────────┐  │
│  │           Next.js 16 (web/next/)                    │  │
│  │  • React 19 with Server Components                  │  │
│  │  • Tailwind CSS + Shadcn UI                         │  │
│  │  • TanStack Query for data fetching                 │  │
│  │  • Better Auth client                               │  │
│  │  • Type-safe Hono RPC client                        │  │
│  └─────────────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────────┘
                              │
                              │ Type-safe RPC
                              │ (Hono Client)
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                         Backend Layer                       │
│                                                             │
│  ┌─────────────────────────────────────────────────────┐  │
│  │            Hono API (api/hono/)                     │  │
│  │  • Hono web framework                               │  │
│  │  • Better Auth server                               │  │
│  │  • Rate limiting & middleware                       │  │
│  │  • OpenAPI + Scalar documentation                   │  │
│  │  • Type-safe routes (AppType export)               │  │
│  └─────────────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────────┘
                              │
                              │ Drizzle ORM
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                       Database Layer                        │
│                                                             │
│  ┌─────────────────────────────────────────────────────┐  │
│  │              PostgreSQL                             │  │
│  │  • Type-safe schema (packages/db/)                  │  │
│  │  • Drizzle ORM migrations                           │  │
│  │  • Drizzle Studio for management                    │  │
│  └─────────────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────┐
│                      Shared Packages                        │
│                                                             │
│  • @packages/auth   - Better Auth configuration            │
│  • @packages/db     - Database schema & client             │
│  • @packages/env    - Type-safe environment variables      │
│  • @packages/tsconfig - Shared TypeScript config           │
└─────────────────────────────────────────────────────────────┘

​
Core Technology Stack

​
Runtime & Build System

Why Bun?Bun is an all-in-one JavaScript runtime that replaces Node.js, package managers, and bundlers.Key Benefits:
  • Blazing Fast: 3-4x faster than npm/yarn for installs
  • Built-in Tools: Package manager, test runner, and bundler included
  • Native TypeScript: Run .ts files directly without transpilation
  • Drop-in Replacement: Compatible with Node.js APIs
  • Better DX: Faster development cycles and builds
Version: Bun 1.3.7+
Why Turborepo?Turborepo orchestrates builds and development across the monorepo.Key Benefits:
  • Incremental Builds: Only rebuilds what changed
  • Remote Caching: Share build artifacts across team
  • Parallel Execution: Runs tasks across packages concurrently
  • Task Pipelines: Define dependencies between build steps
  • Better DX: Beautiful TUI for development mode
Configuration: turbo.json at project root

​
Frontend Stack

Why Next.js?Next.js provides the foundation for the frontend application.Key Features:
  • App Router: Modern routing with React Server Components
  • Server Components: Automatic code splitting and SSR
  • API Routes: Built-in API endpoints (though we use Hono for main API)
  • Image Optimization: Automatic image optimization
  • TypeScript: First-class TypeScript support
Location: web/next/
Why Tailwind?Tailwind CSS provides utility-first CSS for rapid UI development.Key Benefits:
  • Utility Classes: Build UIs without leaving HTML
  • PostCSS Integration: Tailwind CSS v4 with @tailwindcss/postcss
  • JIT Mode: Generate styles on-demand
  • Customizable: Extend with custom colors, spacing, etc.
  • Tree Shaking: Only includes used styles in production
Version: Tailwind CSS 4.2+
Why Shadcn UI?Shadcn UI provides beautifully designed, accessible components.Key Benefits:
  • Copy-Paste Components: Own the code, not npm dependencies
  • Radix UI Primitives: Built on accessible, unstyled primitives
  • Customizable: Modify components to fit your needs
  • TypeScript: Fully typed components
  • Dark Mode: Built-in dark mode support
Update Command: bun run shadcn:update
Why TanStack Query?TanStack Query manages server state in React applications.Key Benefits:
  • Automatic Caching: Smart caching with background updates
  • Optimistic Updates: Update UI before server responds
  • Request Deduplication: Avoids duplicate requests
  • Pagination & Infinite Queries: Built-in support
  • DevTools: Excellent debugging experience
Version: TanStack Query v5

​
Backend Stack

Why Hono?Hono is an ultrafast web framework for edge runtimes.Key Benefits:
  • Blazing Fast: Optimized for Bun runtime
  • Type-Safe RPC: End-to-end type safety with frontend
  • Middleware: Built-in and custom middleware support
  • OpenAPI: Auto-generate API documentation
  • Edge Ready: Deploy anywhere (Vercel, Cloudflare, etc.)
Location: api/hono/
Why Hono RPC?Hono RPC provides end-to-end type safety between frontend and backend.How It Works:
  1. Backend: Export route types as AppType from api/hono/src/index.ts
  2. Frontend: Import AppType in web/next/src/lib/api/client.ts
  3. Type Safety: Full TypeScript inference for requests and responses
// Fully typed - no code generation needed!
const res = await apiClient.health.$get()
const data = await res.json() // Type inferred automatically
Learn More: Type-Safe API Guide
Why Scalar?Scalar generates beautiful, interactive API documentation.Key Benefits:
  • Auto-Generated: From OpenAPI specification
  • Interactive: Test API endpoints directly in browser
  • Beautiful UI: Modern, developer-friendly interface
  • Zero Config: Works out of the box
Access: http://localhost:4000/api/docs

​
Database & ORM

Why PostgreSQL?PostgreSQL is a powerful, open-source relational database.Key Benefits:
  • ACID Compliant: Reliable transactions
  • Rich Data Types: JSON, arrays, and more
  • Extensible: Custom functions and extensions
  • Mature Ecosystem: Wide tooling support
  • Scalable: From prototype to production
Quick Setup: bunx pglaunch -k
Why Drizzle ORM?Drizzle ORM provides type-safe database access.Key Benefits:
  • Type Safety: Fully typed queries and results
  • SQL-Like: Familiar query syntax for SQL developers
  • Lightweight: Minimal runtime overhead
  • Migrations: Built-in migration system with Drizzle Kit
  • Drizzle Studio: Visual database explorer
Location: packages/db/Commands:
  • bun run db:generate - Generate migrations
  • bun run db:migrate - Apply migrations
  • bun run db:studio - Open Drizzle Studio

​
Authentication

Why Better Auth?Better Auth is a modern authentication framework for TypeScript.Key Features:
  • OAuth Providers: GitHub, Google, and more
  • Session Management: Secure, typed sessions
  • Type-Safe: Full TypeScript support
  • Database Agnostic: Works with any database via adapters
  • Customizable: Extend with custom logic
Location: packages/auth/Supported Providers:
  • GitHub OAuth
  • Google OAuth
  • Extensible for more providers

​
Developer Tools

Why Oxc Tools?Oxlint and Oxfmt are Rust-based tools for faster linting and formatting.Key Benefits:
  • Extremely Fast: Written in Rust, 50-100x faster than ESLint
  • Drop-in Replacement: Compatible with existing configs
  • Zero Config: Works out of the box
  • Consistent: Same formatting across team
Commands:
  • bun run lint - Run Oxlint
  • bun run format - Format with Oxfmt
  • bun run format:check - Check formatting
Why tsdown?tsdown bundles TypeScript packages efficiently.Key Benefits:
  • Fast: Optimized for Bun
  • Type Declarations: Auto-generates .d.ts files
  • Zero Config: Works with sensible defaults
  • Watch Mode: Rebuilds on file changes
Used in: All packages/* workspaces
Why Zod?Zod provides TypeScript-first schema validation.Key Benefits:
  • Type Inference: Generate TypeScript types from schemas
  • Runtime Validation: Validate data at runtime
  • Composable: Build complex schemas from simple ones
  • Error Messages: Detailed validation errors
Used For:
  • Environment variable validation (packages/env/)
  • API request/response validation
  • Form validation

​
Analytics & Monitoring

Why PostHog?PostHog provides product analytics, feature flags, and session recordings.Key Features:
  • Event Tracking: Track user actions and events
  • Feature Flags: Roll out features gradually
  • Session Recordings: Watch user sessions
  • Funnels & Insights: Analyze user behavior
  • Self-Hosted Option: Keep data private
Configuration: Optional via environment variables
NEXT_PUBLIC_POSTHOG_HOST=https://eu.i.posthog.com
NEXT_PUBLIC_POSTHOG_KEY=your_key

​
Documentation

Why Fumadocs?Fumadocs powers the documentation site with MDX support.Key Features:
  • MDX Support: Write docs with React components
  • Search: Built-in search functionality
  • Auto-Generated: Creates llms.txt for AI assistants
  • Beautiful UI: Modern documentation design
  • TypeScript: Full type safety
Location: web/next/content/docs/

​
Design Principles

​
Type Safety First

Every layer of ZeroStarter is designed with type safety in mind:
  • Database to API: Drizzle ORM ensures type-safe queries
  • API to Frontend: Hono RPC provides end-to-end type safety
  • Environment Variables: Zod validation with TypeScript inference
  • Forms: Type-safe form validation with React Hook Form + Zod

​
Modular Architecture

The monorepo is organized into independent, reusable packages:
  • Shared Packages: @packages/* can be used across frontend and backend
  • Clean Separation: Each workspace has clear responsibilities
  • Composable: Mix and match packages as needed
  • Independent: Packages can be extracted or swapped

​
Developer Experience

Optimized for productivity and happiness:
  • Fast Feedback: Hot reload, fast builds, instant type checking
  • Clear Errors: Helpful error messages at every layer
  • Great Tools: Drizzle Studio, Scalar docs, PostHog insights
  • Documented: Every pattern and decision is documented

​
Production Ready

Built for real-world applications:
  • Performance: Optimized with Bun, Hono, and React Server Components
  • Security: Rate limiting, CORS, authentication built-in
  • Scalability: Monorepo architecture supports growth
  • Deploy Ready: Docker and Vercel configurations included

​
Next Steps

Project Structure

Explore the monorepo organization in detail

Type-Safe API

Learn how to use the Hono RPC client

Database

Work with Drizzle ORM and PostgreSQL

Deployment

Deploy to production