Firebase Integration in Flutter Application ❤

Almost every Mobile Application needs Backend Services like User Authentication, File Storage, Real-time Database, Analytics, and etc. Roughly about 8 years back, Backend developers had to write their own Backend services, which not just costed their time but extra efforts. However, luckily now we have Firebase, which is a Backend-as-a-Service (BaaS), that provides you above mentioned Backend services, which you can use, without worrying how’s it working, in your application by integrating Firebase in your Application.

Firebase, Backend-as-a-Service

In order to use Firebase Services in Flutter Application, we first need to integrate Firebase with Flutter Application.

Let’s Integrate Firebase with Flutter Application by Following below steps.

1. Create a Firebase Project

Open the Firebase console, and add a new project to add it in Flutter Application. Firstly give the Project name, and continue, that would create the Firebase Project.

Adding a New Project in Firebase Console

2. Add your Flutter Application in Firebase Project

As Flutter Supports iOS and Android Both, you need to add Firebase in both module for Android and iOS, if you want to run your application on both Platform, but we are just adding Firebase for android module. By Clicking on Android Button, you can add android. You need give below data in the form.

Adding Firebase in Android Module

• Package Name

To get the Package name for the Firebase, let’s First open the android module. For this right click on the project root directory on the project, and go in flutter, and click on open android module.

Opening of Android Module of Flutter Project in Android Studio

Now let’s go in app level build.gradle file. In the file, on scrolling down, you can find application id that is the package name of the application.

Package name of the Application

• Application Nick Name

Let’s give some Application Nick Name, anything.

• SHA-1 Key

In the android module, that we opened while finding the package name, open the gradle panel from right top side, then expand the android, which is the base option, and expand app, then task, then android. Now you can generate the SHA-1 Key by clicking on signingReport option.

Generating SHA-1 Key for Firebase

After giving all the required data, lets click on next and download the google-services.json file. Now open the android module, and in the project panel, first switch from android mode to Project, then inside the root directory, in the app folder, past the google-services.json file.

Saving the google-services.json inside the app folder

Now you need add some code in (app) build.gradle, (project) build.gradle. Let’s First switch back to Android mode, and open the project build.gradle and add the below line inside the dependencies.

classpath 'com.google.gms:google-services:4.3.2'

Adding Google Services Dependency in Project Level build.gradle

Now open the app level build.gradle file and add Firebase SDK for different Firebase services. Let’s add for common services like Firebase Auth, Firestore, and analytics. For this add below dependencies in app build.gradle file.

implementation 'com.google.firebase:firebase-analytics:17.2.1'
//For Firebase Analytics Service
implementation 'com.google.firebase:firebase-auth:19.2.0'
//For Firebase Authentication Service
implementation 'com.google.firebase:firebase-firestore:21.3.1'
//For Firebase Firestore Database Service

Adding Firebase SDK in App level build.gradle

That’s great! We have all almost done everything. But, sometimes, after adding Firebase in android module, it gives multidex error while building the project. So, it is better to enable multidex to avoid any build error.

In the app gradle.build file, add the below dependency in dependencies.

implementation 'com.android.support:multidex:1.0.3'

At Last, in the app gradle.build, inside the defaultConfig, paste this line below minSdkVersion

multiDexEnabled true

Enable Multidex in Android Project Module

That is awesome! Now Lets close the android module, and open Flutter pubspec.yaml file in order add dependencies to use Firebase plugins. Paste the below lines in the dependencies

firebase_core: ^0.4.0+9
firebase_analytics: ^5.0.2
firebase_auth: ^0.14.0+5
cloud_firestore: ^0.12.9+5

Adding Firebase Plugins in Flutter Application

Hurrah! We have successfully integrated Firebase in Flutter application.

Now you can build your Flutter application, and you can use the Firebase Services in your Flutter Application.

Now you can build Awesome Flutter Application using Firebase with Flutter.
Still don’t know, how to use Firebase services in Flutter? No worry at all, just click on the link and watch Firebase + Flutter video tutorial with Easy Approach.

Click on EasyApproach and Subscribe the channel.

Thanks!