Web DevelopmentIntermediate 3 to 5 hours

Implement Stripe Checkout

Build a secure payment flow using the industry standard Stripe API.

The Scenario

The coffee shop wants to sell bags of beans online. You need to build the checkout button. When clicked, it should redirect the user to a secure Stripe Checkout session, and then return them to a "Success" or "Cancel" page on your site.

The Brief

Build a Next.js (or Express) backend route that creates a Stripe Checkout Session using the Stripe Node.js SDK. Then, build the frontend React button that calls this route and redirects the user to the Stripe hosted payment page. Handle the redirect back to your app.

Deliverables

  • The Backend route code that initializes the `stripe.checkout.sessions.create` call
  • The Frontend code handling the button click and the redirect
  • An explanation of why prices should be calculated on the backend, not the frontend

Submission Guidance

Security is paramount. Never pass the final price from the client to the server; the server must look up the price based on the product ID to prevent tampering.

Submit Your Work

Your submission is graded against the rubric on the right. If you pass, you get a public Badge URL you can share on LinkedIn. There is no draft save, so work offline first and paste your finished response here.

This appears on your public Badge.

0/20000 charactersMarkdown supported

One per line or comma separated. Up to 5 links.

By submitting, you agree your submission text, name, and evaluation will appear on a public Badge URL.