MERN Stack Web Development with Ultimate Authentication

MERN Stack Web Development with Ultimate Authentication

English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 89 lectures (9h 43m) | 3.88 GB

Build Ultimate Authentication Boilerplate Project with MERN Stack from Scratch to Digital Ocean Cloud Servers

MERN Stack (MongoDB Express React Node) FullStack Project from Scratch to Live Server with production ready Authentication

MERN STACK

Learn MERN stack web development by building production ready login register system with account activation, forgot password, reset password, login with facebook, login with google as well as ACL by implementing private and protected routes for authenticated user and users with the role of admin.

As a bonus, I have also included profile update and deployment to digital ocean cloud servers.

If you are looking to go FullStack with React Node Express and MongoDB or better known as MERN Stack then this should be your first go to course. Because here you will learn to build an Ultimate boilerplate project which can also be used for any future MERN Stack projects you will build for yourself, for your clients or at your job.

  • New Lectures Added
  • Adding a domain name
  • Cloudflare CDN and Free SSL
  • Force HTTP to HTTPS
  • Redirect all www to non-www
  • Updating Google and Facebook login redirect to production domain
  • Redirect Digital Ocean IP to actual domain name

The key concepts covered in this course

  • Building Ultimate MERN (Mongo Express React Node) Stack Project
  • Building Production Ready Authentication System
  • Building Login Register System using Email Password
  • Implementing Social Login System with Google and Facebook
  • ACL – Access Control
  • MERN Stack Web Development
  • API Development with Node Js
  • Frontend Web Development with React
  • Create your own base project for all your future React Node FullStack Projects
  • Learn FullStack Deployment to Digital Ocean Cloud Servers including MongoDB Setup
  • Account Activation before saving user to database
  • Login with Google
  • Login with Facebook
  • Private Routing
  • Admin Routing
  • Page Layout with React
  • Working with LocalStorage
  • Working with Cookies
  • Working with JWT (JSON web token)
  • Role based redirects
  • Profile Update
  • Auth Middleware
  • Admin Middleware
  • Protecting Routes
  • Handling JWT expiry
  • Error handling
  • Toast Notifications
  • Forgot Password
  • Reset Password
  • Pushing projects to Github
  • Pulling projects from Github to Digital Ocean
  • Digital Ocean Server Configuration
  • Deploying both backend/frontend to single Digital Ocean Droplet
  • Committing changes after pushing project to live servers

By the end of this course, you will have your own Production Ready MERN Stack Project running live in Digital Ocean Cloud Servers.

Have a look at the promo video to get a better understanding of what this course is all about and how it can change your life for good 🙂

Web Development is not only about coding, It’s also about deploying, dealing with domains, hosting, CDN, www/non-www, http/https, redirects, SEO, pushing new features and more. Get all that knowledge plus the production ready Authentication system, admin routes, page layouts with solid project architecture. This course’s project is the beginning of something big

Table of Contents

Course Introduction
1 Introduction
2 Requirements
3 Are you new to JavaScript React and NodeJs
4 Source Code

Getting Started
5 Setup client
6 List of NPM packages to install
7 Setup server
8 Installing NPM packages
9 Source code

Node Js API
10 Moving routes
11 Moving to controllers
12 Code for User model
13 User model
14 Applying middlewares
15 OPTIONAL – Using Monto Atlas for MongoDB as a service in the cloud
16 Mongoose version
17 MongoDB Atlas Robo3T and Postman
18 Connect to mongodb
19 Source code

Node Js Signin Signup Email Confirmation
20 Express validator
21 Signup user
22 Email confirmation workflow
23 How to switch from Sendgrid to Nodemailer and Gmail to send Emails (OPTIONAL)
24 Signup with sendgrid
25 SENDGRID FORBIDDEN ERROR
26 Send email on signup
27 Account activation
28 Signin user
29 Source code

React
30 Starting with react
31 Create layout
32 React router version
33 Using react router dom
34 Source code

React Signup Signin Activation
35 Signup page setup
36 Signup form
37 Finishing signup
38 Simple rules of useEffect
39 User signin
40 Activate account
41 Active nav link
42 Auth helpers
43 Authenticate and signout
44 Source code

Private Admin Routing
45 Private route
46 Admin route
47 Redirect based on role
48 Source code

User Profile
49 Read user profile
50 Protect API endpoint
51 Update user profile
52 Admin middleware
53 Profile update page setup
54 Errors cleanup
55 Pre populate profile update and handle JWT expiry
56 Profile update with toast message
57 Admin profile update
58 Source code

Forgot Reset Password
59 Forgot password server
60 Reset password server
61 Forgot password client
62 Reset password client
63 Source code

Login with Google
64 Login with google client
65 Resources – Login with google (optional)
66 Login with google – server
67 Source code

Login with Facebook
68 Login with facebook client
69 Login with facebook server
70 Source code

Production steps
71 Code for server js
72 Getting ready for production
73 Source code

Deployment
74 Signup to Digital Ocean
75 Deployment commands steps
76 Github and digital ocean
77 Deployment part 1
78 Deployment part 2
79 Pushing changes and making admin user
80 Source code

Post Deployment
81 Adding a domain name
82 Cloudflare CDN and Free SSL
83 Force http to https
84 Redirect all www to non-www
85 Update google login domain and callback url’s
86 Update facebook login domain and callback url’s
87 Redirect Digital Ocean IP to domain name

SEO – Generate Static Site
88 Pre-render a web app into static HTML for SEO

Bonus
89 Other courses you may like

Homepage