Firebase Authentication in Flutter 2024 | Email and Password | Sign up & Login | #firebase #flutter

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
welcome back this video is focused on email and password authentication with Firebase and flutter I have set up a basic Firebase project uh if you don't know how to set up a Firebase project I have put a link in the description of my video you can go and watch the video and please make sure you like share and press the Subscribe Button as well now coming back to the video here from the firbas project dashboard uh on the left pen click on the build category here press Authentication we have the intro screen for authentication Service from Firebase click on get started and now we have lots of O providers available we can enable Google signin sign up we can also enable Facebook and other as well we will go with email and password Here we will enable it we will leave this one uh and we will save we have enabled the email password authentication Service from Firebase for our project let's navigate to the users tab here every user that we will be registering from the app will be shown here now move towards the vs code I have set up a boiler PL template for this video here you can see the login screen we also have the signup screen uh and also we have a welcome or home screen when the user is logged in or signed up he will be navigated towards that home screen now before uh working on the logic here come to the pop. ml file you need to have these two dependencies installed uh because Firebase o is responsible for handling the O operations and Firebase score is used to initialize the Firebase project now coming back to the main file here I am initializing the Firebase app that we have connected with our flutter application and now uh the first screen we are showing is the login screen and then we have the signup screen here we have another file known as OD service here we will be writing our Logic for login and sign up let's go go to the login screen first um here we have these two text Fields we'll be using for entering email and password then we have this button for login here I have created two text editing controllers that we will pass into these text field and we will extract the value from it using these controllers so I have passed it here and here um also uh these text in controllers take lots of space in the memory so we have to dispose it after they are no longer required so what I will write is email. dispose this will dispose this controller when we no longer need it so dispose this password as well this dispose method is executed when uh the screen uh is navigated to other or the screen is removed from the uh interface so that's how I have designed this uh login screen and down we have this sign up uh screen as well in the signup screen we have these three text Fields let's go to the signup screen file um here I have have these three text Fields created and I passing these controllers to these text and then we have this sign up button and we will add our onpress logic here so now coming towards the logic I have created an all service file here what we will do we will write our all of our Logic for login here so we will create a class named as all service here we will have three functions one for the sign up and it will be returning anable user when it's signed up it will return us a user user will be of type user that is from the Firebase all library and we can call it create user with email and password so we can give it a name like this it will take two string parameters one will be the email and the other will be the password that we will set for the user and uh it will be an async method because we will be performing some async operations from the Firebase o package we have this uh Firebase o uh instance that we will use to create our user so what we will use is Firebase o. instance now we have this instance we will use it to create our users so I will call the Au do create user with email and password method and I will pass the email and password I have taken here so this function if executed properly and and uh successfully executed so it will create a user it is an asynchronous uh operation so I will put a wait here and I will store the value that it is return that is returned by the create with uh email and password so I will store it in a p final variable and I will call it credentials it gives us the credentials for the user that we are registering and then what we will do from these credentials we can access the user that has been registered and we will return it from here as you you can see it's anable user in case it's null it means that the user hasn't been signed up something wrong has been occurred um also adding that we will add a try catch block here as well it's because we are performing an async operation uh some scenarios may arise that there will be no internet so in that case it will fail and it will return an exception that we will catch here we can use the log uh method here to print something to the console like something went wrong so that we identify that there has been something wrong in the as synchronous operation so uh write something went wrong here so that's our Logic for uh sign up or registering user with email and password now copy this method and create one for sign in as well so here uh what we will do we can uh say that log in user with email and password here we will change this method to sign in uh user with sign in with email and password Here we will also have another method for sign out as well it returns nothing so we will keep it wide and we will give it a name sign out what it will do we will use try cage block here as well to cage any exception that might occur in the asynchronous operation and what we will add here is O do sign out methods from the uh Firebase out plugin it will signed it will sign out the currently logged in user we will add aing here and aage here as well so here we can also use this uh statement to print something in case something goes wrong like you don't have internet so uh it will throw an exception here and that you will get an log something to the console now coming back to the signup screen here I will create an instance of the um o service I have created and let's give the name of O and instantiate an O service I will use this OD service to sign up a user U here when this sign up button is pressed so I want to execute that function so here uh I will create a helper method here with the name of sign up I will create it here and uh let's write sign up here we will take the values from the text editing controllers and pass it in the Au service function so uh I will use that o and I will uh call the create user with email and password Here we have the email text editing controller that we will use and use the text of it for email and for password I use the password do text I pass this into the function it will be an assing operation so I will add aing here I will put an await and I will take the value as it returns uh a user so I will create a variable with the name of user you can see that this function returns anable user so we can put a check here if our user is uh not equals to null which means that our user has been signed up successfully so we can log here uh user created successfully and uh if the user uh is equal to null which which means that the user has not been created or registered so I have added the sign of functionality here and uh after that if the user is created successfully I will call the helper function go to home that getes to the home screen I have written the logic here and it just push pushes the home screen on the Navigator so we see the home screen so this is the logic and I have used this sign of method here now uh let's try this logic I I will enter some name Khan and then I will enter an email Khan email.com then I will put a password which will be Han 1 2 3 4 now let's step on this sign up button yes our user has been created and we have been navigated to the home screen now let's see if we have the user created here on Firebase as well yes we have this user registered let's add the sign out functionality as well so here we have in the a service the assign out method so let's navigate to the home screen file and here we will create an OD service instance it will be o and it will instantiate an O service we can also Mar this final and we will use this to of sign out we can add. sign out let's mark it I think and we can await for it and sign out after it a sign out we will go to the login screen to login again if the user wants so let's test this functionality as well I will tap on the sign outs button and let's see what happens yes we have uh navigated to the login screen now the login functionality is left so let's add it as well in the login screen uh I will create the O service instance here as well so I will create a final um variable o and I will add the O service instance here as well uh down there I will create the the uh login method and here in the login we will be logging in our user will be an sing now add an await here and use the Au service instance to log in user with email and password for the email we'll be using the email text controller. text and for the password we'll have this password uh text editing controller. text and that's how we will log in our user and it will so return a nullable user so we can check if the user has logged in or not so if our user is not equals to null it means that the user has been logged in successfully so we can log here that user logged in and uh down there we can navigate to the home screen so I will add this let's try it out I have created the um I have uh created the user named uh sorry with email Khan at email.com and with the password Khan 1 2 3 4 so let's uh tap this login button but before we will uh add on tap here that will be login and now uh let's tap on this button and see if it is logged in or not so I have taped it and logged in successfully that's how we Implement email and password authentication with Firebase and flutter in the next video we will be covering some Advanced file based topics thank you for watching
Info
Channel: CodeWorm
Views: 892
Rating: undefined out of 5
Keywords: firebaseauth, firebaseauthentication, flutter, firebase, auth, firebasetutorial, signuplogin
Id: Xe-8igE1_JI
Channel Id: undefined
Length: 12min 6sec (726 seconds)
Published: Mon Mar 18 2024
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.