Login and Signup using Firebase Realtime Database in Android Studio | Kotlin

foreign welcome back to my channel in this video we will be creating login and sign up using Firebase realtime database where I will store username and password it is very simple similarly like Firebase authentication so if you want to know more about authentication then you can click on the I button to watch but for now let's understand what is Firebase real-time database see in very simple word it is a no SQL database means the data will not be saved in a table format instead it will store like this way so everything will be saved in real time means like in authentication you have to keep pressing refresh button to check the new entry but over here it will instantly going to update in real time got it also you can store anything in it like name username password phone number anything it will be in a parent child format like there will be a database name as a parent and multiple data as its children okay for now let's create the project also make sure that you use the latest version of Android Studio because UI is completely different so there is a chance that you might get confused so choose empty views activity click on next name the project as login sign up frd that is Firebase real-time database and click on finish now first let's do the prerequisites so go to colors.xml write the color name as green and hex code AS 4fa 853 then duplicate the line and write the color name as Blue 5 9 B 5 D5 and then go to themes.xml uncomment this line and right color is blue then duplicate the line and write item name as color primary variant again duplicate the line and write item name as Android status bar color and that's it done next go to Gradle app you write build features wave winding equals to true then click on sync now and then now to make our edit text look more fancy we will create a border around it so right click on drawable folder then new and then driver resource file write the name as edit text underscore border then select shape and click ok give it a shape as rectangle as I said it's a border so we will use stroke attribute give color as green and with s2dp now I want the border to be a little rounded so for that I will use Corners attribute and write the radius as 20 DB and then as I always see I don't want to waste your time in designing what so for that I will use a background so let me copy paste it and done again I will say please don't directly use image like this way instead create this background using jetpack compose or XML don't go for shortcuts okay next thing in prerequisite is to set up Firebase so go to Firebase choose real-time database click on connect and it will automatically click going to open the Firebase console I'll keep the name as it is then follow the instructions then click on connect and finally it's connected then come back to Android Studio click on ADD dependency and it is successfully added now go back to Firebase console here we will set up our real-time database so click on it then click on create database keep everything as it is then as I said it's a practice project so we will do it in test mode and click enable great our database is successfully set up this is where data will be stored okay as of now there is no data present hence it shows as null okay now come back to Android Studio then let's create login and sign up activity so let me quickly do that make sure you tick the launcher in login activity and then see we have a login activity and a sign up activity both now last thing go to Android manifest here we want our first screen to be login activity screen so for that we tick the launcher right but by default main activity is a launched so we need to remove this intent filter and also make exported as false and that's it close all the tabs let's move to our designing part so go to activity sign up let me give you a quick overview the designing is very simple we will have two edit text one is for username and another one is for password then we will have one button for sign up and lastly we will have a text view that will redirect user from sign up screen to login screen and that's it let me quickly write the entire code and then I'll explain you the important parts and then see we are using constraint layout I have added designer background then I have created an edit text with the ID as sign up username and other attributes then again we have created an edit tense with the idea saying the password and input type as text password that will make the password in an asterisk format then we have a button whose ID is hanging up button and then lastly we have a text view whose ID is login redirect well I have wrote the text as already register login and that's it this is how it looks I will slowly scroll the code so that you can copy paste it all right now let's move to activity login.exml we will use the same code with few changes so copy the entire code and paste it in activity login change the background then context here change the IDS login username and here change the IDS login password then change the button IDs login button and text as login then change the text viewer ID as sign up redirect and text is not yet registered sign up lastly change all the associate constraint IDs according to the new IDs and then that's it this is how it looks then we need to redesign activity main.xml so when the user will successfully logged in then he will enter into activity main so let me quickly redesign it and done we are done with all the designing Part close all the tabs now listen to make carefully as we are dealing with real-time data bands hence we need to create a data class now what is data class in simple words basically a class where we will store all our data okay so as we are creating login and sign up so we will be storing username and password as our data also we will be storing an ID basically there are chances that username and password might get repeat hence we will require a unique value for each item so for that we will be giving a unique ID to each and every item cut it now let's create it right click on it new code clean class then choose data class and write the name as user data this is how it looks now inside it I will mention all the data with their data type so well ID data type as string question mark is equal to null question mark represents that this data item can store either a non-nullable value or nullable value got it similarly I will create for username as well as password and then see we will store three data items in string format this is what you will see on real-time database okay once the data class is created then let's move to sign up activity this is very simple okay let me give you a quick overview so first we'll set up binding then next we will declare an initialize Firebase then we will create a stand up user function then we will call this function on sign up button and then lastly set on click listener on the redirect text View and that's it let's create it as I said first let me set a binding quickly and done then we will declare Firebase database and database reference and then database reference is required to create a connection to the database like to refer the data items okay so let me quickly initialize it and then see we have initialized the Firebase database then in database reference it will call Firebase database that will refer a child named as users got it so users is like a database name so whenever you want to access your database you have to mention path string as users okay then next is to create sign up user function this is very important first let me create it and then I'll explain you and then now see we will take username and password as a parameter then inside it database reference dot order by child username now database reference is basically your database name that is users so inside users we have three child that is username password and ID that we created in data class right with the help of order by child we will sort the data by the child key that is username and equal to basically filters the data of all the stored user name that matches with the username given by the user got it then we have added listener for single value event and inside it object as value event listener now inside that value event listener we have override on data change method simple right now comes the logic part if data snapshot does not exist then we are supposed to perform the below actions but if the snapshot exists then it will throw a toast as user already exists okay so first we need to understand what is data snapshot so data snapshot is an object that represents the specific location in Firebase real-time database in simple words if the data already exists in the database then it will go in else otherwise it will create a new user first the new user will have a ID which will be a unique random string so to create that unique ID we use push dot key method cut it simple right now ID is created and username and password will be given by user through edit text right so now user data has ID username and password now we have created a path this is how it goes first database name that is users then its child as ID and then inside that ID we will have a user data that is basically our ID username and password now why did we kept ID as a child because it will be unique from each other if we would have kept username as a child then there are chances of having same username which will create a confusion in the database hence always keep a unique child like maybe a phone number or email it's like name and username can be repeated but phone number and email will be always unique right now once the new user is created it will throw a toast as sign up successful and with the help of intent it will automatically going to login activity then I have override an on cancel method which will basically through a database error if something went wrong okay once the function is created let's call it inside the sign up button so first let me quickly write it and then now see whatever username and password that user will write in the details we will take them with the help of x dot two string and stone it in sign up username and sign up password variable cut it then if signed up username is not empty and send the password is also not empty then in that case we will call this sign up user method which we created before and inside that we will pass our arguments as sign up username and sign up password but if the user kept the edit text as blank then it will throw a toast as all fields are mandatory got it lastly let me quickly set on click listener on login redirect and then so if the user will click on it then it will redirect him directly to login activity with the help of intent and that's it similarly we will do it for login activity as well the code will be same only instead of creating a new user here it will check the credentials so go to login activity let's create it quickly first I'll set a binding and done then I will declare and initialize Firebase database and database reference and done also make sure that you write the correct database name for example in sign up you are referring to users and in login you are referring to user that is incorrect right so be careful about it then let me quickly create login user function and then see most of the things are same like parameters order by child then data snapshot which I have already explained you in sign up so come to this line in sign up here we have created a new user but in login here we will be checking the credentials so we have used a for Loop which says data snapshot dot children will be in a user snapshot variable so basically it breaks through children of data snapshot children as in username password and ID got it then user snapshot will take all the values from the user data class and store it in user data variable basically user data consists of username password and ID that are already present in the database now it checks if the user data is not null means data is present and database password matches with the password given by the user at the time of login then in that case it will throw a toast as login successful and with the help of intent it will lead us to main activity but if the password does not match then in that case it will throw a toaster's login field got it likewise if any error occurs in database then on cancel method will throw an error using toast then we will call this method from login button so let me quickly create it foreign [Music] username and password from the user through edit text and store it in login username and login password variable respectively then it will check if login username is not empty and login password is also not empty then it will call login user method which we created before right and inside it it will pass both the arguments else it will throw a toast as all fields are mandatory lastly we will set on click listener on sign up redirect and then so if the user will click on it it will redirect him to sign up activity and that's it we are done with the coding now let's run the app this is how it looks as we are new user so first we will go to sign up screen here I will write username and password now I will click on sign up button and see there is a toast as signing up successful and also we are on login screen so if you see in real time database here we have our users as a database name then inside it we have a unique ID and then inside the unique ID we have our data as ID username and password now let me quickly write the same credentials over here and I will click on login button and see we have successfully logged in great right so yeah that is it for the video and if you are new to this Channel please consider subscribing to my channel and I'll see you in the next video [Music] foreign

Channel: Android Knowledge

Views: 10,513

Keywords: login screen in android studio, android firebase database, simple login app android studio, login and register android studio, android studio firebase realtime database, login and register page in android using database, login and registration in android, login and registration form in android studio, login and register android studio firebase, how to create login page in android studio, how to login and register in android app, registraion and login form in android, kotlin., ui, java

Id: MhLkezKsHbY

Length: 32min 55sec (1975 seconds)

Published: Thu Aug 03 2023