Integrate Stripe Checkout to Purchase Products in Next.js with Stripe @stripe/stripe-js Cl

InstructorColby Fayock

Share this video with your friends

Send Tweet

Now that we have an app and our products configure in Stripe, it's time to connect the two and give people a way to purchase our products.

Using Stripe's API, we can initiate a new instance of the Stripe Checkout flow with a simple click of a button.

We'll create an initiateCheckout function that handles this flow for us. After loading stripe through @stripe/stripe-js we'll await a stripePromise that will allow us to redirect to stripes checkout flow. You'll notice that we will need to pass in line items with the price id and quantity.