Setting Up Stripe
To integrate Stripe into your application, you’ll need to configure some environment variables and set up the Customer Portal. Follow these steps to get everything set up.
Table of Contents
Getting Stripe Keys
Before you proceed, ensure you have a Stripe account. If you don't, create one at Stripe's website (opens in a new tab).
To start using Stripe, you need to obtain your API keys and configure them in your environment variables.
-
Access Your Stripe Dashboard:
- Log in to your Stripe Dashboard (opens in a new tab).
-
Navigate to API Keys:
- In the left-hand menu, click on Developers.
- Select API keys.
-
Obtain Your Keys:
- Publishable Key: This key is used on the client-side of your application. Copy the key labeled Publishable key.
- Secret Key: This key is used on the server-side of your application. Copy the key labeled Secret key.
-
Add Keys to Your
env.local
File:-
Open the
env.local
file located in your project’s root directory. -
Add the following lines to your
env.local
file, replacing the placeholder text with your actual keys:NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY={your_publishable_key_here} STRIPE_SECRET_KEY={your_secret_key_here}
-
Save the
env.local
file after adding the keys.
Note: For local development, consider using the test keys available in your Stripe Dashboard under the "View test data" mode. Switch to live keys when deploying to production.
-
Customer Billing Portal
To allow users to manage their subscriptions and payment methods, you'll need to enable the Stripe Customer Portal. Follow these steps to set it up:
-
Enable the Customer Portal:
- Go to Stripe's Customer Portal settings (opens in a new tab) in your Stripe Dashboard.
- In the Customer Portal settings page, locate the option to enable the portal. Click the toggle or button to enable it.
-
Customize the Portal (Optional):
- Stripe provides options to customize the look and functionality of the portal. Adjust settings according to your needs, such as branding, language, and features available to users.
-
Integrate the Portal into Your Application:
- Once the portal is enabled, users can access their Stripe account to manage subscriptions, payment methods, invoices, and more.
- SaaSavant includes a pre-made user account page with a link that directs users to their Stripe portal. Ensure that this link is correctly integrated into your product by.