Stripe Checkout Shopping Cart

Description

The goal of this project was to create a minimal shopping cart that integrated with Stripe’s Checkout api. I created a responsive site with a product catalog page and side checkout cart. When the user is ready to checkout, the cart redirects to Stripe Checkout which handles all the payment processing. This is a very light weight shopping cart solution for small businesses with low volume, until they can upgrade to a more feature rich offering such as Shopify.

Tricky Bits

Stripe’s checkout does not offer dynamic shipping rates based on the customer’s location. For example, if the site is based in the US and I am a customer from Mexico, Stripe Checkout out of the box only offers fixed rates. The workaround to this is to pass in location specific shipping rates by creating a checkout session.

Here’s a link to the test shopping cart.

Checkout cart screenshot

Tech used

  • React
  • Stripe API
  • Theme-UI for CSS
  • Netlify functions