MERN Stack Web Development with Ultimate Authentication
MERN Stack (MongoDB Express React Node) FullStack Project from Scratch to Live Server with production ready Authentication 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.
More
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.
<code continue />
- 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
- 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'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
Watch Online MERN Stack Web Development with Ultimate Authentication
| # | Title | Duration |
|---|---|---|
| 1 | Introduction | 01:38 |
| 2 | Requirements | 01:27 |
| 3 | Setup client | 02:24 |
| 4 | Setup server | 11:13 |
| 5 | Installing NPM packages | 07:03 |
| 6 | Moving routes | 07:04 |
| 7 | Moving to controllers | 04:43 |
| 8 | User model | 17:48 |
| 9 | Applying middlewares | 11:02 |
| 10 | MongoDB Atlas Robo3T and Postman | 05:40 |
| 11 | Connect to mongodb | 06:10 |
| 12 | Express validator | 14:31 |
| 13 | Signup user | 09:44 |
| 14 | Email confirmation workflow | 06:48 |
| 15 | Signup with sendgrid | 05:22 |
| 16 | Send email on signup | 14:41 |
| 17 | Account activation | 12:24 |
| 18 | Signin user | 14:25 |
| 19 | Starting with react | 03:29 |
| 20 | Create layout | 06:35 |
| 21 | Using react router dom | 06:47 |
| 22 | Signup page setup | 07:37 |
| 23 | Signup form | 11:47 |
| 24 | Finishing signup | 18:25 |
| 25 | User signin | 06:53 |
| 26 | Activate account | 21:34 |
| 27 | Active nav link | 08:30 |
| 28 | Auth helpers | 19:59 |
| 29 | Authenticate and signout | 18:39 |
| 30 | Private route | 10:36 |
| 31 | Admin route | 04:21 |
| 32 | Redirect based on role | 06:58 |
| 33 | Read user profile | 08:58 |
| 34 | Protect API endpoint | 08:22 |
| 35 | Update user profile | 14:13 |
| 36 | Admin middleware | 08:16 |
| 37 | Profile update page setup | 05:59 |
| 38 | Errors cleanup | 03:08 |
| 39 | Pre populate profile update and handle JWT expiry | 13:31 |
| 40 | Profile update with toast message | 11:50 |
| 41 | Admin profile update | 04:07 |
| 42 | Forgot password server | 13:19 |
| 43 | Reset password server | 15:33 |
| 44 | Forgot password client | 09:49 |
| 45 | Reset password client | 17:11 |
| 46 | Login with google client | 21:23 |
| 47 | Login with google - server | 24:21 |
| 48 | Login with facebook client | 11:11 |
| 49 | Login with facebook server | 13:37 |
| 50 | Getting ready for production | 03:08 |
| 51 | Github and digital ocean | 06:00 |
| 52 | Deployment part 1 | 18:15 |
| 53 | Deployment part 2 | 15:08 |
| 54 | Pushing changes and making admin user | 11:23 |
Similar courses to MERN Stack Web Development with Ultimate Authentication
React Supabase Full Coursefireship.io
Python/Django + React QR Digital Menu BuilderPythonYoga
Web Development with Google’s Go (golang) Programming Languagegreatercommons.com
React Three Fiber: The Ultimate Guide to 3D Web DevelopmenWawa Sensei
MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejsudemy
Build Incredible Chatbotsudemy
