YoVDO

Build a Shopping Cart With React JS and Stripe

Offered By: Traversy Media via YouTube

Tags

React Courses Web Development Courses React Router Courses Stripe Courses

Course Description

Overview

Learn to build a fully functional shopping cart application using React JS and Stripe in this comprehensive tutorial video. Explore the step-by-step process of creating a dynamic e-commerce store, from setting up the React environment to implementing Stripe for secure payments. Master essential concepts such as component creation, React Router implementation, state management with context, and integrating third-party APIs. Follow along as the instructor guides you through building the user interface, managing product data, handling cart functionality, and setting up an Express server for Stripe integration. By the end of this hands-on tutorial, you'll have the skills to create a professional-grade shopping cart system with React and Stripe.

Syllabus

Project showcase
Create react app / installs
Navbar component
Implementing React Router
Creating pages for router
Building rows and cols for Store page
Creating products for React to use
Loading products dynamically
Creating product card component
Creating a modal for the cart
Creating our cart context Cart functionality
Adding CartProvider to our app
Creating add / remove product to product cards
Adding cart functionality to navbar number of items
Showing cart data in modal
Creating CartProduct component
Create Stripe account and add test products
Creating Express server / installs
Creating Stripe checkout request
Adding Stripe IDs to React
Creating checkout call from React
Final project / checkout demo!
Thank you for watching


Taught by

Traversy Media

Related Courses

Introduction to ReactJS
Microsoft via edX
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Multiplatform Mobile App Development with React Native
The Hong Kong University of Science and Technology via Coursera
Client-based Web Applications development: ReactJS & Angular
Universidad Politécnica de Madrid via Miríadax
React
Udacity