Stripe Provider
Learn how to integrate Stripe as your payment provider.
Overview
Stripe is the most popular payment processor, offering comprehensive features for both one-time and subscription payments. It's battle-tested, feature-rich, and trusted by millions of businesses worldwide.
Setup
1. Create a Stripe Account
- Sign up at https://stripe.com
- Complete your account setup
- Navigate to the Dashboard
2. Get Your API Keys
- Go to Developers → API keys in your Stripe Dashboard
- You'll find two types of keys:
- Secret key: Used in your backend (starts with
sk_)
- Secret key: Used in your backend (starts with
For Development:
- Use test mode keys (toggle "View test data" in the dashboard)
- Test keys start with
pk_test_andsk_test_
For Production:
- Use live mode keys
- Live keys start with
pk_live_andsk_live_
3. Create Products and Prices
- Go to Products → Add product in your Stripe Dashboard
- Create a product (e.g., "Pro Plan")
- Add pricing:
- For subscriptions: Choose "Recurring" and set the interval (monthly/yearly)
- For one-time: Choose "One time"
- Set the price amount and currency
- After creating, copy the Price ID (starts with
price_)
Example Products:
- Lifetime Plan: One-time payment → Price ID:
price_1ABC123 - Pro Monthly: Recurring monthly → Price ID:
price_2DEF456 - Pro Yearly: Recurring yearly → Price ID:
price_3GHI789
4. Set Up Webhooks
Webhooks allow Stripe to notify your application about payment events.
For Local Development (using Stripe CLI):
- Install the Stripe CLI: https://stripe.com/docs/stripe-cli
- Login:
stripe login - Forward webhooks to your local server:
stripe listen --forward-to http://localhost:3000/api/webhooks/stripe - Copy the webhook signing secret (starts with
whsec_) to your.env.local
For Production:
- Go to Developers → Webhooks in Stripe Dashboard
- Click Add endpoint
- Set the endpoint URL:
https://yourdomain.com/api/webhooks/stripe - Select events to listen to based on your payment types:
For One-Time Payments:
checkout.session.completed(required) - Records the purchase when checkout completes
For Subscriptions:
customer.subscription.created(required) - Creates subscription recordcustomer.subscription.updated(required) - Updates subscription status/plancustomer.subscription.deleted(required) - Removes subscription when canceled
If you use both payment types, select all events above.
- Copy the Signing secret to your environment variables
5. Configure Environment Variables
Add these variables to your .env.local file:
# Stripe Secret Key (backend)
STRIPE_SECRET_KEY=sk_test_xxxxxxxxxxxxx
# Stripe Webhook Secret (for webhook verification)
STRIPE_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxx
# Your Product Price IDs
NEXT_PUBLIC_PRICE_ID_LIFETIME=price_xxxxx
NEXT_PUBLIC_PRICE_ID_PRO_MONTHLY=price_xxxxx
NEXT_PUBLIC_PRICE_ID_PRO_YEARLY=price_xxxxxConfiguration
Set Stripe as your payment provider in config/index.ts:
export const config = {
payments: {
provider: "stripe",
plans: {
lifetime: {
recommended: true,
prices: [
{
type: "one-time",
productId: process.env.NEXT_PUBLIC_PRICE_ID_LIFETIME as string,
amount: 199,
currency: "USD",
},
],
},
pro: {
recommended: false,
prices: [
{
type: "subscription",
productId: process.env.NEXT_PUBLIC_PRICE_ID_PRO_MONTHLY as string,
amount: 19,
currency: "USD",
interval: "month",
},
{
type: "subscription",
productId: process.env.NEXT_PUBLIC_PRICE_ID_PRO_YEARLY as string,
amount: 190,
currency: "USD",
interval: "year",
},
],
},
},
},
};Testing
Stripe provides test card numbers for testing payments:
Successful Payment:
- Card:
4242 4242 4242 4242 - Any future expiry date (e.g., 12/34)
- Any 3-digit CVC
More test cards: https://stripe.com/docs/testing
Affiliate Tracking
With Rewardful
Add the referral ID as client_reference_id:
export const config = {
affiliate: {
enabled: true,
provider: "rewardful",
},
};With PromoteKit
Add the referral ID to metadata:
export const config = {
affiliate: {
enabled: true,
provider: "promotekit",
},
};The payment provider will automatically handle referral tracking based on your configuration.
Advanced Features
Trial Periods
Add trial periods to your subscriptions:
{
type: "subscription",
productId: process.env.NEXT_PUBLIC_PRO_PRICE_ID as string,
amount: 19,
currency: "USD",
interval: "month",
trialPeriodDays: 14, // 14-day free trial
}Seat-Based Billing
Enable quantity-based pricing:
{
type: "subscription",
productId: process.env.NEXT_PUBLIC_ENTERPRISE_PRICE_ID as string,
amount: 99,
currency: "USD",
interval: "month",
seats: {
min: 5,
max: 100,
},
}