Firebase Web Login - Login & Sign Up in HTML, JavaScript & Firebase / New version

hello guys and girls i'm going to show you how to set up register login and logout with firebase auth and additionally save login details on real time database let's start first thing we have to create our new project i am going to call this authentication app disable google analytics great next step we are gonna set up our authentication to do this we are going to use the simple email and password perfect let's set up our real-time database we're gonna go ahead with lock mode we need to change rules of lock mode read and write equal to row awesome next step let's go ahead and create our web app i'm just gonna call it same thing authentication app now we have to copy html script references into our html file this is my simple form to login to the system including password and email now we're gonna duplicate the import code up to database declare one variable database equal to get database great now i'm going to setup register function which is going to register new users to our website i'm going to get sign up code from firebase documentation first thing we need to copy this import code and paste here change database to auth this is my mistake all the versions must be the same i'm gonna add another input box for input the username signing up is the id which we assigned to the submit button i'm gonna go ahead with admin listener copy and paste the code first thing we're gonna do get all the input fields which we have in the html form including username email and password now we can go ahead and register user dot catch handle errors that may occurred so we're gonna have to error this out too if you want to redirect to another page after creating the user you can code it here i'm going to alert user created this should be a variable i'm going to register this admin user [Music] authentication section is empty password should be at least 6 characters this validation error is coming from firebase auth user created great now i'm gonna add another user i'm gonna go ahead and save the user details on the real-time database also at the same time when we register new users we're gonna set this equal to database variable on top we're gonna save it under sub class users slash uid is the unique id and don't forget never save your password to the database set and ref must be import here great so now we can see it's saved to our database email must be correct great let's go back and work on login function i'm gonna remove the username inputbox login is the id which we assign to our submit button first we need to import this parameter sign in with email and password now i'm gonna copy the code and place it here i'm going to update the real-time database also at the same time i'm gonna update last login date and allowed the user that he logged in and update parameter must be import i'm gonna go ahead and log into the system user logged in let's check our database great so now we can see it saved it to our database what we are going to do next is we go to our documentation click on the manage users tab this function work when you log out and login we need this code also you can change here in this code we can get currently signed in user with use object or if we need to make any changes after the user logged in we can code it here next step is to log out the user we go to authentication and and under that sign out user this function will be used to log out the user if you want to get error message you can do the same thing that we have done with the login process i'll add the sign out message and don't forget to add signing out also there and don't forget to add something out also there so i think this video will help you to go ahead with your projects thanks for watching and don't forget to subscribe

Channel: Tech WAR

Views: 1,760

Keywords: firebase web, firebase web authentication, firebase signup login, firebase web signup, firebase web tutorial, firebase authentication with web, firebase authentication with realtime database, firebase authentication new version, firebase auth, firebase login with gmail, firebase web login with email, Firebase Web App Tutorial, firebase email password authentication, How to set up Authentication using Firebase

Id: qYER6hAgJik

Length: 15min 54sec (954 seconds)

Published: Wed Nov 10 2021