Back to Prompt Library
Dashboards & Feeds

Stripe Dashboard

Build a real-time dashboard showing new subscriptions and trial signups from Stripe

Guide

Stripe Dashboard

Create a real-time dashboard to track your SaaS product traction with new subscriptions and trial signups from Stripe.

Prerequisites

This app requires a backend to call the Stripe API securely.

  • Activate OptiDev Cloud - Click the "OptiDev Cloud" button in your project to activate backend services

  • Add your Stripe API key - Go to OptiDev Cloud > Secrets and add:

  • - Key: STRIPE_READ_ONLY_KEY
    - Value: Your Stripe restricted key (read-only access to subscriptions and customers)

    TIP: Use a restricted API key with read-only permissions for security.

    Final Prompt

    ### Purpose
    I'm a product manager at a SaaS company. I need to build a Stripe dashboard to track traction of our new product, displaying on a TV in our office.
    
    ### Requirements
    Build a modern dashboard with these feeds:
    
    **New Subscriptions Feed**
    - Show recent subscription events
    - Display: customer name/email, product name, quantity, amount ($), billing cycle (monthly/yearly)
    - Sort by most recent first
    - Visual cards with clean styling
    
    **New Trial Users Feed**
    - Show customers who started a trial
    - Display: customer name/email, trial product, trial start date, trial end date
    - Highlight trials ending soon
    
    **Dashboard Layout**
    - Dark theme, suitable for TV display
    - Two-column layout: Subscriptions on left, Trials on right
    - Auto-refresh every 60 seconds
    - Show last updated timestamp
    - Date/time display in header
    
    **Backend Setup**
    I've activated OptiDev Cloud and added `STRIPE_READ_ONLY_KEY` in the project secrets. Use it to call the Stripe API to fetch subscription and customer data.
    AI-Powered App Builder | OptiDev