DEV Community

Cover image for Firebase Authentication with GetX in Flutter
Imran Sefat
Imran Sefat

Posted on • Updated on

Firebase Authentication with GetX in Flutter

Introduction 🎉

You know about GetX. It is an extra-light and robust solution for Flutter. It combines high-performance state management, intelligent dependency injection, and route management quickly and practically.

I won

I’m going to be honest; I’m not that pro at using GetX. So one day, I wanted to use GetX to make a flutter app with firebase authentication to understand better, but I was confused. Then it took me some time to figure out how it was working, and eventually, I succeeded and fell in love with the world of GetX.

I won

Let’s Get Started 🎯

I will assume that you have a starter template setup to enter email, password, or a button to login with Gmail. Let’s list the steps necessary to make the authentication process.

Steps 👣

1. Configuring the Flutter Project

2. Connect App to Firebase

3. Creating the Auth Controller

4. Inject the auth controller

5. Login or Signing up Users

6. Success

I won

1. Configuring the Flutter project ⚙️

Let’s add the necessary packages that we’re going to use throughout the application.

Copy the dependencies to your Pubspec.yaml file. I am using the latest version available now at this moment.latest version available now at this moment.

2. Connect App to Firebase 🤝

Now we have to connect our app to firebase. First, go to the firebase console and create your project if you haven’t already. You will see an option to add an app to firebase. Depending on your preference and requirement, do that. The steps are pretty straightforward, and firebase will show you what to do and how.

Firebase Console

Don’t forget to enable the Email/Password Sign in and Google Sign In methods.

Sign In Method

3. Creating the Auth Controller 🎮

First, let’s make a constant file for the sake of simplicity and not to get confused or code duplications. Copy the below codes and paste them into your dart file inside the lib folder.

Suggestion: Make a folder inside of the lib folder titled Constants.

Now let’s create the Auth Controller where all of our business login related to Firebase Authentication will work. Just copy the below codes and paste them into your dart file inside of your lib folder.

Suggestion: Make a folder for titled Controller.

4. Inject the Auth Controller 💉

We have created the Auth Controller, but how are we going to use it? Let’s hop into the main.dart file and make some changes to our code.

Here, we are initializing the firebase and injecting the AuthController instance in the 4th line.

Sign In Method

Our dependencies are completed and initialized. Now let’s sign up some users.

5. Login or Signing up Users 🙋‍♂️🙋‍♀️

I assume you have a basic or super beautiful Signup or login screen ready. If not, you can copy my code for the screen, but note that it’s a super simple screen.

The above code is pretty self-explanatory. There are just two (2) text fields for email and password, one button to login and one to Register / Signup. The last elevated button is for the google authentication popup.

6. Success 🎉

You just implemented Firebase Authentication in Flutter with GetX.

I have a Youtube Channel Named “Coding with Imran”

Do subscribe to my channel if you want to get future updates!

Top comments (12)

shah000 profile image

thanks but one question for you ..
how do we execute two function in single(login/Register) button pressed in flutter?

bigbott profile image

Nice article.
Especially I like the part when controller decides where to go. Clever.
But I have a doubt about making navigation from controllers. It makes code much less readable.
Also, you don't need to clear stack from the beginning, since there is nothing in stack. But this is not important detail.
Thanks for sharing.

cris96174560 profile image

Hello, I had a problem with the signOut method. It says it is not implemented. I'm using
firebase_auth: ^3.2.0
firebase_core: ^1.10.0

Would appreciate any help

imransefat profile image
Imran Sefat

Please check if you have imported the files correctly or check whether you have copied the signout function or not.

void signOut() async {
await auth.signOut();

Check if the above function is present in the auth_controller.dart file

cris96174560 profile image

Yes. Thanks for the reply
I traced the function all the way to

this is its code:

Future signOut() async {
throw UnimplementedError('signOut() is not implemented');

ankita_tripathi_5cdae815b profile image
Ankita Tripathi

This is by far the most sorted article on using GetX! Would you like to submit this article on Dev Library as well?

imransefat profile image
Imran Sefat

Thanks for being so kind.
Yes, I will be glad to submit there as well.

idaudk profile image
Daud K

bro, can you provide guide for facebook and forget password feature.

imransefat profile image
Imran Sefat

It's mostly the same for the Facebook authentication. You will be needing the flutter_facebook_auth package which can be found here:

a sample sign in function is given below:

Future signInWithFacebook() async {
// Trigger the sign-in flow
final LoginResult loginResult = await FacebookAuth.instance.login();

// Create a credential from the access token
final OAuthCredential facebookAuthCredential = FacebookAuthProvider.credential(loginResult.accessToken.token);

// Once signed in, return the UserCredential
return FirebaseAuth.instance.signInWithCredential(facebookAuthCredential);

I will try to make a video or write an article for the auth process including the password reset functions.

dbestech profile image
Info Comment hidden by post author - thread only accessible via permalink

Learn more about Getx here

whoadityanawandar profile image
Aditya B Nawandar

How do you make this role based?

mdusaama0 profile image

when app is running sometime it navigates to home screen automatically.
Console Log:
D/FirebaseAuth( 2968): Notifying id token listeners about user ( mjnetiCUregDma3eBECG79vyU9p2 ).

Some comments have been hidden by the post's author - find out more