Documentation
Features
Payments [PRO]

Payments [PRO]

To be able to accept payments in your app, this boilerplate comes with the Stripe (opens in a new tab) integration. With Stripe, you can accept one-time payments, manage subscriptions and many more.

The payments package with the configuration is located at packages/payments. The webhook listener is located at apps/webpro/src/app/api/payments/webhook/route.ts The Stripe actions are located at apps/webpro/src/actions/payments/.

Stripe Setup

Make sure to develop in Test Mode locally first. Then use the Production credentials when deploying your app.

  1. You need to create a new account on Stripe (opens in a new tab) if you don't have any.

  2. In the Stripe Dashboard (opens in a new tab), note the Publishable Key and Secret key.

  3. Now create 2 products of type subscription. Go to Product catalogue and click + Add product. Set the product name, price and billing period, feel free to add other details. For both products, note the price ID.

  4. Create a webhook by going to Developers > Webhooks. Click + Add endpoint, add Endpoint URL as <your-domain>/api/payments/checkout-webhook. Select all Checkout and Subscription Schedule events and add them. Then save the webhook. Note the signing secret.

  5. Add the Publishable Key, Secret key, price IDs and webhook signing secret to the .env file.

NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
STRIPE_TEAM_TIER_PRICE_ID=
STRIPE_ENTERPRISE_TIER_PRICE_ID=
  1. Done! You can now test the flow by going to http://localhost:3000/billing.

After subscribing users are able to manage their subscription by initialising Stripe Billing portal at /billing.

Refer to Stripe docs (opens in a new tab) to learn more.

Emails [PRO]AI [PRO]