Welcome to the Stripe Example Store! This repo is an example of a RedwoodJS-Stripe integration. Most startups need a way to process payments. We designed this repo to demonstrate how you could go about integrating Stripe into your RedwoodJS project. In this repo, you'll see how to:

• use Stripe Checkout to accept one-time payments and subscriptions
• receive notifications by processing webhooks using a serverless function
• robustly manage app-level state via a persistent cart
• and more!

Keep reading to get started or check out the Roadmap to see the features we've got planned.

1. Clone this repo, cd into it, and yarn install

git clone [email protected]:redwoodjs/example-store-stripe.git
cd example-store
yarn install

2. Get your Stripe test keys

To develop on this repo locally, you'll need to populate your .env file with a few env vars. The first of those is your Stripe test keys.

You'll need a Stripe account to get your test keys. If you don't already have one, you can make one here: https://dashboard.stripe.com/login?redirect=%2Ftest%2Fdashboard.

Once you've made your account, if you weren't automatically redirected, navigate to your test dashboard. You'll find your test keys over on the right:

Make sure "Test mode" is on

You can toggle "Test mode" on and off with the toggle in the upper right. Make sure it's always on. You should always see the orange "Test Data" banner.

Now that you've got your test keys, your .env should look like:

STRIPE_PK=pk_test_...
STRIPE_SK=sk_test_...

You'll need one more Stripe env var: the Stripe webhook secret (STRIPE_WEBHOOK_SK). You can get it from the Stripe CLI:

stripe listen --api-key=sk_test_... --print-secret

Note that the value of the --api-key flag should be the same as STRIPE_SK.

Now your .env file should look like this:

STRIPE_PK=pk_test_...
STRIPE_SK=sk_test_...
STRIPE_WEBHOOK_SK=whsec_...

3. Setting up your database

To tie things up, you'll need one more env var. The Stripe Example Store uses Postgres, so before you can migrate your database, you'll need to set your DATABASE_URL env var.

If you don't already Postgres setup locally, it can be a little tricky to do so. If you're on a Mac, Postgres.app is a tried-and-true solution. We don't have recommendations for other platforms, but one thing we do recommend is using railway.app—even for local development—since it trivializes this whole process.

Once you've added your DATABASE_URL to your .env file, you're ready to migrate your database:

yarn rw prisma migrate dev

Now you should be able to start the dev server!

yarn rw dev

4. Listening for webhooks

In tandem with the dev server, you'll want to use the stripe CLI to start a process that listens for webhooks:

stripe listen --forward-to 'localhost:8911/stripeWebhooks'

Make sure to pass the serverless function that's going to receive webhooks to the --forward-to flag.

There's a lot more ways we plan to integrate RedwoodJS with Stripe. Open an issue or a PR to let us know what features you'd like to see!

• 👉 Link to the Roadmap: redwoodjs/example-store-stripe#9

• Christine van der Merwe (Chris; @chrisvdm)
• Dominic Saadi (Dom; @jtoar)

Chris is the project lead and Dom is point from the RedwoodJS Core Team.

This repo is the second iteration of the RedwoodJS-Stripe project. The first can be found in the redwoodjs-stripe repo.

The first was focused on integrating Stripe with RedwoodJS from the ground up. This presented many technical challenges, namely, how can we make RedwoodJS a more-pluggable Framework.

This project takes the opposite approach by focusing on what a Stripe integration in a RedwoodJS Project would look like.