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

> A better Google Analytics alternative that's simple and privacy-first.

- Site: https://usefathom.com
- Category: Web Analytics
- Verdict: **Solid side project** (75/100 vibecodeable)
- Estimated effort: 2-3 weeks of focused development

## Verdict

Build a personal subset for your own sites, but keep paying if you need enterprise-grade data pipelines and legal compliance guarantees.

The dashboard UI and lightweight tracking script are straightforward to build, but you will hit engineering friction designing an ingestion endpoint that can safely handle high-frequency beacon requests without locking a standard relational database. Storing raw hits in a time-series or analytical store requires careful indexing to keep dashboard queries snappy.

### What you can't replicate

- Pre-vetted legal compliance frameworks for GDPR, CCPA, and PECR
- Built-in trust from thousands of business customers and open-source projects
- Years of edge-case bot filtering signatures

## What it does

Fathom Analytics provides privacy-focused, cookie-free website traffic analytics without cluttering sites with banner notices or tracking personal user data.

### Core features

- Lightweight client-side tracking snippet (<2KB)
- Single-page analytical dashboard (visitors, pageviews, referrers, devices)
- Custom event and goal tracking with revenue values
- UTM campaign and newsletter link attribution
- Automated bot, crawler, and spam filtering
- Public and password-protected shared dashboards
- CSV data exports and scheduled email reports
- Multi-domain aggregation and IP/country blocklists

## The business

### Pricing

- Up to 100k pageviews: $15/mo
- Up to 500k pageviews: $45/mo
- Up to 2M pageviews: $105/mo

### Funding

$0 raised.

Founded 2018.
Team size: Small bootstrapped team.

## The hard parts

- High-throughput event ingestion architecture handling traffic spikes without dropping tracking calls
- Aggregating billions of rows efficiently so dashboard queries return instantly
- Robust heuristics for automated bot, data center, and scraper filtering
- Privacy-preserving aggregation without storing identifiable raw user footprints

## How to vibe code Fathom Analytics

### Prerequisites

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

### Recommended AI tools

- Claude Code: Best-in-class multi-file agentic coding tool for bootstrapping schemas, ingestion endpoints, and dashboard views in one run.
- Cursor: Ideal for fine-tuning charts, dashboard UI components, and Tailwind styling.

### Stack

- Frontend: Next.js with Tailwind CSS and Recharts
- Backend: Cloudflare Workers (TypeScript)
- Database: Turso (libSQL/SQLite at the edge) for lightweight analytical storage
- Auth: better-auth
- Payments: None (Personal use clone)
- Other: Resend for scheduled email summaries

### Hosting

- Cloudflare (Hosting both the tracking ingestion endpoint worker and the Next.js frontend dashboard): $0-5/mo

### Build guide

1. **Project Scaffolding and Database Schema** — Initialize a Next.js project with Tailwind CSS, configure Turso SQLite via libSQL, and set up database tables for websites, pageviews, and custom events.

```
Create a new Next.js 16 project with Tailwind CSS. Set up a Turso/libSQL database connection using Drizzle ORM. Define schemas for three tables: `sites` (id, domain, user_id, created_at), `pageviews` (id, site_id, path, referrer, browser, os, country, timestamp), and `events` (id, site_id, name, revenue, timestamp). Ensure indexes are created on `site_id` and `timestamp` for fast analytical aggregation queries.
```

2. **Client-Side Tracking Script** — Build a lightweight vanilla JavaScript snippet under 2KB that captures page loads and custom events, sending them via `navigator.sendBeacon` or `fetch` to the ingestion API.

```
Write a minimal vanilla JavaScript tracking snippet (target under 2KB uncompressed) that automatically logs page views on load and history state changes for single-page applications. It should capture `window.location.pathname`, `document.referrer`, and basic screen dimensions, then transmit them securely using `navigator.sendBeacon` or a fallback `fetch` request with `keepalive: true` to `/api/collect`. Include support for a custom tracking function `fathom.trackGoal('code', revenue)`.
```

3. **High-Throughput Ingestion Endpoint** — Create a Cloudflare Worker or Next.js API route that validates incoming tracking beacons, applies basic bot filtering heuristics, and inserts records into Turso.

```
Build an ingestion endpoint at `/api/collect` that accepts POST requests from the tracking snippet. Validate the incoming site ID against the database. Implement a basic bot-filtering heuristic checking User-Agent headers against known scrapers and data center IPs. If valid, parse the referrer URL, extract the path, lookup the country from Cloudflare request headers (`cf-ipcountry`), and insert an aggregated record into the `pageviews` table.
```

4. **Authentication and Dashboard Layout** — Implement authentication using better-auth and create the main analytical dashboard layout with site switchers and date range selectors.

```
Integrate better-auth into the Next.js application for email/password authentication. Build a clean, single-page dashboard layout styled with Tailwind CSS supporting light and dark modes. Include a site selector dropdown, a date range picker (Today, Last 7 Days, Last 30 Days), and summary KPI cards for Unique Visitors, Pageviews, Average Time on Site, and Bounce Rate.
```

5. **Analytical Charts and Detailed Breakdowns** — Add visual charts using Recharts for traffic over time, top pages, referrers, devices, and countries.

```
Build interactive dashboard panels using Recharts to display traffic trends over time. Implement data aggregation queries for top pages, referrers, devices, operating systems, and countries. Add click-to-filter functionality so clicking a row in the top pages table filters the rest of the dashboard by that specific path.
```

6. **Event Conversions and UTM Tracking** — Implement custom event tracking and UTM parameter parsing to measure campaign performance and revenue conversions.

```
Extend the ingestion endpoint and dashboard to support custom events and UTM parameters (`utm_source`, `utm_medium`, `utm_campaign`). Create an 'Events & Campaigns' tab in the dashboard displaying goal completion counts, total revenue generated per event, and a breakdown of traffic driven by specific marketing campaigns.
```

7. **Scheduled Email Reports and CSV Export** — Set up weekly/monthly email summaries using Resend and add one-click CSV data exports.

```
Implement a CSV export feature allowing users to download their raw or aggregated analytics data for any date range. Set up a scheduled cron job using Cloudflare Cron Triggers that queries weekly traffic totals per site and dispatches an email summary report using the Resend API.
```

### Cost vs paying

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

- AI Coding Assistant (Claude Pro): $20
- Total: ~$20 one-time

**Ongoing costs (monthly):**

- Cloudflare & Turso Hobby Tiers: $0/mo
- Total: $0/mo

- Paying for the SaaS instead: $15/mo
- Build time: 25 hours
- AI tool credits: $20
- Break-even: Free forever (self-hosted personal use)

## Sources

- [Fathom Analytics Homepage](https://usefathom.com)
- [Fathom Analytics Pricing](https://usefathom.com/pricing)
- [Fathom Analytics Features](https://usefathom.com/features)