MERN Stack React Node Ecommerce from Scratch to Deployment

Focused View

Ryan Dhungel

16:13:02

102 View

01 - Introduction

001 Course introduction.mp4

01:59

002 Are you ready for this course.mp4

04:15

003 Are you new to JavaScript React and NodeJs.html

004 Course roadmap (optional).mp4

09:50

02 - Node - Project Setup

001 Download source code for all the lectures from Github.html

002 Express server.mp4

09:03

003 Mongoose version.html

004 Using MongoDB Atlas.mp4

01:42

005 Signup with MongoDB Atlas.html

006 Resources to install MongoDB and Robo3T (optional).html

007 Connecting to MongoDB.mp4

03:22

008 Routes.mp4

04:45

009 Controllers.mp4

04:52

03 - Node - User Signup and Signin

001 User schema.mp4

05:42

002 Virtual fields and methods.mp4

05:19

003 User signup.mp4

05:59

004 Using Postman to signup user.mp4

05:14

005 Error handler method and UUID solution.html

006 Friendly error message.mp4

04:43

007 Using the right version of express-validator for the next lecture.html

008 Using express validator.mp4

09:17

009 User signin using JWT.mp4

10:07

010 Using Postman to signin user.mp4

04:12

011 User signout.mp4

02:02

04 - Node - Auth and Admin Middlewares

001 Express JWT Error - Algorithms should be set (for next lecture).html

002 Require signin middleware.mp4

03:16

003 Renaming from user to auth.mp4

02:39

004 User by id middleware.mp4

11:24

005 Auth and admin middlewares.mp4

07:49

05 - Node - Product and Categories

001 Category model route and controller.mp4

06:07

002 Creating category using postman.mp4

04:48

003 Product model.mp4

06:18

004 File upload code update.html

005 Create product with file upload.mp4

09:25

006 Creating product using postman.mp4

06:59

007 Create product validation.mp4

06:12

008 Product by id middleware and single product.mp4

07:25

009 Product delete.mp4

06:36

010 Product update.mp4

07:09

011 Category by id and single category.mp4

05:09

012 Category update delete and get all.mp4

09:46

06 - Node - Sending Products with Queries

001 Products by sell and arrival on request query params.mp4

09:38

002 Fetch products based on request query using postman.mp4

05:15

003 Related products.mp4

07:31

004 List product categories.mp4

03:21

005 Products by search source code.html

006 List products by search.mp4

07:32

007 Send product photo.mp4

03:45

008 User profile read and update.mp4

07:32

009 Installing CORS.mp4

01:49

07 - React - React Hooks (Optional)

001 Get up and running with React Hooks.html

002 React hooks.mp4

01:30

003 Why we used class components.mp4

00:50

004 Counter app using class.mp4

05:44

005 useState hook.mp4

03:48

006 useEffect hook.mp4

06:00

007 News app using hooks.mp4

06:38

008 Search news on input change.mp4

05:55

009 Controlling useEffects behaviour.mp4

04:43

010 Loading.mp4

03:10

011 Code Organization.mp4

04:23

08 - React - React App with Pages and Layouts

001 Create react app.mp4

02:53

002 React router version.html

003 Routing pages.mp4

08:38

004 Menu and active links.mp4

09:27

005 Shared layout component.mp4

07:41

006 Environment variables.mp4

03:08

09 - React - User Signup and Signin

001 Signup form handle change.mp4

10:20

002 User signup.mp4

10:04

003 User signup success and error.mp4

09:16

004 Code refactoring - Signup.mp4

03:08

005 User signin.mp4

08:21

006 Save user and token in local storage.mp4

05:11

007 User signout.mp4

05:24

008 Show and hide signin signout links conditionally.mp4

06:21

10 - React - Private and Admin Route with User Dashboard

001 Private route for authenticated users only.mp4

08:12

002 User dashboard.mp4

07:41

003 Links on user dashboard.mp4

05:13

004 Admin dashboard.mp4

02:58

005 Private route for admin.mp4

08:05

11 - React - Categories and Products

001 Add category component.mp4

10:26

002 Category create success and error.mp4

09:54

003 Create product part one.mp4

04:18

004 Create product part two.mp4

19:13

005 Create product part three.mp4

07:12

006 Create product with categories.mp4

13:13

007 Products by arrival and sell.mp4

10:04

008 Show products in card.mp4

07:37

009 Show product image.mp4

06:25

010 Jumbotron animation css source code.html

011 Styling buttons and jumbotron.mp4

04:33

12 - React - Shop Page with Search Filter by Category and Price Range

001 Shop page.mp4

03:29

002 Get categories in shop page.mp4

03:09

003 Show categories in shop sidebar.mp4

05:26

004 Handle categories toggle.mp4

07:33

005 Passing categories filter to parent component.mp4

04:29

006 Set filters with category.mp4

04:48

007 Fixed price range.mp4

04:41

008 Radio buttons for price range.mp4

07:24

009 Filter with price range.mp4

07:04

010 Show products by filter on shop page.mp4

11:23

011 Pass products to card component.mp4

05:02

012 Load more button.mp4

06:23

13 - React - Products Search

001 Search component.mp4

06:11

002 Search form.mp4

09:11

003 Implementing search.mp4

09:54

004 Backend implementation of search.mp4

11:37

005 Search message to users.mp4

04:56

14 - React - Product Page with Related Products

001 Single product component.mp4

09:07

002 Reuse card for single product.mp4

10:22

003 Product detail on single product page.mp4

10:08

004 Show related products.mp4

09:01

15 - React - Cart CRUD with LocalStorage

001 Solution to potential error on the next lecture (Add to cart).html

002 Add to cart.mp4

13:24

003 Cart items total in menu.mp4

05:05

004 Show products in cart page.mp4

10:00

005 Conditionally show hide add to cart.mp4

02:56

006 Product quantity update in cart.mp4

11:44

007 Remove product from cart.mp4

07:13

008 Cart total.mp4

09:10

16 - Payment Gateway (Credit Card and PayPal) with Braintree

001 Braintree as payment gateway.mp4

03:39

002 Signup to braintree.mp4

03:59

003 Braintree setup backend.mp4

09:55

004 Braintree setup frontend.mp4

12:35

005 Handling payment frontend.mp4

08:16

006 Processing payment backend.mp4

03:44

007 Successful transaction.mp4

10:37

008 Empty cart after successful purchase.mp4

03:18

009 Activate paypal payment.mp4

05:43

010 Steps to create paypal sandbox account.mp4

05:36

17 - Orders

001 Order routes and controller setup - Backend.mp4

03:27

002 Create order - Frontend.mp4

06:36

003 Order and CartItem model source code.html

004 Save orders in the database.mp4

11:13

005 Save delivery address of orders.mp4

02:14

006 Push orders to users purchase history.mp4

07:33

007 Update sold products quantity.mp4

06:55

008 List all orders for admin.mp4

03:47

009 Fetch all orders for admin.mp4

07:42

010 Loop through orders.mp4

08:54

011 Show product details of each order.mp4

05:19

012 enum status values of each order.mp4

10:16

013 Find order by id and update order status.mp4

06:19

014 Update order status by admin.mp4

04:31

18 - User Profile

001 User profile update methods.mp4

09:40

002 Get user info for profile update.mp4

08:23

003 User profile update.mp4

10:42

004 User purchase history - Backend.mp4

03:12

005 User Purchase history function source code.html

006 User purchase history - Frontend.mp4

11:12

19 - Manage Orders and Products by Admin

001 Manage products for admin.mp4

03:53

002 Product CRUD requests.mp4

05:57

003 Products list and delete single product.mp4

09:43

004 Get all products for admin CRUD.mp4

03:43

005 Product Update.mp4

15:56

20 - Deployment, Domain, CDN and Free SSL

001 Code Snippets.html

002 Deploy to Digital Ocean Part 1.mp4

07:20

003 Deploy to Digital Ocean Part 2.mp4

12:08

004 Update user role to Admin in production.mp4

01:57

005 Fully functioning Ecommerce app in production.mp4

03:03

006 Adding a Domain name.mp4

03:02

007 Using Cloudflares CDN and free SSL for our app.mp4

02:48

21 - Further Improvements

001 Email alert to admin and buyer.html

22 - Bonus

001 Other courses you may like.html

Description

MERN Stack React Node MongoDB powered E-Commerce App with PayPal and Credit Card Payment along with Admin Dashboard

What You'll Learn?

Learn Node JS API (Backend) Development
Learn React JS (Frontend) Web Development
Learn to Write Functional Components with React Hooks
Learn the Fundamental Concepts of Building Ecommerce Application
Learn to Implement Payment Gateway using Credit Card and PayPal
Learn to Integrate Braintree (A PayPal Company) for Payment Processing
Learn to Implement Advance Searching/Filtering based on Categories
Learn to Implement Advance Searching/Filtering based on Price Range
Learn to Implement Standard Products Search System with Categories option/dropdown
Learn to Build Shopping Cart
Learn to Implement Authentication based on JWT
Learn to Build Scalable React App with Proper Layouts and Routes
Learn to build Admin and User Dashboard
Learn to Implement Flexible Private and Admin Routing System
Learn advance CRUD with Products and Categories
Learn to handle File Upload
Learn to use LocalStorage (CRUD) to Minimize Requests to Backend
Learn to Store Sold Products Record into the Database for Further Processing
User Profile and Update Ability
Learn to implement Order Management System by Admin
Learn to Deploy your app to Digital Ocean's Cloud Servers
Learn to add a Custom Domain name to your app
Learn to use Cloudflare's CDN to serve your app (for speed)
Learn to use Cloudflare's free SSL to secure your app

Who is this for?

A Web Developer looking to Build API with Node JS and MongoDB

A Web Developer looking to Build Fast, Interactive and Scalable Web Applications using React JS

A Web Developer looking to Build a FullStack Ecommerce Application using MERN Stack

What You Need to Know?

Basic Understanding JavaScript or any other programming language

Basic Understanding of React Js

Basic Understanding of Node Js

More details

Description
COURSE UPDATE: Deployment, Domain, CDN and free SSL
Learn to Deploy your fully functioning Ecommerce app to production by using Digital Ocean cloud servers. Learn to add your own custom Domain name. Learn to use Cloudflare's CDN to supercharge the speed of your site and also use free SSL to secure your app.

Full Stack / MERN Stack (Mongo Express React Node) Powered Ecommerce App from Scratch to Deoplyment

As a Web Developer, I have always wanted to build an Ecommerce App.
I wanted to know how to implement Add to Cart, Payment Gateways, Order Management System and so much more...

And I know a lot of you out there want to experience building Ecommerce app. The experience is absolutely amazing and it gives you loads of must have knowledge and confidence to start off your next big project using React Node and MongoDB.

This course also uses latest React Hooks which is an absolute joy. Your code will be so much simplified and readable, you wont believe it.

Our Node API will follow MVC Pattern. The codebase will be so clean and elegant, you will be absolutely loving it.

You will also get introduced with Braintree (A PayPal Company) for handling Payments. Braintree is hands down the best payment gateway you could possibly use in a production site for both PayPal and Credit Card payments.

By the end of the course you will learn to deploy your fully functioning Ecommerce app to Digital Ocean cloud servers for production.

Not only that... you will also learn to add your own custom Domain, use Cloudflare's CDN to supercharge your app and free SSL to secure your app.

All this goodness for the price of lunch? YES! Thats right!

We are really living in an age of goodness. Aren't we?

OK. Enough said, I know you cant wait to get your hands on this course :)

By the way, you will never get stuck with this course because each lecture has the Source Code available. Really?

Here are some of the course highlights:

Search product
Search products based on particular category
New arrivals
Best sellers
Product image
Product information
Product in stock/out of stock
View product
Related product
Add to cart
Remove product
Adjust quantity
Signin to checkout
User dashboard
Admin dashboard
Private routes
Admin routes
Shopping cart
Checkout with credit card and paypal
Checkout with delivery address
Success message
Update profile
Advance search of products
Advance search based on category and price range
Load more products
Admin dashboard
Create category
Create product
View orders
Manage products update/delete
Role based access
and lots more...............

Let me welcome you in an Incredible Journey of Building aÂ MERN Stack React, Node and MongoDB powered Ecommerce Application from the groud up. Let's do it. Let's code together.
Who this course is for:
A Web Developer looking to Build API with Node JS and MongoDB
A Web Developer looking to Build Fast, Interactive and Scalable Web Applications using React JS
A Web Developer looking to Build a FullStack Ecommerce Application using MERN Stack

User Reviews

Rating

average 0

Total votes0

Focused display

Ryan Dhungel is a Web Developer from Sydney, Australia. He builds Web apps using JavaScript, Node JS, React JS, Vue JS, Laravel and other emerging platforms.He also wants to make the entire Web Development process enjoyable and productive at the same time by producing well explained practical Tutorials and Training packages for fellow developers.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.