Creating an Impressive Ecommerce Website with React JS, Firebase, & Stripe.js
Welcome to my channel, your ultimate source for mastering the art of Creating an Impressive Ecommerce Website with React JS, Firebase, & Stripe.js from scratch. I will walk you through the process of building an impressive e-commerce website using these modern tools and technologies. From setting up the project to deploying it live, I will cover every step in detail. This tutorial is perfect for beginners who want to learn how to create an e-commerce website with React JS, Firebase, and Stripe.js. By the end of this video, you will have a solid understanding of how to create an e-commerce website from scratch and be able to confidently build your own projects. So, grab your laptops, and let's get started!
What You'll Achieve:
Learn to build a fully functional online store from the ground up.
In-depth tutorials on React, Stripe Checkout, TailwindCSS, and Firebase.
Expert insights and best practices.
Stay ahead of the curve with the latest web development trends and techniques.
Stay in the loop and keep your skills sharp by subscribing to our channel today! Explore the future of web development and embark on your journey to create a state-of-the-art e-commerce website.
TIMESTAMPS:
0:00 - Introduction
0:10 - Project preview
1:10 - Creating the project using npx
3:50 - Setting up the VS code environment
6:21 - Tailwindcss setup
11:55 - Creating Header Component
24:40 - Creating Banner Component
25:20 - Creating a custom Slider
28:50 - Configuring react-icons
35:45 - Creating Product Component
35:55 - Creating Footer Component
51:20 - Setting up React-router-dom
52:40 - Creating Dynamic Layout
57:20 - Creating API to fetch product data
59:00 - Passing product Data using loader from react-router-dom
1:02:25 - Creating ProductCard Component to show the products
1:24:40 - Creating Dynamic product Info page for each product
1:39:32 - redux-tookits configuration
1:41:55 - Creating Slicers and implementing that using dispatch
1:56:19 - Configuring React-tostify
2:02:23 - Creating Cart page
2:26:20 - Configuring redux-persist to save the product in real-time
2:30:20 - Creating Login Page
2:34:26 - Creating & Configuring Firebase app
2:38:35 - Creating Google login & logout method using firebase
2:56:25 - Implementing Stripe Checkout for Payment
3:00:15 - Creating Backend Server to configure Stripejs
3:11:50 - Testing the payment method
product data:
