Create a Shopping Cart with the useState React Hook to Manage Product Quantity and Total

InstructorColby Fayock

Share this video with your friends

Send Tweet

If we're fortunate enough, not only will people want to buy one item from our store, they'll want to buy multiple. To do that, we need to provide a shopping cart, which allows us to store what items the customer wants to buy, how many of them, and how much these items will cost.

To do this, we can take advantage of React's built-in state management hooks to make sure we're accurately keeping track of their order.

We will save our cart data in useState that will be used to calculate the subtotal, total items, and total price that our customer has in their cart. During this process, we will move the Stripe Checkout flow out of our Product Cards and into a new checkout section. The product cards will add items to the state that we create.