Create a Stripe Customer with Next.js API Routes
Every transaction in Stripe is associated with a customer. Since we want our user to be able to see their transaction history in Stripe, we need to keep a track of their customer ID in our profile table.
In this video, we create a new Stripe account and configure our Next.js application to use its publishable and secret API keys. Additionally, we discuss by adding NEXT_PUBLIC_ to our environment variable names, it exposes them to the client - running in the user's browser. This is entirely safe for our publishable key - which can be public - but not our secret key - which should always be kept private.
To create a Stripe customer, we need to use our private API key, meaninh this logic will need to be executed on the server. Next.js makes this simple with API routes - special serverless functions that will be created for any .js files in the pages/api directory.
We create a new API route to handle adding a stripe customer and updating the user's profile with their customer ID.
Autoformatting question - What configuration or extensions do you use/recommend (for whichever tool), for automatically wrapping-and-indenting chained method calls, like what I see happening with your supabase calls?
I am using Prettier, installed as an extension in VS Code.
FYI, I installed stripe v9.1.0 and struggled a bit with initializing it. ended up with something like that:
// create-stripe-customer.ts
import Stripe from 'stripe'
...
const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!, {
apiVersion: '2020-08-27',
})and it works fine.
Excellent call out! Thanks! 🙌