Privacy-focused, open-source web analytics platform and Google Analytics alternative built with Next.js, React, and PostgreSQL.
- Language
- TypeScript
- Database
- PostgreSQL
- Hosting
- Docker
- License
- MIT
- Running for
- 4 years
- Team
- Solo
Why this architecture
Umami provides cookie-free, GDPR-compliant website metrics and session replays with simple self-hosting and zero data monetization.
Tech stack by layer
8 technologies · audited Sep 17, 2026- TypeScriptType-safe codebase powering tracker compilation, collection APIs, and MCP servers
- PrismaORM client managing database models, migrations, and read replicas for analytics entities
- PostgreSQLPrimary relational persistence layer storing accounts, websites, events, and sessions
- ClickHouseHigh-volume columnar analytical store used in enterprise deployments for event queries
- RedisIn-memory cache for visitor sessions, IP anonymization salts, and rate limiting
- DockerProduction alpine container images packaging Next.js standalone builds and database scripts
Umami architecture diagram
Open SVGDiagram as text
- Tracked sites (tracker script) → Umami app (Next.js App Router): collect events
- Dashboard (React) → Umami app (Next.js App Router): REST
- Umami app (Next.js App Router) → PostgreSQL (Prisma): Prisma
- Umami app (Next.js App Router) → ClickHouse (high-volume events): event queries
- Umami app (Next.js App Router) → Redis (sessions · salts): cache
Key architectural decisions
4 decisions- 01
Dual Persistence Support for PostgreSQL and ClickHouse
Decouples relational query models through Prisma while offering high-throughput columnar event ingestion via native ClickHouse drivers for large deployments.
- 02
Standalone Rollup Build for Privacy-First Tracker Script
Compiles a lightweight, zero-dependency tracking snippet (under 3KB) using Rollup that collects analytics without setting persistent user cookies.
- 03
Built-in Model Context Protocol Server
Exposes analytics stats, real-time traffic queries, and metric aggregations to AI agents through a dedicated MCP server package (@umami/mcp).
- 04
Session Replay Integration with rrweb
Incorporates a privacy-conscious DOM session recorder in src/recorder using rrweb to capture user navigation funnels and playback sessions.
How Umami is built
How Umami is structured
Umami is architected as a full-stack Next.js monorepo:
src/app: The Next.js 16 App Router application organizing web dashboard pages, settings, and public shareable analytics views.src/tracker: The standalone client-side tracking script compiled separately via Rollup (rollup.tracker.config.js) to provide an ultra-lightweight, cookie-free telemetry beacon.src/recorder: An integrated session replay recorder leveragingrrwebto capture user journey interactions while masking sensitive inputs.src/queries: Abstract database query interfaces with implementations for both PostgreSQL (via Prisma) and ClickHouse (@clickhouse/client).packages/api-client: An auto-generated TypeScript SDK communicating with Umami REST endpoints.packages/mcp: A Model Context Protocol server (@modelcontextprotocol/server) providing conversational AI assistants with direct access to live traffic and event queries.
Frontend
The frontend interface in src/app delivers a modern, clean analytics dashboard:
- Interactive Visualizations: Built with Chart.js (
chart.js,chartjs-adapter-date-fns) for timeseries traffic charts andreact-simple-mapsfor geographical visitor origin maps. - Component Architecture: Uses React 19, Lucide React icons, and custom components styled with Tailwind CSS and Framer Motion (
motion). - Data Hydration: Queries analytics data asynchronously using TanStack Query (
@tanstack/react-query) and manages client settings with Zustand. - Internationalization: Full multi-language localization managed through
next-intl.
Backend & APIs
The backend leverages Next.js Route Handlers and Node.js server scripts:
- Telemetry Ingestion: The
/api/sendendpoint ingests high-frequency beacon payloads, parses user agents (ua-parser-js), checks bot patterns (isbot), resolves IP geolocations via MaxMind GeoIP databases, and hashes session IDs without storing raw IPs. - Reporting APIs: REST endpoints expose aggregated metrics for pageviews, unique visitors, referral channels, browser versions, operating systems, and custom conversion events.
- MCP Server: Enables AI coding tools like Claude or Cursor to inspect active visitors and funnel drop-offs using standardized tool schemas.
Data & persistence
Umami supports multiple data storage configurations to accommodate diverse scaling requirements:
- PostgreSQL: The primary transactional store using Prisma ORM (
@prisma/client,@prisma/adapter-pg) with support for read replicas (@prisma/extension-read-replicas). - ClickHouse: An optional columnar storage engine for enterprise installations processing millions of pageviews per day.
- Kafka & Redis: Pluggable Kafka message queues (
kafkajs) buffer bursts of incoming analytics events, while Redis manages caching and IP salt rotations.
Realtime / collaboration
Umami features a realtime dashboard view displaying live concurrent visitors:
- Web clients poll lightweight heartbeat and realtime endpoints to track active page sessions and recent URL clicks.
- Dashboards can be made public via unique shareable tokens without requiring login credentials.
Build, test & deploy
The build pipeline is configured using pnpm and modern tooling:
- Tracker scripts are bundled with Rollup, minified with Terser, and versioned into
public/script.js. - Next.js is compiled using Turbopack into a standalone deployment bundle.
- Code quality is checked using Biome (
biome lint,biome format). - Testing includes Vitest unit tests, Playwright API integration tests (
playwright.api.config.ts), and end-to-end browser flows. - Multi-stage Docker images (
Dockerfile) package the application on Alpine Linux for lightweight production deployments.
Self-hosting notes
Umami is one of the simplest analytics solutions to self-host:
- Launch via Docker Compose with
docker compose up -d, which starts the Umami web application container connected to PostgreSQL. - Setting
DATABASE_URLconnects to existing managed database services (Supabase, Neon, AWS RDS). - Optional environment variables configure reverse proxy headers (
CLIENT_IP_HEADER), two-factor authentication secrets (TWO_FACTOR_ENCRYPTION_KEY), and MCP tool activation (MCP_ENABLED=1).
What to copy (and what not to)
What to copy:
- Packaging the client-side tracking script as an independent Rollup build separate from the Next.js bundle to maintain an ultra-fast sub-3KB footprint.
- Cookie-free session hashing that rotates daily salts to comply with GDPR and CCPA without user tracking consent banners.
- Exposing analytics metrics to AI assistants via a native Model Context Protocol (MCP) server package.
What not to copy:
- Combining high-throughput event ingestion routes directly within the same Next.js application process in large enterprise setups; separating collection beacons into edge functions or lightweight Go/Rust ingesters prevents web UI server saturation.
Sources & repo audit
- package.json (Core Next.js application dependencies and build scripts)
- Dockerfile (Multi-stage Alpine container build and standalone runner)
- docker-compose.yml (Development and self-hosted orchestration with PostgreSQL)
- packages/mcp/package.json (Umami Model Context Protocol server implementation)
Independent analysis of repository at github.com/umami-software/umami. Spotted an inaccuracy? Use the claim form to request a correction.
Show this stack on your README or website
[](https://stackitfast.com/project/umami)Paste it into your README. It shows your current stack and links to this page.
Scaffold it with your agent
Paste this prompt into Claude Code, Cursor, Windsurf or AGY to start a project with Umami's architecture.
- 1Copy the promptThe full markdown spec, with every layer and decision.
- 2Open your AI toolClaude Code, Cursor, Windsurf or Copilot, in a new repo.
- 3Paste and scaffoldUse it as the first instruction; review before you ship.
# MISSION: Scaffold "Umami" Production Architecture
You are an expert Senior Staff Software Architect and Full-Stack Engineer. Your mission is to scaffold and implement a production-grade, highly reliable, and modular codebase following the proven architecture of **Umami**.
---
## 1. PROJECT SPECIFICATIONS & BENCHMARK
- **Reference Architecture**: Umami
- **What It Does**: Privacy-focused, open-source web analytics platform and Google Analytics alternative built with Next.js, React, and PostgreSQL.
- **Domain & Category**: Web Analytics
- **Production Scale**: Solo
- **Development Mode**: HYBRID
- **Architectural Rationale**: Umami provides cookie-free, GDPR-compliant website metrics and session replays with simple self-hosting and zero data monetization.
- **Live Website Reference**: https://umami.is
- **Source Repository**: https://github.com/umami-software/umami
---
## 2. PRODUCTION TECH STACK
- **Full Stack Array**: TypeScript, Next.js, React, Prisma, PostgreSQL, ClickHouse, Redis, Docker
- **Primary Language(s)**: TypeScript, JavaScript, CSS, Dockerfile, Shell
- **License of the reference repo**: MIT
- **Frontend**: Next.js — Full-stack application framework serving analytics dashboards and API collection routes; React — Interactive analytics interface rendering timeseries charts, maps, and conversion funnels
- **Backend & APIs**: TypeScript — Type-safe codebase powering tracker compilation, collection APIs, and MCP servers
- **Data & persistence**: Prisma — ORM client managing database models, migrations, and read replicas for analytics entities; PostgreSQL — Primary relational persistence layer storing accounts, websites, events, and sessions; ClickHouse — High-volume columnar analytical store used in enterprise deployments for event queries; Redis — In-memory cache for visitor sessions, IP anonymization salts, and rate limiting
- **Infrastructure & deploy**: Docker — Production alpine container images packaging Next.js standalone builds and database scripts
---
## 3. KEY ARCHITECTURAL DECISIONS (audited from https://github.com/umami-software/umami @ ec0ff50)
1. **Dual Persistence Support for PostgreSQL and ClickHouse**: Decouples relational query models through Prisma while offering high-throughput columnar event ingestion via native ClickHouse drivers for large deployments.
2. **Standalone Rollup Build for Privacy-First Tracker Script**: Compiles a lightweight, zero-dependency tracking snippet (under 3KB) using Rollup that collects analytics without setting persistent user cookies.
3. **Built-in Model Context Protocol Server**: Exposes analytics stats, real-time traffic queries, and metric aggregations to AI agents through a dedicated MCP server package (@umami/mcp).
4. **Session Replay Integration with rrweb**: Incorporates a privacy-conscious DOM session recorder in src/recorder using rrweb to capture user navigation funnels and playback sessions.
---
## 4. NON-NEGOTIABLE ARCHITECTURAL GUARDRAILS
1. **Monorepo & Modular Separation**:
- Structure as a Turborepo monorepo with strict package boundaries:
- `apps/web`: Application UI, routing, layouts, and server endpoints.
- `packages/ui`: Shared design tokens, CSS variables, and Radix UI primitive components.
- `packages/db`: Database schemas, client singleton, declarative migrations, and seed scripts.
- `packages/config`: Shared TypeScript, ESLint, and build configurations.
2. **Strict Type Safety & Zero `any` Policy**:
- Enable `strict: true`, `noImplicitAny: true`, and `strictNullChecks: true`.
- Validate ALL external inputs, API request bodies, and query parameters with **Zod** schemas before execution.
3. **Frontend & Rendering Guidelines**:
- Utilize Next.js 15 App Router: default to React Server Components (RSC) for data fetching. Handle mutations through Server Actions with Zod validation. Keep 'use client' directives restricted strictly to interactive leaf components.
4. **Design System & Aesthetics**:
- Keep every color, radius, shadow and font in a single token file (CSS variables) and consume tokens everywhere; never hardcode hex values in components.
- Prefer crisp 1px borders and one subtle shadow scale over blurry default shadows. Pair one sans-serif for body/headings with one monospace for tags, badges, metrics, and code.
5. **Data Layer & Reliability**:
- Write declarative schema definitions with foreign keys, composite indexes on queried filters, and automated timestamp triggers.
- Use connection pooling and prepared statements for serverless database execution.
---
## 5. STEP-BY-STEP SCAFFOLDING ROADMAP
- **Phase 1: Workspace & Root Config**: Initialize package manager, monorepo configuration (`turbo.json`, `tsconfig.base.json`, `package.json`).
- **Phase 2: Database Schema & Client**: Set up the data layer (Prisma, PostgreSQL, ClickHouse, Redis): client, connection pool, models, and migration scripts.
- **Phase 3: Design Tokens & UI Primitives**: Build accessible `Button`, `Input`, `Card`, `Badge`, and layout wrappers inside `packages/ui`.
- **Phase 4: Core Application Routes & Handlers**: Implement primary authentication, user session handling, and application routes.
- **Phase 5: Quality Assurance & Build Verification**: Run `tsc --noEmit`, ESLint, Prettier, and smoke test suites to ensure zero compilation or runtime errors.
---
## 6. EXECUTION INSTRUCTIONS
1. Review all specifications, architectural guardrails, and stack choices above.
2. Present the full monorepo directory tree structure.
3. Systematically generate the complete, production-ready codebase according to the 5-phase roadmap above — starting with the root workspace setup, followed by the database schema, UI design system package, and full-stack application routes until the repository is fully scaffolded and ready to run.Copied 1 time
Frequently asked about Umami
Does Umami require cookies to track visitor analytics?
No, Umami generates anonymous rotating daily visitor hashes without storing cookies or personally identifiable information on client devices.
Can Umami run with ClickHouse instead of PostgreSQL?
Yes, Umami includes native ClickHouse query drivers and migration schemas in db/clickhouse designed for high-volume analytics workloads.
What is Umami built with?
Umami is a TypeScript Next.js app with a React dashboard, Prisma over PostgreSQL for primary storage, optional ClickHouse for high-volume event queries, and Redis for sessions and rate limiting.
Is Umami built with Next.js?
Yes. Next.js serves both the React analytics dashboard and the API routes that collect tracking events, and production Docker images package a Next.js standalone build.
Can I self-host Umami?
Yes. Umami ships production Docker images that package the Next.js standalone build with its database scripts, and it runs against your own PostgreSQL (or ClickHouse) database.
One email a month: new deep dives and stack trends
New source-audited architectures, head-to-head comparisons and the monthly stack report. No spam, unsubscribe anytime.
Similar architectures
- FormbricksAI-agentSurvey & Feedback SaaS · 2-5 peopleShares Next.js · TypeScript · Prisma
- Trigger.devHybridJob Queue / Dev Tool · 6-20 peopleShares TypeScript · Prisma · PostgreSQL
- PostHogHybridProduct Analytics Platform · 20+ peopleShares React · TypeScript · ClickHouse
- SentryClassicError Tracking Platform · 20+ peopleShares React · TypeScript · ClickHouse
- Cal.comClassicScheduling SaaS · 6-20 peopleShares TypeScript · Next.js · React
- InfisicalHybridSecret Management · 6-20 peopleShares React · TypeScript · PostgreSQL