DEV Community

Cover image for Orion Kit: Production-Ready TypeScript Monorepo for Modern SaaS Applications
Martin Persson
Martin Persson

Posted on

Orion Kit: Production-Ready TypeScript Monorepo for Modern SaaS Applications

#saas #typescript #nextjs #boilerplate

TL;DR – Open-source monorepo template with Next.js 15, JWT auth, Stripe payments, PostgreSQL (Neon), Drizzle,complete documentation and much more. Designed to make the initial setup overhead for TypeScript SaaS projects simple while keeping strict end-to-end types.

Links

What This Is

Orion Kit is a TypeScript monorepo template that includes the infrastructure most SaaS applications need: user authentication, payment processing, database with migrations, transactional emails, analytics, and background jobs. These systems are pre-configured and integrated, but the template also makes it easy to add features like AI integration, file uploads, i18n, CMS, real-time updates, or rate limiting.

The architecture demonstrates type-safe full-stack development where database schemas automatically generate TypeScript types used throughout your API and frontend—eliminating type mismatches and keeping your codebase in sync as you evolve your data model.

What’s Inside

Applications (4)

  • Marketing site – /apps/web (port 3000): Landing page & public marketing.
  • Dashboard – /apps/app (port 3001): Authenticated UI with tasks, billing, basic analytics.
  • API – /apps/api (port 3002): REST endpoints with auth middleware and Stripe webhooks.
  • Documentation – /apps/docs (port 3004): Astro Starlight docs.

Shared Packages (9)

  • @workspace/auth – JWT authentication & user management.
  • @workspace/database – Drizzle ORM with Neon PostgreSQL (migrations & schema).
  • @workspace/types – Shared TypeScript types across apps & packages.
  • @workspace/ui – shadcn/ui component library.
  • @workspace/payment – Stripe subscriptions & Billing Portal utilities.
  • @workspace/email – Resend integration with React Email templates.
  • @workspace/analytics – PostHog event tracking helpers.
  • @workspace/observability – Axiom logging & error reporting.
  • @workspace/jobs – Trigger.dev background job processing.

Technical Architecture

Type Safety Flow

Single Source of Truth: the database schema.

  • Define tables & columns in Drizzle.
  • Drizzle generates TypeScript types from PostgreSQL.
  • Those types flow through @workspace/database → API validation (Zod) → frontend forms (React Hook Form + Zod) → UI components.

Result: If you rename a DB column, TypeScript flags every affected usage across the monorepo. No silent mismatches between layers.

PostgreSQL (Neon) → Drizzle schema → Drizzle types → API handlers → Zod validators → React forms/components
Enter fullscreen mode Exit fullscreen mode

Monorepo Structure

Orchestrated by Turborepo. Apps import from shared packages using the workspace protocol (@workspace/*) for code reuse with clear boundaries.

.
├─ apps/
│  ├─ web/         # marketing (Next.js 15)
│  ├─ app/         # dashboard (Next.js 15)
│  ├─ api/         # REST API (Next.js 15 / Route Handlers)
│  ├─ studio/      # Drizzle Studio to interact with the database
│  └─ docs/        # documentation (Astro Starlight)
├─ packages/
│  ├─ auth/
│  ├─ database/
│  ├─ types/
│  ├─ ui/
│  ├─ payment/
│  ├─ email/
│  ├─ analytics/
│  ├─ observability/
│  └─ jobs/
└─ turbo.json / package.json / tsconfig.json / .env* / etc.
Enter fullscreen mode Exit fullscreen mode

Integrated Features

Authentication

  • Custom JWT implementation with protected routes.
  • Sessions managed server-side; token stored client-side (e.g., localStorage).
  • Middleware auto-protects authenticated routes.

Payments

  • Stripe Checkout for subscriptions.
  • Webhook handlers for payment lifecycle events.
  • Billing Portal integration out of the box.
  • Centralized pricing configuration & subscription helpers in @workspace/payment.

Database

  • Serverless PostgreSQL via Neon.
  • Drizzle ORM for type-safe queries & migrations (version controlled).
  • Comes with a basic DB Studio config for quick inspection.

Email

  • Resend for transactional email.
  • React Email templates with a welcome sequence and extensible template system.

Testing

  • Vitest for unit tests.
  • Playwright for end-to-end tests (auth flow & critical navigation paths).

Observability & Analytics

  • PostHog for product analytics (SDK wired to middleware & app events).
  • Axiom for logs & error reporting (server + edge).

Background Jobs

  • Trigger.dev orchestrates background tasks from @workspace/jobs.

Development Workflow

Run all apps concurrently with hot reload; changes in packages are instantly reflected in dependents thanks to Turborepo + workspace linking.

App Path Port
Marketing /apps/web 3000
Dashboard /apps/app 3001
API /apps/api 3002
Docs /apps/docs 3004

Required Services (all have generous free tiers)

  • Neon – PostgreSQL hosting
  • Stripe – Payments
  • Resend – Email delivery
  • PostHog – Analytics
  • Axiom – Logging & monitoring

Stripe CLI to test payments locally

Configuration examples for each live in the docs and .env.example files.

Getting Started

Prerequisites

  • Node 20+
  • pnpm (recommended)
  • Accounts/keys for: Neon, Stripe, Resend, PostHog, Axiom

1) Clone & install 

pnpm i
Enter fullscreen mode Exit fullscreen mode

2) Environment variables

Copy the example and fill in values:

cp .env.example .env
cp apps/api/.env.example apps/api/.env
cp apps/app/.env.example apps/app/.env
cp apps/web/.env.example apps/web/.env
cp apps/docs/.env.example apps/docs/.env
Enter fullscreen mode Exit fullscreen mode

See /apps/docs for service-by-service setup. Stripe requires adding webhook secrets; Neon requires a database URL; etc.

3) Database 

pnpm db:generate   # drizzle generate
pnpm db:migrate    # run migrations
Enter fullscreen mode Exit fullscreen mode

4) Dev servers 

pnpm dev           # starts web (3000), app (3001), api (3002), docs (3004)
Enter fullscreen mode Exit fullscreen mode

5) Tests 

pnpm test          # unit (Vitest)
pnpm test:e2e      # e2e (Playwright)
Enter fullscreen mode Exit fullscreen mode

Documentation

Built with Astro Starlight (Markdown, searchable) at /apps/docs.

Coverage:

  • Quick start
  • Architectural decisions & data flow
  • Package API references
  • Integration guides (AI, CMS, i18n, file uploads, etc.)
  • Testing strategies
  • Deployment instructions

Use Cases

Great as a starting point for:

  • SaaS with auth & subscriptions
  • Internal tools with role-based access & analytics
  • MVPs where infra setup must be minimal
  • Learning resource for modern TypeScript architecture

Licensed under MIT for unrestricted use & modification.

Deployment (Overview)

  • Web/App/API → Vercel (or similar). Route Handlers power REST & webhooks.
  • Database → Neon (serverless Postgres).
  • Stripe → Set live keys & webhook endpoints.
  • Resend → Configure domain & production API key.
  • PostHog/Axiom → Set environment keys; verify event/log flow.

Detailed, step-by-step instructions are in the docs.

Contributing

Contributions & feedback are welcome! Feel free to open Issues and PRs. Please include:

  • Clear description of the change
  • Screenshots (for UI)
  • Tests where applicable

Build something you’re proud of. Launch it into orbit. 🚀

Top comments (0)