MERN eCommerce From Scratch

14h 49m 45s
English
Paid

Course description

There are a lot of "eCommerce" courses out there, but most use some kind of prebuilt plugin or platform. In this course, we will build a completely customized eCommerce / shopping cart application from scratch with the MERN stack with the following functionality...

Read more about the course
  • Full featured shopping cart

  • 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)

  • Creating custom authentication middleware

  • Custom error handler

  • Integrating the PayPal API

  • Environment variables

  • Project deployment

  • Much more!

Watch Online

Join premium to watch
Go to premium
# Title Duration
1 Welcome To The Course 01:33
2 ProShop Project Demo 07:17
3 Resources & Environment 07:44
4 React Setup & Git Initialize 12:13
5 React-Bootstrap Setup, Header & Footer Components 14:40
6 HomeScreen Product Listing 10:32
7 Rating Component 13:46
8 Implementing React Router 07:35
9 Product Details Screen 11:23
10 Front End / Back End Workflow & Explanation 04:06
11 Serving Products - Back End Routes 07:19
12 Fetching Products From React (useEffect) 11:17
13 Nodemon & Concurrently Setup 05:31
14 Environment Variables 04:21
15 ES Modules In Node.js 04:26
16 MongoDB Atlas & Compass Setup 07:31
17 Connecting To The Database 05:16
18 Adding Colors To The Console (Optional) 03:11
19 Modeling Our Data 14:55
20 Preparing Sample Data 04:40
21 Data Seeder Script 10:31
22 Fetching Products From The Database 09:18
23 Getting Started With Postman 05:26
24 Custom Error Handling 10:37
25 An Overview Of Redux 05:21
26 Create a Redux Store 08:55
27 Product List Reducer & Action 13:54
28 Bringing Redux State Into HomeScreen - useDispatch & useSelector 08:51
29 Message & Loader Components 04:57
30 Product Details Reducer & Action 11:08
31 Qty Select & Add To Cart Button 10:09
32 Cart Reducer & Add To Cart Action 11:45
33 Add To Cart Functionality 09:47
34 Cart Screen 17:13
35 Remove Items From Cart 04:37
36 Clean Up By Using Controllers 05:30
37 User Authentication Endpoint 13:27
38 Brief Explanation of JWT (JSON Web Tokens) 03:57
39 Generate a JSON Web Token 04:58
40 Custom Authentication Middleware 16:21
41 Saving The Token In Postman 02:28
42 User Registration & Password Encryption 09:51
43 User Login Reducer & Action 10:36
44 User Login Screen & Functionality 16:56
45 Show User In Navbar & Logout 07:46
46 User Register Reducer, Action & Screen 11:39
47 Update Profile Endpoint 07:19
48 Profile Screen & Get User Details 16:51
49 Update User Profile 09:20
50 Shipping Screen & Save Address 14:49
51 Checkout Steps Component 05:21
52 Payment Screen & Save Payment Method 10:47
53 Place Order Screen 21:24
54 Order Controller & Route 06:02
55 Create Order 15:26
56 Get Order by ID Endpoint 05:25
57 Order Details Reducer & Action 04:21
58 Order Screen 12:15
59 Update To Paid Endpoint 04:41
60 Order Pay Reducer & Action 06:15
61 Adding PayPal Payments 19:48
62 Show Orders On Profile 18:04
63 User Details & Orders Reset 04:53
64 Admin Middleware & Get Users Endpoint 05:13
65 Admin User List 16:54
66 Admin Screen Access Security 05:30
67 Admin User Delete 11:44
68 Get User By ID & Update User Endpoints 08:07
69 User Edit Screen & Get User Details 10:12
70 Update User Functionality 10:09
71 Admin Product List 08:07
72 Admin Delete Products 13:42
73 Create & Update Product Endpoints 12:33
74 Admin Create Product 09:49
75 Edit Product Screen 11:26
76 Admin Update Product 09:09
77 Image Upload Config & Endpoint 13:11
78 Front End Image Upload 06:59
79 Admin Order List 13:38
80 Mark Order As Delivered 14:50
81 Morgan & Create Review Endpoint 12:01
82 Front End Product Reviews 22:48
83 Product Search 11:06
84 Product Pagination 24:48
85 Top Products Carousel 15:55
86 Custom Page Titles & Meta 10:05
87 Prepare For Deployment 06:24
88 Deploy To Heroku 17:10

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Master Full-Stack Web Development | Node, SQL, React, & More

Master Full-Stack Web Development | Node, SQL, React, & More

Sources: udemy
Build a fullstack project with Node.js, PostgreSQL, SQL, React, Redux and more! Covers APIs, authentication, and beyond!
18 hours 36 minutes 51 seconds
The Modern React 18 Bootcamp - A Complete Developer Guide

The Modern React 18 Bootcamp - A Complete Developer Guide

Sources: udemy
In this course we will take you from a React 18 novice to a job ready engineer. This course is loaded with practical projects and examples so that you can truly
20 hours 35 minutes 57 seconds
Epic React (Epic React Pro)

Epic React (Epic React Pro)

Sources: Kent C. Dodds
Building React applications demands that you make expert decisions before you write the first line of code. You're responsible for building a cohesive, maintainable code-base th...
27 hours 57 minutes 10 seconds
React, NodeJS, Express & MongoDB - The MERN Fullstack Guide

React, NodeJS, Express & MongoDB - The MERN Fullstack Guide

Sources: udemy
Building fullstack applications (i.e. frontend + backend) with the MERN stack is very popular - in this course, you will learn it from scratch at the example of a complete proje...
18 hours 45 minutes 10 seconds
Node, SQL, & PostgreSQL - Mastering Backend Web Development

Node, SQL, & PostgreSQL - Mastering Backend Web Development

Sources: udemy
Become an in demand software engineer by taking this course on Node, SQL, PostgreSQL, and backend web development. As one of the most popular web development st
4 hours 59 minutes 41 seconds