Stripe
SaaSBold comes with Stripe integration for managing payment and subscriptions. This part of the documentation will show you how to integrate Stripe into your SaaS Boilerplate.
Note: If you want to use LemonSqueezy for integration skip this. Follow the LemonSqueezy guide for integrating subscriptions.
Getting the Stripe Secret Key
To get the Stripe secret key you have to have a Stripe account. If you don’t have one go ahead and create it.
For this integration, we are using the Test Mode. Before you deploy your site, Activate your Stripe account and integrate it with a real Secret Key.
Go to the Developers tab.
Then go to the API Keys tab, after that scroll down to the Secret Key and copy it.
Now add it to the .env file.
Creating the Subscription plans
Now that we got the keys, let’s create a subscription plan.
Login to your stripe account.
Go to Products and click on the Add a product button.
Fill out all the information. And make sure to choose Recurring payment.
Getting the Subscription data
Now that we created the subscription successfully, we have to get the subscription plan data to use it on our app.
To update the data open up the pricing/pricingData.ts file.
Go to your stripe Dashboard-> Product catalog and open up your product.
Get the Name, Price, and price_id
Note: For the price make sure to multiply it by 100, it’s just a convention stripe use. For example, $5 becomes 500
Webhook Integration
We've integrated Stripe, created subscription plans, and loaded the data on the pricingData.ts file. Now, we will have to integrate stripe webhook to save the subscription data on the Database.
First, we are going to see how to enable Webhook for testing locally, then we are going to see how we can enable it for production.
Webhook integration for local development
Go to Developers->Webhooks->Add local listener
Select Test in a local environment
Install Stripe CLI and login to stripe
Run this command to forward the event to the webhook. I’ve added this script to the package.json file
It'll start the webhook server and give us the webhook secret. Copy the secret (whsec_...) from the terminal and save it on the env file.
Now when you make a purchase it'll update the user's table on the Database.
You'll see these entries got updated with the appropriate data.
stripe_current_period_end stripe_customer_id stripe_price_id stripe_subscription_id
Webhook integration for production
Go to Developers->Webhooks->Add an endpoint
Now add the webhook URL, which is yoursite.com/api/stripe/webhook. After that select the Latest API version from the dropdown.
Click on the Select events button.
Check the Select all events and then click on the Add events button.
After that scroll down and click on the Add endpoint button.
We are almost done. One last thing we have to do is get the Webhook secret for the live site and add that to the .env file.
After you’ve added the endpoint you’ll see something like this. Click on Reveal it'll give you a new webhook secret for the live site.
Update the env with the new secret.
Last updated
