MERN Stack Web Development with Ultimate Authentication

Focused View

Ryan Dhungel

9:24:05

131 View

1. Course Introduction

1. Introduction.mp4

01:37

2. Requirements.mp4

01:26

3. Are you new to JavaScript React and NodeJs.html

4. Source Code.html

2. Getting Started

1. Setup client.mp4

02:23

2. List of NPM packages to install.html

3. Setup server.mp4

11:12

4. Installing NPM packages.mp4

07:02

5. Source code.html

3. Node Js API

1. Moving routes.mp4

07:03

2. Moving to controllers.mp4

04:42

3. Code for User model.html

4. User model.mp4

17:47

5. Applying middlewares.mp4

11:01

6. OPTIONAL - Using Monto Atlas for MongoDB as a service in the cloud.html

7. Mongoose version.html

8. MongoDB Atlas Robo3T and Postman.mp4

05:39

9. Connect to mongodb.mp4

06:09

10. Source code.html

4. Node Js Signin Signup Email Confirmation

1. Express validator.mp4

14:30

2. Signup user.mp4

09:43

3. Email confirmation workflow.mp4

06:47

4. How to switch from Sendgrid to Nodemailer and Gmail to send Emails (OPTIONAL).html

5. Signup with sendgrid.mp4

05:21

6. SENDGRID FORBIDDEN ERROR.html

7. Send email on signup.mp4

14:40

8. Account activation.mp4

12:23

9. Signin user.mp4

14:24

10. Source code.html

5. React

1. Starting with react.mp4

03:28

2. Create layout.mp4

06:34

3. React router version.html

4. Using react router dom.mp4

06:46

5. Source code.html

6. React Signup Signin Activation

1. Signup page setup.mp4

07:36

2. Signup form.mp4

11:46

3. Finishing signup.mp4

18:24

4. Simple rules of useEffect.html

5. User signin.mp4

06:52

6. Activate account.mp4

21:33

7. Active nav link.mp4

08:29

8. Auth helpers.mp4

19:58

9. Authenticate and signout.mp4

18:38

10. Source code.html

7. Private Admin Routing

1. Private route.mp4

10:35

2. Admin route.mp4

04:20

3. Redirect based on role.mp4

06:57

4. Source code.html

8. User Profile

1. Read user profile.mp4

08:57

2. Protect API endpoint.mp4

08:21

3. Update user profile.mp4

14:12

4. Admin middleware.mp4

08:15

5. Profile update page setup.mp4

05:58

6. Errors cleanup.mp4

03:07

7. Pre populate profile update and handle JWT expiry.mp4

13:30

8. Profile update with toast message.mp4

11:49

9. Admin profile update.mp4

04:06

10. Source code.html

9. Forgot Reset Password

1. Forgot password server.mp4

13:18

2. Reset password server.mp4

15:32

3. Forgot password client.mp4

09:48

4. Reset password client.mp4

17:10

5. Source code.html

10. Login with Google

1. Login with google client.mp4

21:22

2. Resources - Login with google (optional).html

3. Login with google - server.mp4

24:20

4. Source code.html

11. Login with Facebook

1. Login with facebook client.mp4

11:10

2. Login with facebook server.mp4

13:36

3. Source code.html

12. Production steps

1. Code for server js.html

2. Getting ready for production.mp4

03:07

3. Source code.html

13. Deployment

1. Signup to Digital Ocean.html

2. Deployment commands steps.html

3. Github and digital ocean.mp4

05:59

4. Deployment part 1.mp4

18:14

5. Deployment part 2.mp4

15:07

6. Pushing changes and making admin user.mp4

11:22

7. Source code.html

14. Post Deployment

1. Adding a domain name.html

2. Cloudflare CDN and Free SSL.html

3. Force http to https.html

4. Redirect all www to non-www.html

5. Update google login domain and callback urls.html

6. Update facebook login domain and callback urls.html

7. Redirect Digital Ocean IP to domain name.html

15. SEO - Generate Static Site

1. Pre-render a web app into static HTML for SEO.html

16. Bonus

1. Other courses you may like.html

Description

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

What You'll Learn?

Building Ultimate MERN (Mongo Express React Node) Stack Boilerplate 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 Middlewares
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
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
Static Site / SEO

Who is this for?

JavaScript enthusiast looking to go FullStack with React Node and MongoDB

Web Developer who wants to build his own MERN Boilerplate project

Web Developer who wants to build or add production ready Authentication system to his projects

Web Developer who is curious how to setup FullStack project with React and Node

Web Developer who wants to learn how to implement Layout and Routing system

Web Developer who wants to learn to implement ACL (access control) for Admin and Subscribers (regular user)

Web Developer who has build great projects but unable to go live because of not having production ready Authentication System

All JavaScript React Node Js Developers who wants to start building production ready FullStack MERN Stack Apps

Web Developer who is interested in learning how to deploy production ready apps to Digital Ocean Cloud Servers

What You Need to Know?

Basic understanding of React

Basic Understanding of Node Js

Basic Understanding of JavaScript

Ability to connect Node JS App to MongoDB (either using local mongodb install or mongo atlas)

Interested in FullStack React Node MongoDB Web Development

More details

Description
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 :)
Let's go Full Stack. Let's go MERN Stack.
Who this course is for:
JavaScript enthusiast looking to go FullStack with React Node and MongoDB
Web Developer who wants to build his own MERN Boilerplate project
Web Developer who wants to build or add production ready Authentication system to his projects
Web Developer who is curious how to setup FullStack project with React and Node
Web Developer who wants to learn how to implement Layout and Routing system
Web Developer who wants to learn to implement ACL (access control) for Admin and Subscribers (regular user)
Web Developer who has build great projects but unable to go live because of not having production ready Authentication System
All JavaScript React Node Js Developers who wants to start building production ready FullStack MERN Stack Apps
Web Developer who is interested in learning how to deploy production ready apps to Digital Ocean Cloud Servers

User Reviews

Rating

average 0

Total votes0

Focused display

MERN Stack

Ryan Dhungel

Instructor's Courses

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.