English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 92 lectures (13h 2m) | 4.61 GB
JUST UPDATED! Build an eCommerce platform from the ground up with React, Redux Toolkit, Express & MongoDB
This is a single-project course, meaning that we spend almost 13 hours building an eCommerce shop using the MERN stack along with Redux Toolkit. We start from absolute scratch with an empty folder. You will learn everything from setting up a server, modeling data, creating a MongoDB database, seeding data, creating the UI, managing state with Redux, authentication with JWT and much much more.
The ProShop platform that we will be building will include the following features:
- Full-featured shopping cart with quantity
- Product reviews and ratings
- Top products carousel
- Product pagination
- Product search feature
- User profile with orders
- Admin product management
- Admin user management
- Admin Order details page
- Mark orders as delivered option
- Checkout process (shipping, payment method, etc)
- PayPal / credit card integration
- Custom database seeder script
This is not a documentation-type course. This is a “jump in and get your hands dirty” course where by the end, you have an actual real-world project to use and put on your portfolio. You will learn the following by completing this course..
- React with functional components & hooks
- React router
- React-Bootstrap UI library
- How to structure components
- Component level state & props
- Managing global state with Redux (Actions & Reducers)
- Using Redux state in components (useDispatch & useSelector)
- Creating an extensive back end with Express
- Working with a MongoDB database and the Mongoose ODM
- JWT authentication (JSON web tokens) with HTTP-Only cookie
- Creating custom authentication middleware
- Custom error handler
- Integrating the PayPal API
- Environment variables
- Project deployment
- Much more!
What you’ll learn
- Build a custom eCommerce platform with React, Redux, Node, Express & MongoDB
- An actual real-world project built in a linear and progressive manner
- JWT Authentication Stored In An HTTP-Only Cookie
- Full featured shopping cart with PayPal & credit/debit payments
- Admin area to manage customers, products & orders
- Product Rating & Review System
- Product Search, Carousel, Pagination & More
Table of Contents
Introduction
1 Welcome To The Course
2 Course Project Intro
3 Course Code Repo
4 Getting Setup
Starting The Front End
5 React Setup & Git Initialize
6 Header & Footer Componenets
7 Custom Bootstrap Theme
8 List Products
9 Implement React Router
10 Rating Component
11 Product Details Page
Serving & Fetching Data
12 Full Stack Workflow & Explanation
13 Express Server & Initial Product Routes
14 Nodemon & Concurrently
15 Environment Variables
16 Fetch Products
Starting MongoDB & Mongoose
17 MongoDB Atlas Setup
18 MongoDB Compass Setup
19 Connect With Mongoose
20 Modeling Our Data
21 Prepare Sample Data
22 Seeding Sample Data
23 Getting Started With Postman
24 Get Products From Database
25 Custom Error Middleware
26 Product Controller
Redux Toolkit Setup & State Management
27 Redux & State Overview
28 Redux Store & API Slice
29 Products API Slice & Get Products Endpoint
30 Get Product Details Endpoint Challenge
31 Loader & Message Components
Shopping Cart Functionality
32 Cart Slice & Reducer
33 Add To Cart Function
34 Qty & Add To Cart Handler
35 Cart Utils File
36 Item Count In Header
37 Cart Screen
38 Remove From Cart
Backend Authentication
39 User Routes & Controller
40 User Email & Password Validation
41 How Do JSON Web Tokens Work
42 JWT HTTP Only Cookie
43 Auth Middleware & Endpoint
44 Logout User & Clear Cookie
45 User Register Endpoint & Encryption
46 User Profile Endpoints
Frontend Authentication
47 Auth & User API Slice
48 Login Screen
49 Login Functionality
50 User Logout
51 User Registration
Checkout Process – Part 1
52 Shipping Screen
53 Private Routes
54 Checkout Steps Component
55 Payment Method
56 Order Routes & Controller
57 Create & Get Orders
58 Order API Slice & Start Order Screen
59 Creating An Order
Checkout Process – Part 2
60 Order Page
61 PayPal Setup & Order Paid
62 React -PayPal Integration
63 PayPal Buttons
64 User Profile & Update
65 Display Order History
Admin Functionality
66 Admin Route Component
67 List Orders For Admin
68 Deliver Order Status
69 List Products For Admin
70 Creating Products
71 Edit Product
72 Update Product Bug Fix
73 Multer & Image Upload Endpoint
74 Upload Product Image – Frontend
75 Delete Products
76 Backend User Routes
77 List Users For Admin
78 Delete Users
79 Update Users
Reviews, Search & More
80 Create Reviews – Backend
81 Create Reviews – Frontend
82 Paginate Products
83 Paginate Component
84 Search Products
85 Search Box Component
86 Product Carousel
87 Page Titles
Deploy To Production
88 Prepare For Production
89 Deploy To Render
90 Add Server IP To MongoDB Atlas
91 Adding a Custom Domain
92 Wrap Up
Resolve the captcha to access the links!