stripe-apps

Builds, scaffolds, and publishes Stripe Apps with UI extensions, backends, and webhooks.

Updated Sep 8, 2026
One-click install
npx skills add https://github.com/FarooqProProgrammer/the-magician --skill stripe-apps-farooqproprogrammer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: stripe-apps
Source: https://github.com/FarooqProProgrammer/the-magician/tree/main/agent/skills/stripe-apps
Command: npx skills add https://github.com/FarooqProProgrammer/the-magician --skill stripe-apps-farooqproprogrammer

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Building a Stripe App involves many moving parts — the stripe-app.yaml manifest, sandboxed UI extensions, backend authentication, webhooks, and marketplace publishing — and getting any of them wrong produces broken apps. This Skill guides an agent through the full development workflow so the user ends up with complete, runnable files on disk. ## Core Features & Use Cases - Guided discovery and architecture routing: A structured interview maps the user's goal to the right extension type (UI extension, backend-only, full-stack, extension interfaces) and the correct Dashboard viewport. - Full build workflow enforcement: Scaffolds with stripe generate app, writes complete files to disk, and walks through build, test, preview, upload, and install steps with hard rules against common failure modes. - Canonical docs grounding: Requires fetching current Stripe documentation before writing code, covering authentication types, webhooks, Secret Store, UI components, and publishing. - Use Case: A user says "add a panel to the customer page showing loyalty points." The Skill asks discovery questions, scaffolds the app, writes the UI extension and backend, and delivers the exact CLI commands to preview and publish it. ## Quick Start Ask the agent to build a Stripe App that shows custom data next to a customer in the Stripe Dashboard, and answer its four discovery questions.

Frequently Asked Questions about stripe-apps

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a Stripe App with a Dashboard UI extension?▼

Scaffold the project with stripe generate app, then modify stripe-app.yaml and ui/src/views/App.tsx using components from @stripe/ui-extension-sdk/ui. Preview locally with stripe apps start, then run stripe apps upload to publish a version.

What authentication type should a Stripe App use?▼

Restricted API keys are the recommended default for private apps and simpler integrations. Use platform keys for public marketplace apps acting across many merchants, and OAuth only when the merchant must be the merchant of record.

Can I use Tailwind or raw HTML in a Stripe App UI extension?▼

No. UI extensions run in a sandboxed iframe on React 17.0.2 and only render components from @stripe/ui-extension-sdk/ui. Raw HTML tags, CSS frameworks, window, document, and localStorage are all blocked.

Why does fetchStripeSignature fail before uploading the app?▼

The signing secret (starting with absec_) is only generated during the first stripe apps upload. You must upload the app before testing fetchStripeSignature or the Secret Store API.

How do webhooks work for public Stripe Apps?▼

Public apps with platform keys use one webhook endpoint with 'Listen to events on Connected accounts' enabled, identifying merchants via event.account. Apps with restricted API keys cannot use Connect webhook fanout, so each merchant manages their own webhooks.

What are the limitations of Stripe App UI extensions?▼

UI extensions are limited to React 17 hooks, SDK components only, and token-based styling via the css prop. They cannot access browser APIs, use ref-based form libraries, or fetch arbitrary external URLs without declaring them in the manifest's content security policy.