Login and Registration using Firebase in Android

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
in this video we'll be seeing how to implement  login and registration in Android using Firebase   so this is the demo of what we are going to  do in this video let's try registering a user let's click register and now you can see the registration is  successful and we are also logged into   the app so you can see the email and we are also  having a low code button so let's try logging out   now we are on the login screen let's try  logging in with the credential that we created let's try logging in now you can  see the login is also successful   let's try entering some wrong credentials now you can see the toast message on the bottom  saying authentication failed so this is what we   are going to do in this video foreign [Music]  first of all go to firebase.google.com and you   have to click get started or you have to go to the  console now here you have to create a new project and here you can see you have  to give a name for your project   I have given the name for the project now you have  to accept the terms and click continue for this   video we'll not be using Google analytics so I'm  going to turn this off and click create project now you can see the project is  ready now you can click continue   okay now you can see the project now here you  have to go to the left and you can see the build   option inside that go to Authentication  and you have to click on get started   for this video we'll be using email and password  to sign in and sign up so you have to enable this   we will not be using passwordless sign  in so no need to enable it so click save   that's all now you have to go to Android Studio  here you can see I have created a new project   now this is an empty project you can see that  I haven't done anything so we'll be seeing how   to connect Firebase so go to the tools on the  menu and you can see Firebase so click Firebase   here you can see the authentication so click  here and we have to enable the authenticate   using a custom authentication system so  click that and click on connect to Firebase   click build now if it is not connecting you can  click it once more now it will open the browser   so make sure that you are connected to the Google  account that you want to use for this project   and now we have to select the project so we  have created one project right now so click that   now you can see the Android Studio  is getting connected to the Firebase okay now the Firebase is connected so your  project is now connected to the Android studio   now we have to add Firebase authentication  SDK so click on this button and click accept now if you go to Gradle Scripts and choose the  first one we can see minimize the Firebase here   and you can see the Google services has  been added we can update the version so   simply hover over this and click change the  version to 4.3.14 okay now you have to use   the latest version and click sync now and you  can do the same for the second build.gradle   and come here you can see  the Firebase is added here   if it is showing a yellow warning you  simply have to click here and type Alt Enter   and you simply have to choose the latest  version that's all now click sync now now you can close the build Gradle now we  have Firebase connected and we are having   the SDK with the latest versions so firstly we  have to create two new activities so go to new   and select activity empty activity now this  activity will be for login now you can set this   activity as launcher activity and click finish  now you have to do the same for registration now here in the case of registration you   don't have to click the launcher  activity option now click finish now we are having two new activities  that is login and registration   so you can go to Russ layout and you can  see the register XML file and login XML file   so first of all we will be designing the  login form and the registration form so   go to the login and you can split so you can  view the code and also the design now first   of all we'll be changing the parent layout to  linear layout set the orientation to vertical okay now we can also set a gravity and I have set the gravity center okay  now inside this we have to create a text   View and show something like login  and also we need edit text for email   and password then we'll be creating a  button so let's add a text view first now we can give the text login now we can make  this as a string so for that you simply have   to click on this and type old placenta okay so  throughout the video I'll be doing this fast so   you should understand that now you can see that  we have added the text to the strings.xml file   if you want to see that you can go to values  and you can see strings.xml now we can see new   string added and you can see the name and  the text see that's all now I'll be doing   this throughout the video faster so you should  understand that now we have to add two edit texts   now we'll be using text input layout and inside  that will be adding the text input edit text match   parent warp content now open this inside that  we will be adding the edit text input edit text now we can add an ID for this give  the ID email you can give an hint okay now we have added the edit text for email  now we can copy this and paste below that this will be for password so change the  ID to password and also change the hint now you can see that I am adding these two strings now below this we have to add a button wrap  content wrap content close the button and collapse   the tags that's all give the ID for the button  now the ID could be like login button so btn-login okay now that's all now we can design this  text view login a bit so let's add a text size now we can style this to bold okay now we can Center this so give a gravity cent er okay okay now that's all now if you  want to give a margin bottom you can give that okay if you want to increase the text  to a bigger size you can do that okay   now on the parent layout  you can give a small padding okay now we can see we haven't given text for  the button so go to the button and give a text   so let's give the button login   okay so we are already having a text inside  the strings so you can access it like   add strings login so you can simply start  typing login and it will show the suggestion   see that's all now we have completed designing  the login part so you can copy this from here   and paste it on registration so go to the  activity registration XML file and go to the   split mode and select this and paste it now go to  the top and you have to change this to register okay now for registration we need to  change this text so change the text now we can change the text for the button also also change the ID for the button  so let's change it to btn-register   now for registration we need email password so  we'll be only using email and password for now   okay so our fields are ready will not be  changing the ID will be keeping it same okay   so we have also completed the designing part  of registration now you can go to the Manifest   now here we have to add permission for internet now here you can see the login activity is set to  launcher okay so this will be the first activity   that opens when you open the app okay now you can  see this is also set as launcher you can remove   this because we already have a launcher okay now  we'll be setting the parent theme to something   else because I will not be concentrating on  designing much so let's set it to theme dot   material three dot now the dark will be using the  light okay so we'll be using this thing okay now   we can also set that for registration and login  but we'll be using the one with no action bar okay you can see the theme this is the theme with  no action bar copy this and add this to login as   well okay so our designing part is also done so  we'll not be doing much designing so this is what   we are going to do if you try to run this you can  see how it looks now here you can see the app has   opened so this is the UI how it looks okay so  let's minimize this go to the register Java part   now here we have to initialize objects  for the edit text and the button now inside the oncreate we have to initialize  these objects so here we have declined the objects   inside this will be initializing them now we can see we have initialized the objects  with fine view by ID and we have used the ID   that we have given before so if you want to see  the IDS simply click here click control and you   can click it with the mouse now it will show that  we are having two layout files so the registration   and the login so if you want to go to the  registration click the activity register dot XML   and you can see the email ID okay so let's  go to register.java now we have to set an   onclick listener for the button so  button Reg dot set onclick listener now inside this we have to read the text from  edit text so for that we can create string   email and password now we have to read the email and password so  email equal to now the object that is email   edit text email dot get text dot tostring  now we have to do the same for the password so instead of this tostring we can use string dot  value of so come here and we'll be writing string   dot value of so do the same for the password as well okay now we have to check if the email  and password is empty or not for that if textutil textutils dot is empty  inside that we have to pass the email   now inside this if condition if the email  is empty we can show a toast message now let's do the same for password now inside the if condition we can type return and  here as well now after checking if the email and   password is empty or not we have to implement  the code for creating the user for that go to   the Firebase documentation so go to this URL I  will give the link for this documentation URL   on the description so you can check that out  now go to this URL and you have to scroll down here you can see the code to create the user   so create the user with email  and password okay so copy this and paste the code here now you can  see this object is showing in Red so   for that go to the top and we  have to create Firebase auth now we have to go inside the oncreate  inside here and we have to type   Mauth equal to firebase auth dot get instance  okay now we have initialize the object   now we can come here and we  have to import all these classes so simply click on the red and you  can import the class that's all so you can remove this log because  we will not be using the log   and import the Firebase user  okay remove the log again okay that's all now remove this function these two  functions and we have to change this to register   so now you can see a small error here so  you have to remove this this from here   and that's all now we can see the error  has gone okay and we don't need this line   because we'll be only showing a toast message  because we are doing the registration part   okay now here inside this we are passing  the email and password you can see these   things here okay we are fetching the values from  the edit text and we are passing it here okay   and if the task is successful we will show a  toss message so you can copy this from here   and paste it here and you can show some toast  message like account created now after this   toast message we can open the login so before  that if you want to show a progress bar we   have to go to the activity register.xml  file and we have to add a progress bar   so scroll down and we can add the progress bar  here before the button so add a progress bar   progress bar and web content and web content now we can give an ID for the progress bar we have to set the visibility to gone okay now we have set the progress bar on the  register XML file so we can copy this from   here and add it on the login part as well  okay now we can go to the button and before   the button we can paste the progress bar okay  now we can go back to the register Java part   and we have to initialize the object for  Progress bar so go to the top progress bar now we have declared the object for  Progress bar now let's initialize that   find view by ID r dot ID dot progress bar okay now you can see a small red line here we can  simply ignore that when we run the app it will go   away okay now we have set the progress bar now  we have to set the visibility for the progress   bar so inside the on click you can see here we  have to add the visibility for the progress bar   progress bar dot set visibility for that we have  to use View dot visible okay now the progress bar   will be visible now after completing the task we  have to set the visibility to gone so for that   you can come inside the oncomplete and here we  have to set the progress pass visibility to go on and we have to add this for the else part as well   so we can cut this from here and  add it before the if condition   okay now we have set the progress bar as well now  we can see we have completed the registration part   now if you want to open the login screen from  the registration we have to add a text view   so for that you can go to the registration  and on the bottom we can add a text View   wrap content Now set the width to match parent okay give an ID login now okay we can also set the text click to login okay let's add this to the strings   Alt Enter and okay now we can go to  the split mode and okay let's Zoom this   okay now you can see the text is here now  let's add some styling to the text View   so I have added the text view to bold and  given it a size 20sp also given a gravity   of Center and also added a margin top 20db  okay now we can copy this text view from here   and we can paste it on activity login dot  XML on the bottom you can paste it here   okay now we have to change the ID to register now  and we can also change the text click to register okay now we have added the text view to the both  XML files now we can go to the register.java   and here we have to create  an object for the text View now let's initialize the text View now you have to make sure that the ID that you are  using here should be exactly matching to the one   that you have used on the XML part okay so we  are using login now here this is the activity   register.xml okay so we are using the same ID now  we can set the on click listener for the text View inside this we'll be creating an  intent to open the login activity now we have to start the activity for that  call start activity and pass the object intent   now we have to finish the current activity for  that call finish that's all now we have done that   part now we have completely done the registration  part now we can move to the login part so go to   the login.java part you can copy some objects  from the register.java so go to register.java   and copy this much you can paste it here let's  format the code okay now we have to initialize   the objects for that also we can go to the  register.java before that we have to change the   object names here you can see the button object  name is button reg so change this to button login   okay that's all now you can go to  the register.java and copy this much   okay you can copy this much and you  can paste it on the oncreate method   okay now we have to change the button object name and you have to change the IDS because you  can see the ID this is the ID that we have   used on the registration part so change  this to the login button that is okay btn   login okay okay you have to make sure the ID  is correct otherwise you will be getting errors   and the text view ID also is different register  now okay you have to make sure the ID is correct   okay this is very important part otherwise you  will get errors okay and we'll be opening the   registration activity so change this to register  and that's all now after this you have to create   an on click listener for the button so come  here and button login dot set on click listener inside this we can copy some things from  the registration so go to registration.java   and here we can copy this much and paste  it here and change the class name to login here as well now everything else is fine and we have to come  below this if condition okay now here we have   to call a function called sign in with email and  password so for that you can go to the Firebase   documentation and now we can scroll down and I  will give the link for this documentation on the   description and here you can see this you have  to copy this from here and we can paste it here   okay and we have to import the classes so  click on the error and type alt plus enter we can remove the log and  all so let's remove this much remove these from here as well we need the  toast message so you can keep the toast message   change the activity name to login now you can see the same  error that we faced before   you simply have to remove this this from here okay that's all okay you don't  have to you see this from here   okay so here inside the oncomplete method if the  task is successful we can show a toast message now after the toast message we have to create  an intent to open the main activity so intent equal to new intent get application context and the  next one is mainactivity.class start the activity now we have to call the Finish okay now this will close the login and  open the main activity okay that's all   now inside the oncomplete we have to set the  progress bar visibility to gone progress bar set visibility gone okay now that's all we  have done the login part as well so we have   to check if the person is already logged  in so for that you can go to the Firebase   documentation and you can scroll to the top and  you can see this okay this on start so copy this   and you can paste it above the  oncreate method import the class   so here you can see the current user is  not equal to null we'll be opening the main   activity okay so we can copy the intent from  here okay this one and we can paste it here   okay we can remove the command okay now  this will check if the user is already   logged in and if the user is already logged  in it will open the main activity that's all   now we can copy this from here and paste it  on the registration part as well on the top you can paste it here okay that's all now we  can move to the main activity because we have   completed the login part as well so go to the main  activity Java part so here we'll be implementing   the logout button and we'll be also displaying  the email so go to the activity main.xml   and go to split mode change the  parent layout to linear layout set the orientation to vertical and also add the gravity now we can remove these and we can add an ID for the text View now we can also create a button for logout give an ID for the button let's give an  ID log out also give a text for the button okay now you can see that we are having a button  and also a text view okay now we have to go to   the activity main Java part that is main activity  and here we have to create some objects on the top Firebase auth and also one button and a text View also one for Firebase user now inside the oncreate method we  have to install them so auth equal to   Firebase auth dot get instance now we have  to install the button and the text View now let's initialize the current user that is  user so user equal to auth dot get current user   okay so this will get the current user now  we can check if the user is null or not   if user equal to equal to null open the if condition and here if the  user is equal to null we have to open   the login activity and close the main  activity so create an intent for that now we can see if the user is equal to  null we will finish the current activity   and open the login activity okay now let's  set the email and also set the logout button   so here on the else part we can set the text view so  for that text View dot set text   so inside that you can get the  email by using user dot get email okay now this will set the email of the user   after this you can set an on  click listener for the button button dot set on click listener now inside this we can sign out the user so for  that Firebase auth dot get instance dot sign out now this will sign out the user from the  Firebase now we have to close the current   activity and open the login activity  so you can copy this intent from here   and paste it here okay now that's all I think  the implementation is completed so you can   see these errors you can simply ignore  them so let's try running this and check now you can see that the app has opened now let's  go to the registration and let's create a new user now let's try creating the  user so click on register   okay now you can see a toast message account  created now the login page is not opening because   we haven't added the intent to open the login page  so go to the register Java part let's minimize the   emulator and here we have to add the intent for  opening the login so you can copy that from here and paste it here okay now this will open  the login activity after registration   now let's try running this when we open  the app again you can see that the user   is logged in so we have to log out so  click on logout okay now you can see   the registration so go to registration  and let's try registering a new user let's try registering this user okay now you can see the user is created  and we are redirected to the login page   and from the login page we are redirected  to the main activity so you can see that   and here you can see the user email is printed  and the logout button so let's try logging out   now let's try logging in with  the user that we created before okay let's try logging in okay you can see that  the login is successful and let's try logging out   okay now everything is successful so let's go to  the Firebase console and check the user details   so you can go to the Firebase console and here  we are having two users one is with the email   support@codeseasy.com and the other is this one  okay so we created two users and they both are   here okay now that's all hope you understand how  to implement login and registration using Firebase   in Android if you want the full source code for  this project you can come to this URL I will give   the link on the description you can check that  out and you can download the source code from here   so if you have any doubts you can leave the  comment and I will respond to your comments   if you like this video give it a thumbs up and  subscribe to this channel for more such videos
Info
Channel: Codes Easy
Views: 209,032
Rating: undefined out of 5
Keywords: codeseasy, firebase authentication, login and signup page using firebase, firebase login, firebase authentication android studio, android login and registration with firebase, login and registration form in android studio using firebase, login and registration android app tutorial using firebase authentication, firebase login android studio, firebase login and register android studio, firebase auth, firebase authentication tutorial
Id: QAKq8UBv4GI
Channel Id: undefined
Length: 36min 32sec (2192 seconds)
Published: Wed Dec 07 2022
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.