Skip to content

Setup Stripe Payments:

Overview

Customer clicks Buy
        │
        ▼
POST /checkout
        │  creates a Stripe Checkout session
        ▼
Redirect to Stripe-hosted payment page
        │
        ▼
┌───────────────────────────┐
│ Customer completes payment│
└───────┬───────────────────┘
        │
        ├──▶ Redirect to /success (browser)
        │
        └──▶ POST /stripe/webhook (Stripe server-to-server)
                │
                ├─ Verify signature
                ├─ Create user (if new)
                ├─ Grant product access

Developer Mode Steps

  1. Create a new account on Stripe and activate payments

  2. In your [Settings], [Account details], add your product name as your business name - you should create a new account for every new product you ship.

  3. In your [Settings], [Business details], add your website URL

  4. In your [Settings], [Branding], add your logo, brand and accent colours.

  5. In your [Settings], [Customer Emails], turn on emails for successful payments & refunds

  6. In the search box, type 'radar' and click on the Rules tab, enable the 3DS rule is enabled. Also enable block payments if CVC fails.

  7. Turn ON Test Mode

  8. Create a new product, copy the price ID (example: price_1ju5GD464564) and add it to DEV_STRIPE_ONE_OFF_PRICE in your .env file.

  9. In the [Developers], [API Keys] section, copy your publishable & private key. Add the keys to: DEV_STRIPE_PUBLISHABLE_KEY and DEV_STRIPE_SECRET_KEY respectively, also in the .env file.

Create the Stripe Webhook in Developer Mode

This project comes with all the code necessary to ensure you will have a robust Stripe webhook up-and-running fast. This is very important to ensure that the customer's payment has been completed successfully. But there are a few setup steps you still need to do.

First we need to install the “global” Stripe command line interface (CLI) application on our machine. If you are on Mac use Homebrew to install the software. Run the following command in your terminal:

brew install stripe/stripe-cli/stripe

(For other operating systems check out Stripe’s official install page

Run the login command which will open a new browser window with instructions provided by Stripe:

stripe login

Next, run the command below which will create the webhook signing secret:

stripe listen --forward-to localhost:5001/stripe/webhook

Now we can add this secret to our .env file under STRIPE_WEBHOOK_SECRET

Note: you must keep the stripe listen process running for the Slack notification (in the next section) to work in your local environment.

Production Mode Steps

  1. Turn OFF Test Mode in your Stripe Dashboard

  2. In [Developers], copy your publishable & secret keys .and add them to STRIPE_PUBLISHABLE_KEY & STRIPE_SECRET_KEY in the environment variables section of your Render dashboard.

  3. In [Developers], [Webhook], [Add Enpoint]. Set your domain + /api/webhook/stripe. Select [checkout.session.completed] event (or more if needed). Copy the signing secret and add it to STRIPE_WEBHOOK_SECRET in the Render dashboard.

  4. Optional: In [Balances], [Manage Payouts], set a specific date of the month to receive your payouts (I use the 7th of each month)