json-render/examples/stripe-app

Stripe App Examples

Stripe Apps examples demonstrating how to use json-render to build dynamic, AI-generated UI within the Stripe Dashboard.

Structure

Folder	Description
api/	Next.js server providing the /api/generate endpoint for AI-powered UI generation
drawer-app/	Standard Stripe App that renders in the Dashboard drawer (sidebar)
fullpage-app/	Full-page Stripe App using FullPageView (requires alpha access)

Quick Start

1. Start the API server

cd api
pnpm install
cp .env.example .env  # Set AI_GATEWAY_API_KEY
pnpm dev

2. Start a Stripe App

For the standard drawer app:

cd drawer-app
pnpm install
pnpm setup
stripe apps start

For the full-page app (requires alpha access):

cd fullpage-app
pnpm install
cp .env.example .env  # Set STRIPE_APP_ID
pnpm setup
stripe apps start
# Navigate to https://dashboard.stripe.com/test/app/<your-app-id>

Notes

• The AI generation feature requires the API server to be running. Without it, the apps fall back to locally generated specs using real Stripe data.
• The fullpage-app uses Stripe's full-page apps private developer preview. You need Stripe to enable the feature flag for your app and account. See fullpage-app/README.md for details.