templateProduction2024

App Template

How a Monorepo Starter Kit Eliminated Integration Regressions Across Full-Stack Projects

View Sourcenpx foxmayn-cli app [directory]

At a Glance

Challenge

Type mismatches and integration failures between frontend, API, and database layers

Result

End-to-end type safety with shared schema contracts across the entire stack

Tech Stack

Node.jsHonooRPCTypeScriptReactViteTanstack Query / RouterPostgreSQLDrizzle ORMDockerTurborepoNodemailer

Status

production

Situation

Building full-stack web applications from scratch meant juggling separate frontend and backend repos with no shared type contracts. API changes would silently break the frontend, database schema updates wouldn't propagate to the ORM layer, and authentication logic was re-implemented differently in every project. Each new project also required re-solving the same infrastructure problems: Docker setups, email services, database migrations, and CI orchestration.

The Challenge

Create a monorepo starter kit that enforces end-to-end type safety from database to UI, with pre-configured authentication, email, and deployment infrastructure — so teams can start building features immediately instead of fighting integration issues.

What Was Built

  • Designed a Turborepo monorepo with clearly separated workspaces: apps/api (Hono backend), apps/app (React + Vite frontend), and packages/db (shared Drizzle ORM schemas and types).

  • Implemented end-to-end type safety using oRPC, ensuring that API contracts are shared at compile time — a type change in the backend immediately surfaces as a TypeScript error in the frontend.

  • Built robust authentication using Better Auth with email OTP, organization support, and admin roles, shared across the stack via the db package.

  • Configured TanStack Router for type-safe file-based routing and TanStack Query for server state management, both wired to oRPC for seamless data fetching.

  • Set up Drizzle ORM with PostgreSQL including migration tooling (generate, migrate, push) and Zod schema generation for runtime validation.

  • Added multi-stage Docker builds, Nodemailer integration for transactional emails, and shared ESLint/TypeScript configs to enforce consistency.

Results

Type safety coverage

End-to-end (DB → API → UI)

Auth system

Email OTP + Orgs + Admin (pre-built)

Integration regressions

Frequent

Caught at compile time

Codebase

81% TypeScript

Teams using this template start with a fully typed, production-ready stack where API changes are validated across the entire codebase at compile time — eliminating the class of integration bugs that previously only surfaced in staging or production.

Key Achievement

Reduced integration regressions by enforcing clear service boundaries and shared schema contracts across apps, APIs, and worker processes.

Frequently Asked Questions