Code  JS

Welcome to our tutorial on how to build a full-stack login and register page using MERN stack. In this video, we will cover step-by-step instructions on how to create a secure and functional login and register page using React.js, MongoDB, Express, Bcrypt, JWT, and more.

Whether you're a beginner or an experienced developer, this tutorial is designed to help you gain a deeper understanding of the MERN stack and how it can be used to build powerful and secure web applications.

Understand the folder structure of a Full Stack MERN project, authentication, authorization, encrypting user's passwords for extra security, tracking user's with a cookie using JSONwebtoken, utilize React-hot-toast package for professional looking notifications and much more.

So, join us now and learn how to build a full-stack login and register page with MERN! Don't forget to subscribe to our channel for more tutorials on web development, and feel free to leave any questions or comments in the section below. Thank you for watching!

Timestamps: 
0:00 Intro
0:51 Setting up folders/vite app
2:55 Set up frontend folders
5:12 React Router Dom setup
10:47 Create the login and register page
19:10 Set up backend folders/environment
24:39 Set up a GET endpoint route to test
33:54 Set up MongoDB database and connect it
44:00 Create a POST request for Register Page
54:43 Using React-Hot-Toast for notifications
1:02:58 Bcrypt Implementation 
1:10:04 Create a POST request for Login Page
1:20:36 JSONWebToken
1:29:04 Create User Context with React Hook so we can track user
1:41:12 Create Mock User Dashboard
1:47:42 Testing out everything and outro

Subscribe: https://www.youtube.com/@brettwestwooddeveloper/featured 

#mern #react #mongodb #express  #jwt #nodejs 

Build a Full-Stack Login and Registration Page with MERN
1 Likes7.85 GEEK