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.

Im going to be honest; Im 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.

Lets Get Started

I will assume that you have a starter template setup to enter email, password, or a button to login with Gmail. Lets 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

1. Configuring the Flutter project

Lets add the necessary packages that were 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 havent 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.

Dont forget to enable the Email/Password Sign in and Google Sign In methods.

3. Creating the Auth Controller

First, lets 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 lets 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? Lets 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.

Our dependencies are completed and initialized. Now lets 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 its 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.

Note for the reader

This is my first time writing a medium story but you know you can press the clap button 50 times? The higher you go, the more it motivates me to write more stuff for you!

I have a Youtube Channel Named Coding with Imran

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