Flutter Authentication Tutorial
This Flutter Authentication Tutorial is using Google Sign-in and Firebase to make a demo application for logging in, logging out and deleting a user from Google Firebase. Please keep in mind that this is done on Android Studio. Click the link for more information on how to set up Flutter for Android Studio. If you are using another IDE, don’t worry, the code should not be any different.
If everything goes well, the Application should look like the screenshot. It should be able to log in a user to Firebase via Google, to log him out, or to delete the user, in case a user was once logged in. We also add a circle progress bar at the bottom, to show, when the app is busy.
Setting everything up for the Flutter Authentication Tutorial
To get started, we have to set up Google Firebase for our project. I will go through the process of setting up Firebase for Android in Android Studio here.
Add Firebase to your project
First, go to your Firebase console, and create a new project. When the project is ready, add a new app to Firebase (Choose your phone OS). Follow the instructions, download the google-services.json file and copy it into your Android/app/ folder (see screenshot left).
Do not forget to add the SHA-1, since you need it for authentication. Check here, if you do not know how to get your SHA-1. You can skip the last step, where Google waits for communication with their server, for now. For more information on how to set up Firebase for Flutter check here.
Add Sign-in method
Then in your Firebase Console go to Authentication (you find it in the panel on the left-hand side). There you will find a list of Sign-in providers. For this Flutter Authentication Tutorial only enable Google, since we only connect with the Google sign in.
Add dependencies to your project
So far, so good. Next, go to your pubspec.yaml file in your project folder. Then add the following under dependencies:
Click ‘Packages get’ on the top. Also, click on ‘Update Packages’. Great. Now we are almos ready to start code our little application.
Update your build.gradle files
You also have to update two of your build.gradle files. The first you will find in /android/build.gradle and the second one is in /android/app/build.gradle.
For the one located in /android/build.
And for the one located in /android/app/build
Start coding the Flutter Authentication Tutorial app
Now let’s get into the meat of it. First, let us define how we structure our project for this Flutter Authentication Tutorial.
Structure of the project
Have a look at the screenshot, to see how I did it. I created a folder /
Have a look at the following code snippets. This is the entry point of the Flutter app. Here we just tell it to run StartApp().
In startApp.dart we will then define the theme of our app. We will also import our home.dart, create a StatelessWidget, define the theme colours and set our home to Home().
Here we import flutter/material.dart as well as our authHelper.dart. We then create a StatefulWidget.
Our _Home() will look like the following: We create an app bar with the Title ‘Flutter Authentication Tutorial’. Then we want a text field as well as three buttons, one called ‘Login’, another ‘Logout’ and the third ‘Delete’. You can place them however you like. I also gave them different colours. The onPressed will be explained in a minute. Also, we add a circular progress indicator that will be shown, when the app is busy.
Next, we need a couple of variables and functions. First, we create mUser and
Also, we need the functions
As the last thing
We are almost done. Let us add this code to the authHelper
Then we just need the logoutWithGoogle and the deleteUserWithGoogle functions. If we log out, we call signOut from Firebase and signOut from googleSignIn. When we delete the user we first log out and then delete the user completely.
And that’s it. If you have any questions or find any improvements to be made, do not hesitate to leave a comment. For more Flutter tutorials, please check here.
Please keep in mind, that Flutter is still in beta, and things can change. I will try to keep everything up to date as good as possible though (except exact version numbers).