# How to Vibe Code Your Own Pirsch (and Stop Paying for It)

> Privacy-friendly, cookieless web analytics

- Site: https://pirsch.io
- Category: Web Analytics
- Verdict: **Solid side project** (68/100 vibecodeable)
- Estimated effort: 2-3 weeks part-time

## Verdict

You can build a functional personal clone of Pirsch for yourself, but you will hit friction designing an efficient event ingestion and aggregation pipeline.

Analytics tools look deceptively simple on the surface—just a JS tag and a dashboard graph. However, as soon as your sites receive traffic, raw event tables explode in size. Writing real-time queries over raw logs causes database timeouts, forcing you to implement pre-aggregated rollups or switch to a columnar store. While AI agents write CRUD dashboards and charts rapidly, designing and debugging a robust ingestion and aggregation backend falls squarely on your architecture skills.

### What you can't replicate

- Built-in customer trust and legal compliance guarantees
- Pre-existing community plugins and CMS extensions

## What it does

A cookieless, GDPR-compliant web analytics platform with event tracking, custom domains, and white-labeling.

### Core features

- Lightweight JavaScript collection snippet (~1KB)
- Cookieless visitor hashing (IP + User-Agent)
- High-throughput event ingestion endpoint
- Fast database aggregations for real-time dashboards
- Goal and custom event tracking
- Filterable traffic views (browsers, devices, referrers)
- Data import tools (Google Analytics, Plausible)
- CSV data export and REST API

## The business

### Pricing

- Standard: $6/mo — For small sites and personal use
- Plus: $12/mo — For agencies and power users
- Enterprise: Custom — For high volume and self-hosted requirements

Founded 2019.
Team size: 1-5.

## The hard parts

- Designing an ingestion pipeline that handles high-concurrency write bursts without locking the database
- Computing real-time analytics aggregations across millions of raw rows without query timeouts
- Correctly hashing and anonymizing visitor HTTP headers to maintain strict GDPR compliance
- Managing database schema migrations and index performance as log tables grow

## How to vibe code Pirsch

### Prerequisites

- Node.js (free): Required for running the Next.js development environment.
- GitHub (free): Source control and deployment pipeline integration.

### Recommended AI tools

- Claude Code: Best-in-class multi-file agentic coding tool for scaffolding full-stack features.
- Cursor: Excellent AI code editor for refining dashboard UI components and charts.

### Stack

- Frontend: Next.js
- Backend: Next.js API Routes
- Database: Turso
- Auth: better-auth
- Payments: None
- Other: Tailwind CSS, Recharts

### Hosting

- Vercel (Hosting the Next.js frontend and API ingestion endpoints): $0/mo
- Turso (Edge SQLite database for storing raw page views and aggregated stats): $0/mo

### Build guide

1. **Project Scaffolding & Database Schema** — Initialize a Next.js project with Tailwind CSS and configure Turso with better-auth and tables for sites, pageviews, and events.

```
Scaffold a new Next.js project using App Router, TypeScript, and Tailwind CSS. Configure Turso (libSQL) as the database with Drizzle ORM. Define tables for users, websites (id, user_id, domain, created_at), pageviews (id, website_id, path, referrer, browser, os, country, visitor_hash, timestamp), and custom_events (id, website_id, name, visitor_hash, timestamp). Install better-auth and configure email/password authentication linked to the user table. Create an initial migration script and verify database connectivity.
```

2. **Lightweight Collection Script** — Build a vanilla JavaScript tracking snippet that captures page views and sends them to an ingestion endpoint.

```
Create a public static JavaScript file (`public/pirsch.js`) designed to be embedded on external websites. The script should read `window.location.pathname`, `document.referrer`, parse the user agent for browser and operating system details, and send an asynchronous `navigator.sendBeacon` or `fetch` POST request to `/api/v1/track`. Implement error handling and ensure the script size remains under 2KB. Create the `/api/v1/track` Next.js API route to receive payloads, extract the visitor's IP address from headers, generate an anonymized rotating SHA-256 visitor hash combining the IP and User-Agent, and insert a row into the pageviews table.
```

3. **Dashboard Layout & Site Management** — Build the main dashboard interface for managing websites and viewing high-level analytics metrics.

```
Build a dashboard layout in Next.js featuring a sidebar navigation, site switcher dropdown, and a modal to add new websites. Create a settings page where users can view their tracking snippet HTML code and domain settings. Style all components cleanly using Tailwind CSS to mimic a professional analytics SaaS interface. Protect all dashboard routes using better-auth session checks.
```

4. **Analytics Overview & Aggregation Queries** — Implement dashboard metric cards and charts for page views, unique visitors, browsers, and referrers.

```
Build the main analytics overview page for a selected website. Create backend API routes that query the pageviews table to calculate total page views, unique visitors (distinct visitor_hash), bounce rates, and time-series trends grouped by day or hour. Use Recharts to render clean line charts for page views over time and bar/list components for top referrers, paths, browsers, and operating systems. Add a date range filter selector (e.g. last 7 days, last 30 days).
```

5. **Custom Events & Conversion Goals** — Add support for tracking custom user interactions and conversion goals.

```
Extend the tracking script (`pirsch.js`) to expose a global function `window.pirsch.event(name, meta)` that sends custom events to `/api/v1/event`. Create the backend ingestion route for custom events and store them in the custom_events table. Build a 'Goals & Events' section in the dashboard that lists custom events triggered, total counts, and conversion rates over time.
```

6. **Data Filtering & CSV Export** — Implement interactive table filtering and CSV data export functionality.

```
Add interactive click-to-filter functionality on dashboard metric tables (e.g. clicking a browser name filters all charts and queries by that browser). Implement a CSV export endpoint that queries all page views and events for a given website and date range, streaming it back as a downloadable CSV file. Add an export button to the dashboard settings page.
```

### Cost vs paying

**Starting costs (one-time):**

- AI coding tools subscription: $20
- Total: ~$20 one-time

**Ongoing costs (monthly):**

- Vercel Hobby & Turso Free tier: $0/mo
- Total: $0/mo

- Paying for the SaaS instead: $6/mo - $12/mo
- Build time: 25-40 hours
- AI tool credits: $20 (1 month of Claude Pro / Cursor)
- Break-even: 2-4 months

## Sources

- [Pirsch Official Website & Pricing](https://pirsch.io)