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

> Product and customer analytics software for B2B SaaS

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

## Verdict

Build a personal-use event tracker and metrics dashboard for your own apps, but the CRM sync and high-scale analytics pipeline involve heavy data engineering.

June's core value is taking raw event streams and instantly rendering clean, company-level B2B reports without manual BI setup. For a personal-use clone, you can build a streamlined Next.js app with a PostgreSQL database and Drizzle ORM that accepts tracking calls via an API route, groups events by user and company, and computes basic retention and active-usage metrics. However, building out reliable bi-directional CRM syncing with HubSpot and Salesforce, plus a secure text-to-SQL LLM pipeline that doesn't hallucinate invalid queries against your schema, will consume significant debugging time. Because the original product is shut down and was priced for companies above $1M ARR, building a lightweight personal dashboard for your own side projects is a fun and practical weekend-to-weeks build, but don't expect it to rival a dedicated enterprise analytics suite.

### What you can't replicate

- The original proprietary event processing pipeline and ClickHouse cluster
- Native enterprise security compliance certifications (SOC 2 Type II)

## What it does

Automatically translates event streams into pre-built product reports, company-level metrics, and AI-powered insights for B2B SaaS companies.

### Core features

- Event ingestion API for tracking user actions
- Identity resolution (stitching anonymous sessions to identified users and companies)
- Automatic metric templates (retention, active usage, feature adoption)
- Company-level analytics aggregation
- Natural language text-to-SQL query generation via LLM
- CRM integrations (HubSpot, Salesforce, Attio)

## The business

### Pricing

- All-in-one: Custom

### Funding

$2.5M raised.
- Y Combinator (W21)
- Seed Round
Investors: Y Combinator, Point Nine Capital, Speedinvest, Des Traynor, Ryan Singer

Founded 2020.
Team size: 6-10.

## The hard parts

- High-throughput event ingestion and analytical storage at scale
- Complex identity graph mapping users to accounts/companies
- Secure text-to-SQL pipeline mapping natural language prompts to database schemas safely
- Bi-directional synchronization and rate-limit handling with enterprise CRMs

## How to vibe code June

### Prerequisites

- Node.js (free): Runtime for building the Next.js web application and ingestion endpoints.
- GitHub (free): Code repository hosting and deployment integration.
- Supabase account (free): Managed PostgreSQL database for storing user events, company profiles, and metrics.

### Recommended AI tools

- Claude Code: Agentic terminal coding tool for scaffolding full-stack API routes, database schemas, and analytics dashboard components.
- Cursor: AI-native code editor for reviewing and refining dashboard UI components and charting logic.

### Stack

- Frontend: Next.js with Tailwind CSS and Recharts
- Backend: Next.js API Routes / Server Actions
- Database: Supabase (PostgreSQL with pgvector for AI queries)
- Auth: better-auth
- Payments: none
- Other: Vercel AI SDK, Anthropic API

### Hosting

- Vercel (Hosting the Next.js frontend, API ingestion endpoints, and serverless background tasks.): $0-20/mo

### Build guide

1. **Project Scaffolding and Database Schema** — Initialize the Next.js application, configure Tailwind CSS, set up better-auth, and design the PostgreSQL database schema for users, companies, and events.

```
Create a new Next.js 16 project with TypeScript and Tailwind CSS v4. Set up Drizzle ORM to connect with Supabase PostgreSQL. Create database schemas for: 1) 'users' (id, email, name, company_id, created_at), 2) 'companies' (id, name, domain, created_at, traits), and 3) 'events' (id, anonymous_id, user_id, event_name, properties (JSONB), timestamp). Configure better-auth for single-tenant authentication so you can log into your own analytics dashboard securely. Ensure all migrations are clean and set up a basic layout shell with sidebar navigation.
```

2. **Event Ingestion API and Client SDK** — Build high-throughput ingestion endpoints (`/api/track`, `/api/identify`, `/api/group`) and a lightweight JavaScript snippet/client SDK to capture user telemetry.

```
Implement server-side and client-side tracking endpoints in Next.js. Create POST /api/track to ingest event payloads (event_name, user_id, anonymous_id, properties, timestamp), validate them with Zod, and batch insert them into the 'events' table. Create POST /api/identify to update user attributes and POST /api/group to map users to companies. Provide a lightweight JavaScript tracking client SDK snippet (track, identify, group methods) that developers can paste into their apps to send events to your ingestion API.
```

3. **Automatic Metric Generation Engine** — Build backend aggregation queries and API routes to compute core B2B SaaS metrics: retention curves, active usage (DAU/MAU), and feature adoption funnels.

```
Build a metrics calculation engine in TypeScript that queries the 'events' and 'users' tables to generate pre-built B2B SaaS reports. Implement SQL aggregation logic for: 1) Active usage (DAU, WAU, MAU), 2) User retention cohort analysis tables (percentage retained week-over-week), 3) Feature adoption counts grouped by company. Expose these calculations via GET API routes so the frontend can render them instantly without heavy client-side compute.
```

4. **Company-Level Analytics Dashboard UI** — Develop the React dashboard views using Recharts to visualize company accounts, health scores, usage trends, and individual user event timelines.

```
Create a comprehensive analytics dashboard UI using Recharts and Tailwind CSS. Include: 1) An Overview page with active usage charts and summary metric cards, 2) A Companies view listing all tracked accounts with aggregated metrics (total events, active users, last seen), 3) A Company Detail page showing individual user event timelines and health scores. Use server components where appropriate and client components for interactive date-range filtering.
```

5. **LLM Text-to-SQL Natural Language Insights** — Integrate the Vercel AI SDK and Anthropic API to allow users to query product usage data using natural language, translating prompts into safe read-only SQL queries.

```
Implement 'June AI' using the Vercel AI SDK and Anthropic API (Claude 3.5 Sonnet). Create an API route that accepts a natural language prompt about product usage (e.g. 'Show me companies with zero events in the last 7 days'), provides the database schema in the system prompt, generates a safe read-only SQL query, executes it securely against Supabase with strict parameter limits, and returns both the raw data and a recommended chart visualization type for the frontend.
```

### Cost vs paying

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

- Custom Domain (optional): $12/yr
- Total: ~$12 one-time

**Ongoing costs (monthly):**

- Vercel Pro / Supabase Database: $0-25/mo
- Anthropic API credits for AI queries: ~$5/mo
- Total: ~$10-30/mo

- Paying for the SaaS instead: Custom / Enterprise (historically $500+/mo for growing B2B SaaS)
- Build time: 35-50 hours
- AI tool credits: $20/mo (Claude Pro / Cursor)
- Break-even: Immediate (June is shut down; alternative commercial B2B analytics tools cost hundreds monthly)

## Sources

- [June Official Website](https://june.so)
- [A new chapter for June: our founding team is joining Amplitude](https://june.so/blog/june-is-joining-amplitude)
- [Y Combinator Company Profile - June](https://www.ycombinator.com/companies/june)