MERN Stack From Scratch
13h 32m 38s
English
Paid
November 20, 2023
We spend 12 hours creating this project from scratch. It includes a multi-step checkout process with PayPal integration, product search, rating & review, user profiles with order tracking, admin functionality and more.
More
What you'll learn
- Create user interfaces with React & React Bootstrap UI library
- Manage state elegantly with Redux & Redux Toolkit
- Create an advanced API with Node.js, Express & MongoDB
- Authentication with JWT & HTTP-Only cookies
- Custom middleware for error handling, auth & more
- Mongoose models, controllers & routes
- Full stack structure & workflow
- Deploy to production, setup domain, SSL, etc
Watch Online MERN Stack From Scratch
Join premium to watch
Go to premium
# | Title | Duration |
---|---|---|
1 | Welcome To The Course | 02:58 |
2 | Course Project Intro | 07:02 |
3 | ProShop Code Repo | 01:50 |
4 | Premium Docs | 01:53 |
5 | Getting Setup | 04:41 |
6 | Create React App & Git Setup | 10:11 |
7 | Header & Footer Component | 10:06 |
8 | Custom Bootstrap Theme | 03:39 |
9 | List Products | 08:46 |
10 | Implement React Router | 08:04 |
11 | Rating Component | 08:12 |
12 | Product Details Page | 09:54 |
13 | Full Stack Workflow Explanation | 03:42 |
14 | Express Server & Initial Product Routes | 09:55 |
15 | Nodemon & Concurrently | 04:29 |
16 | Environment Variables | 03:31 |
17 | Fetch Products | 09:46 |
18 | MongoDB Atlas Setup | 05:04 |
19 | MongoDB Compass Setup | 01:46 |
20 | Connect With Mongoose | 04:42 |
21 | Modeling Our Data | 13:58 |
22 | Prepare Sample Data | 04:52 |
23 | Seed Sample Data | 14:21 |
24 | Getting Started With Postman | 05:34 |
25 | Get Products From Database | 12:22 |
26 | Custom Error Middleware | 07:34 |
27 | Product Controller | 05:38 |
28 | Redux & State Overview | 07:14 |
29 | Redux Store & API Slice | 14:17 |
30 | Products API Slice & Get Products Endpoint | 13:03 |
31 | Get Product Details Endpoint Challenge | 05:28 |
32 | Loader & Message Components | 05:55 |
33 | Cart & Slice Reducer | 04:38 |
34 | Add To Cart Function | 11:23 |
35 | Qty & Add To Cart Handler | 15:59 |
36 | Cart Utils File | 03:10 |
37 | Item Count In Header | 06:01 |
38 | Cart Screen | 21:49 |
39 | Remove From Cart | 06:28 |
40 | User Routes & Controllers | 20:19 |
41 | User Email & Password Auth | 10:51 |
42 | How JWT Works | 03:54 |
43 | JWT HTTP-Only Cookie | 08:28 |
44 | Auth Middleware & Endpoint | 14:12 |
45 | Logout User & Clear Cookie | 03:15 |
46 | User Register Endpoint & Encryption | 10:16 |
47 | User Profile Endpoints | 06:15 |
48 | Auth & User API Slice | 08:32 |
49 | Login Screen | 07:36 |
50 | Login Functionality | 19:39 |
51 | User Logout | 06:58 |
52 | User Registration | 08:54 |
53 | Shipping Screen | 13:20 |
54 | Private Route Component | 03:46 |
55 | Checkout Steps Component | 05:39 |
56 | Payment Method | 09:59 |
57 | Order Routes & Controller | 15:43 |
58 | Create & Get Orders | 05:25 |
59 | Order API Slice & Start Order Screen | 08:16 |
60 | Create & Get Orders | 18:20 |
61 | Oder Page | 14:47 |
62 | PayPal Setup & Mark As Paid | 05:53 |
63 | React - PayPal Integration | 12:23 |
64 | PayPal Buttons | 12:40 |
65 | User Profile & Update | 15:46 |
66 | Display Order History | 09:21 |
67 | Admin Route Component | 07:13 |
68 | List Orders For Admin | 06:51 |
69 | Deliver Order Status | 06:07 |
70 | List Products For Admin | 09:42 |
71 | Creating Products | 09:01 |
72 | Edit Product | 21:58 |
73 | Update Product Bug Fix | 01:16 |
74 | Multer & Image Upload Endpoint | 09:36 |
75 | Upload Product Image - Frontend | 08:08 |
76 | Delete Products | 07:13 |
77 | Backend User Routes | 04:27 |
78 | List Users For Admin | 07:25 |
79 | Delete Users | 04:05 |
80 | Update Users | 14:58 |
81 | Create Reviews Backend | 04:45 |
82 | Create Reviews Frontend | 13:06 |
83 | Paginate Products | 07:14 |
84 | Paginate Component | 09:27 |
85 | Search Products | 09:54 |
86 | SearchBox Component | 06:54 |
87 | Product Carousel | 07:06 |
88 | Page Titles | 07:14 |
89 | Prepare For Production | 05:10 |
90 | Deploy To Render | 09:58 |
91 | Add Server IP To MongoDB Atlas | 01:10 |
92 | Add A Custom Domain Name | 04:22 |
93 | Wrap Up | 01:37 |
94 | Small Fixes | 12:19 |
95 | PayPal & Price Calculate Fixes | 14:00 |
Similar courses to MERN Stack From Scratch
React Supabase Full Course
Duration 1 hour 39 minutes 49 seconds
Course
React Testing Library and Jest: The Complete Guide
Duration 7 hours 40 minutes 24 seconds
Course
MongoDB
Duration 3 hours 3 minutes 57 seconds
Course
Stripe Payments JavaScript Course
Duration 1 hour 29 minutes 26 seconds
Course
Node JS Cluster with PM2, RabbitMQ, Redis and Nginx
Duration 2 hours 24 minutes 39 seconds
Course
Build a Slack Chat App with React, Redux, and Firebase
Duration 5 hours 55 minutes 18 seconds
Course
Complete Node.js Developer in 2023: Zero to Mastery
Duration 46 hours 5 seconds
Course
MERN Invoice Web App with Docker,NGINX and ReduxToolkit
Duration 24 hours 38 minutes 4 seconds
Course