FlutterFire - Google Sign-In | Display User Using Bloc

welcome back to the flutter and Firebase Series in this video we will Implement user login using Google in the previous video we implemented user login and sign up with email and password if you have not watched it you can watch it by clicking on the I button above we will use qubit as our state management onward in this series so let's buckle up first of all add the block flutter block and Google sign in packages to your pubspec.yaml file and get the dependencies create all the states for Google authentication including the initial State loading State and success state which will contain the Firebase user and an error state with the error message now create a Google off qubit class and pass Google auth initial State as the first state we will also need Google sign and object and Firebase off instance create a login method that will emit the loading State as soon as it gets call then we will try to perform the login so the first thing is to prompt the user to select an account if the user cancels The Prompt then we will just return without doing anything then we will get the authentication object from the selected account and use it to create oauth credential object and call Firebase to sign in with the credential function with the credential object we just created on successful login we will get the Firebase user and we will emit the Google off success state with this user and in case of any error or exception we will make Google off failed state to notify the view about the off State inside the main.dart file wrap the material widget with the multi-block provider and inject the Google auth qubit into the widget tree we created this login screen in the previous video just add another login with Google elevated button at the end and wrap it with the block consumer we don't need listener callback for now but maybe we will use it in the future on pressing the button we will restrict the user to not press it again until some response so we will check the state and if it is Google offloading State we will pass null otherwise we will call the login function inside Google off qubit and same for the button child to show a loading indicator or text according to the current state now open your Firebase console and enable the Google login we will also have to provide sha1 fingerprint to make the Google login work so open the Android folder inside the terminal and run the grablue signing report command to get the debug sha1 key and paste it into your Firebase comp console then replace the old Google services.json file with the updated one at the end open the home screen and call the sign out function from Google sign in to log the user out of the app now run the app and select a Google account on success you should move to the home screen if you don't know how it automatically navigates to the home screen then you should watch the previous video where we automatically send the user to the home screen when he logs into the app that's it for this video and make sure to hit the Subscribe button to get next video foreign

Channel: Flutter Guys

Views: 3,173

Keywords: flutter tutorial, google sign in, flutter firebase, flutter authentication, flutter firebase setup, flutter firebase tutorial, firebase flutter tutorial, flutter firebase auth, setup firebase for flutter, flutter, flutter tutorial for beginners, flutter tutorial 2022, add firebase to flutter app, add firebase flutter, google sign in flutter, login with google in flutter, firebase authentication flutter, flutter tutorial in hindi, firebase authentication, flutter tutorial 2023

Id: qn6pLYkOayk

Length: 2min 32sec (152 seconds)

Published: Fri May 19 2023