Introduction

"Out-of-the-box billing tools often lock your subscription data in silos. Building a custom SaaS metrics dashboard gives you real-time visibility into customer retention, expansion revenue, and financial health."

To scale a SaaS business effectively, tracking core growth metrics in real time is non-negotiable. While third-party analytics tools exist, engineering teams frequently need custom dashboard solutions integrated directly into their internal portals or customer-facing platforms.

This guide walks through the essential architecture, key formulas, and implementation steps to build a SaaS analytics dashboard.

1. The Core Metrics Every SaaS Dashboard Needs

A comprehensive SaaS dashboard needs to calculate four primary operational metrics dynamically:

Metric | Formula / Logic | What It Measures

--- | --- | ---

MRR (Monthly Recurring Revenue) | Sum of Active Subscriptions x Monthly Price | Predictable recurring revenue normalized to a monthly value

Net Revenue Retention (NRR) | (Starting MRR + Expansion - Contraction - Churn) / Starting MRR x 100 | Revenue growth from existing customers over time

Gross User Churn Rate | Users Lost in Period / Total Users at Start of Period x 100 | The percentage of subscribers cancelling their plan

Customer Lifetime Value (LTV) | ARPU / User Churn Rate | Total expected revenue generated by a single customer account

2. Architecture: Ingesting & Aggregating Webhook Data

Rather than querying payment provider APIs (like Stripe, Paddle, or Chargebee) live on every page load, store subscription state events in your local database using webhooks:

Stripe Webhooks → Ingestion API Endpoint → PostgreSQL (Events Table)
                                                    │
                                                    ▼
Frontend Dashboard (Chart.js / Tremor) ← Aggregation Views (pg_cron)

SQL Schema for Subscription Events:

CREATE TABLE subscription_events (
    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    customer_id VARCHAR(255) NOT NULL,
    event_type VARCHAR(50) NOT NULL,
    mrr_delta NUMERIC(10, 2) NOT NULL,
    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
);

CREATE INDEX idx_sub_events_date ON subscription_events(created_at);

3. Key Formulas in SQL

Calculate MRR from the events table:

-- Current MRR
SELECT SUM(mrr_delta) as current_mrr
FROM subscription_events
WHERE created_at <= NOW();

-- MRR by month (for trend charts)
SELECT
  DATE_TRUNC('month', created_at) as month,
  SUM(mrr_delta) as mrr_change,
  SUM(SUM(mrr_delta)) OVER (ORDER BY DATE_TRUNC('month', created_at)) as running_mrr
FROM subscription_events
GROUP BY DATE_TRUNC('month', created_at)
ORDER BY month;

4. Frontend Visualization & UI Components

For rapid dashboard development, combine a modern React framework (Next.js) with optimized chart primitives:

UI Frameworks: Tailwind CSS paired with Tremor or Shadcn UI for cohesive data cards and tables.

Charting Libraries: Chart.js (via react-chartjs-2), Recharts, or Visx for rendering smooth line charts (MRR trends) and bar graphs (churn analysis).

Date-Range Filtering: Implement aggregated backend API routes supporting dynamic intervals (7d, 30d, 12M, YTD).

5. Dashboard Layout Pattern

A production SaaS dashboard typically includes:

Top Row: 4 KPI cards (MRR, Churn Rate, LTV, NRR) with trend indicators (up/down arrows with percentage change vs previous period).

Middle Row: MRR trend line chart (12-month rolling) + Churn bar chart (monthly).

Bottom Row: Customer table with columns for Plan, MRR, Status, Last Activity, and Churn Risk Score.

6. Security & Access Control

Role-Based Access Control (RBAC): Restrict sensitive financial dashboards to administrative roles (admin, finance_lead).

Multi-Tenant Scoping: If building customer-facing analytics dashboards (e.g., showing usage stats to your users), ensure all database queries enforce tenant-level boundary checks (WHERE tenant_id = current_tenant).

Data Caching: Use Redis or in-memory caching for aggregation queries. Recompute dashboard metrics on webhook events, not on page loads.

Conclusion

A custom SaaS analytics dashboard gives you ownership of your metrics, eliminates vendor lock-in, and enables custom calculations that off-the-shelf tools cannot provide. Start with the four core metrics (MRR, Churn, LTV, NRR), build the webhook ingestion pipeline, and add visualization layers incrementally. The architecture scales from a single-founder dashboard to a boardroom-ready reporting platform.