Build a Custom Subscription Dashboard With RevenueCat Charts API

Developers often hit a wall when RevenueCat’s built-in dashboard doesn’t meet their needs. Whether you want to embed subscription metrics in Slack alerts, Notion dashboards, or internal tools, the Charts API offers the flexibility to pull real-time data—without relying on RevenueCat’s interface. I built a fully functional subscription dashboard in a single HTML file, deployable by dragging it to a URL, and here’s how you can replicate it.

Why RevenueCat’s Charts API Stands Out

RevenueCat’s Charts API, part of their v2 REST API, provides raw subscription data that you can shape into custom visualizations. Unlike the pre-built dashboard, the Charts API lets you filter by cohort, adjust time ranges, and extract MRR, churn, and trial conversion metrics programmatically. The API’s endpoints are straightforward but powerful:

• Overview metrics: A snapshot of current subscription health, including MRR, active subscriptions, trials, and churn.
• Time-series data: Granular trends for revenue, new customers, trial conversions, and churn over specific periods.
• Chart options: Metadata for available filters and segments, helping you refine your queries.

The API accepts parameters like resolution (day, week, month), start_time, and end_time, allowing you to slice data into actionable insights. For example, you can pull weekly MRR trends or daily churn rates and render them in a charting library of your choice.

The Architecture: Avoiding CORS Pitfalls

The biggest hurdle when working with the Charts API is CORS. RevenueCat’s API doesn’t include Access-Control-Allow-Origin headers, blocking direct browser requests. The solution? Route requests through a serverless proxy, which handles authentication and forwards data to your dashboard.

Here’s how the data flow works:

• A user inputs their Project ID and date range in the dashboard UI.
• The browser sends a request to a Netlify Function (same-origin, no CORS issue).
• The function attaches your RevenueCat v2 API key from environment variables and queries the Charts API.
• The response is returned to the dashboard, where KPI cards and charts render automatically.

Without the proxy, attempting a direct fetch from the browser would fail with a TypeError: Failed to fetch error. The proxy acts as a secure middleman, ensuring your API key never reaches client-side code.

Setting Up the Proxy Function

The proxy function is minimal but essential. Here’s a working example for Netlify:

// netlify/functions/rc-proxy.js
exports.handler = async (event) => {
  const { path, params } = JSON.parse(event.body);
  const url = ` URLSearchParams(params.query)}`;

  const res = await fetch(url, {
    headers: {
      'Authorization': `Bearer ${process.env.RC_API_KEY}`,
      'Content-Type': 'application/json'
    }
  });

  return {
    statusCode: res.status,
    body: JSON.stringify(await res.json())
  };
};

Deploy this function to your Netlify project, add your RC_API_KEY to environment variables, and configure the dashboard to call /api/rc-proxy instead of the RevenueCat API directly. For local testing, use a tool like curl to verify the proxy works:

curl -H "Authorization: Bearer YOUR_V2_SECRET_KEY" "

This setup ensures your API key remains secure while giving your dashboard full access to subscription data.

Locating Your Project ID and Handling Authentication

Finding your project_id is simple but often overlooked. It’s embedded in your RevenueCat dashboard URL:

app.revenuecat.com/projects/proj_XXXXXXXXXXXX/apps
                  ^^^^^^^^^^^^^^^^

This ID aggregates data across all platforms (iOS, Android, web) by default. If you need to filter by platform, use the /options endpoint to discover available segments.

Authentication is another common stumbling block. RevenueCat v2 requires Bearer tokens with the Bearer prefix. Older v1 keys won’t work with the Charts API, and missing the prefix in your headers will result in a 401 error. Ensure your API key has the charts_metrics:charts:read permission enabled in RevenueCat’s API Keys settings.

Rendering Real-Time Dashboards

With the data flowing into your dashboard, the next step is visualization. Use a lightweight library like Chart.js or D3.js to transform JSON responses into interactive charts. The dashboard can display:

• MRR trends over time
• Churn rates by cohort
• Trial conversion funnel
• Active subscription growth

For teams, this means embedding live dashboards in internal tools or setting up automated Slack alerts for key metrics. The single-file approach keeps deployment simple, while the proxy ensures scalability and security.

The Future of Subscription Analytics

RevenueCat’s Charts API unlocks new possibilities for developers who need more than what the default dashboard offers. By combining raw data with custom visualizations, you can create dashboards that align perfectly with your team’s workflows. The key takeaway? Always use a serverless proxy to handle authentication, and leverage the API’s flexibility to tailor insights to your needs.

As subscription models evolve, tools like these will become essential for tracking performance in real time. Whether you’re a solo developer or part of a larger team, the ability to build and deploy a custom dashboard in minutes is a game-changer.