Getting started with Stripe Apps

Learn the basics of app development by building, previewing, and updating a Stripe app.

In this guide, build a “Hello, world!” sample app with a UI extension on the Customer details page in the Stripe Dashboard.

Use a coding agent

The Stripe Apps skill helps your coding agent scaffold, build, preview and test a Stripe app using Stripe’s latest guidance. Install Stripe’s agent skills, then start a new agent session in the directory where you want to create your app and use this prompt:

Command Line

Use the Stripe Apps skill to build a "Hello, world!" Stripe app that displays a UI extension on the Customer details page. Guide me through previewing and testing it.

You can also follow the step-by-step guide below.

Before you begin

Note

Developing an app when you have an existing Stripe extension

If you have an existing ‘ ‘Connect’ ’ extension, see Migrate to Stripe Apps.

1. Go to the Stripe Dashboard to sign in or create an account.
2. If you haven’t already, install the Stripe CLI and log in using the same account. Install the Stripe CLI with npm: Command Line npm install -g @stripe/cli@latest After installation, log in to your Stripe account: Command Line stripe login After you install the CLI, you can also install agent tooling, or set up autocompletion. Note For more installation options for Windows, macOS, Linux and Docker, see the Stripe CLI readme on GitHub.
3. Verify that you’re using CLI version 1.25.0 or newer. You can check by running: Command Line stripe version If your Stripe CLI version is older than 1.25.0, update your Stripe CLI version to the latest version .
4. Verify that Node.js is installed by running: Command Line node -v Stripe Apps requires Node.js version >=22 . We recommend using an Active LTS version (22 or later). If you don’t have Node.js installed, download and install it .
5. Install pnpm . Stripe Apps uses pnpm as the package manager: Command Line brew install pnpm Verify the installation: Command Line pnpm --version

If you plan to publish your app to the App Marketplace, there are additional restrictions:

• Your account must be activated , with a verified email address and business details.
• A Connect platform account can’t publish an app on the Stripe Marketplace.

If you’re authoring an extension, make sure you have:

Install the Stripe Apps CLI plugin

To start building a Stripe app, install the Stripe Apps CLI plugin:

Command Line

stripe plugin install apps

If you already have the apps plugin installed, verify that you’re on version 1.19.0 or later.

Command Line

stripe apps -v
# apps version 1.19.0

If you already have the apps plugin installed, we recommend upgrading to the latest version by running:

Command Line

stripe plugin upgrade apps

Next, install the Stripe generate CLI plugin, which is required to scaffold new apps:

Command Line

stripe plugin install generate

Verify that you’re on version 0.11.5 or later:

Command Line

stripe generate --version
# generate version 0.11.5

If you already have the generate plugin installed, we recommend upgrading to the latest version by running:

Command Line

stripe plugin upgrade generate

Create an app

1. Build the basic structure of your “Hello, world!” app: Command Line stripe generate app helloworld cd helloworld
2. Follow the prompts by entering the following information:

• ID : You can accept the auto-generated app ID or customise one. This is how Stripe identifies your app. Your app ID must be globally unique.
• Display name : Enter a display name. This is the name your Dashboard displays for your app. You can always change the name later.

App directory file structure

Stripe Apps only supports React 17. Make sure any dependency you install is compatible with this version. For more information see How UI extensions work.

Preview your app

You can run your app locally, update it, and preview your changes in the Dashboard:

1. Go into the helloworld directory: Command Line cd helloworld
2. To preview your app, start your local development server: Command Line stripe apps start
3. Press Enter to open your browser. Note Use a browser that supports the Stripe Dashboard. Safari doesn’t support the Dashboard. For more updates, see the GitHub issue tracking browser support.
4. Click Continue to preview your app in your Stripe account: Enable app preview Your app in the Dashboard

Enable local network access before viewing your app.

Build your app

While you’re previewing your app in the Dashboard, the local development server enables real-time updates on your app:

1. In your Home.tsx file, change the title while you keep the Stripe Dashboard page open and your development server running. Save the file to see your changes in your app.
2. In the same file, remove > from the </ContextView> closing tag, and save the file to see an error: You can resolve the error in the Stripe Dashboard, your browser developer tools, or the Stripe CLI.
3. To stop the development server, Ctrl+C from your command line.

Your sample app is complete. Next, start adding more features to your Stripe app.

See also

• Build a UI extension
• Add server-side logic
• Distribution options

Interested in the preview of new app components and capabilities?

Enter your email to request access.