Flutter - Integration with Firebase Services

If you want to use any Firebase service in a Flutter application, this tutorial explains how to connect your Firebase account with your Flutter application.

Firebase has many services such as Cloud Messaging, In-App Messaging, Remote Config, Dynamic LInks, A/B Testing, Realtime Database, and Firestore. If you want to use any Firebase service in your Flutter application, you need to make your application authenticated to use your Firebase account. This tutorial explains how to integrate a Flutter application with any Firebase service, including how to create a Firebase project, how to add Android and iOS applications to the project, and how to make the applications connected to access those services.

Setup Firebase Project

The first thing you need to do is adding a project to your Firebase account if you don't have any or if you want to use a different project. Open the Firebase Console. If the project to be used already exists, just select it in from the homepage of Firebase Console. For creating a new project, click on the Create a project button.

You'll be asked to enter the name for the project. You can enter any name to be set as the project name.

In the next step, you'll be asked whether you want to enable Google Analytics for your Firebase project.

If you choose to enable Google Analytics, you'll be asked to choose or create a Google Analytics account.

After that, wait for Firebase to finish creating your project.

Setup Applications

Having set up a project, you need to integrate your applications to the project. For each application on a specific platform, you need to add the application to the project. To add an application, open the project in Firebase Console. There should be some buttons for adding new applications and you need to select one according to the platform where your application runs.

Add an Android Application

To add an Android application, choose the Android icon on the homepage of the project. If you already have an application, you need to select the Add app first button and then choose the Android icon.

You'll be asked to enter the package name. Optionally, you can also enter the application nickname and the debug signing certificate SHA-1.

After that, you can download the config file (google-services.json). The config file should be copied to the android/app directory of your Flutter application.

In the next step, you need to add the Firebase SDK to your Flutter application. In the root-level build.gradle file (android/build.gradle, you need to make sure that google repository is already added and add dependency to Google Services plugin.

  buildscript {
  
      repositories {
          google() // Make sure there's google in the repositories, if not add it.
      }
  
      dependencies {
          // Add the following line to add Google Services plugin
          classpath 'com.google.gms:google-services:4.3.5'
      }
  }

In the app-level build.gradle (android/app/build.gradle, you need to enable to Google Services Gralde plugin by adding the below line at the bottom of the file.

  apply plugin: 'com.google.gms.google-services'

Finally, just click the Next button in the Firebase Console to finish the setup.

Add an iOS Application

To add an iOS application, choose the iOS icon on the homepage of the project. If you already have an application, you need to select the Add app button first and then choose the iOS icon.

You'll be asked to enter the buildle ID. To get the bundle ID, open the project in XCode. In the project navigator, select the top-level app and open the General tab. You should see the iOS bundle ID there. Optionally, you can also enter the application nickname and the App Store ID.

After that, you can download the config file (GoogleService-Info.plist). The config file should be copied to the Runner/Runner directory of your Flutter app using Xcode. It's recommended to use Xcode so that the file is also connected to the Xcode project.

The next step is creating a Podfile if you don't have one. You need to open terminal and navigate to the Xcode project and run the below command

  pod init

Then, open your Podfile and add:

  # add the Firebase pod for Google Analytics
  pod 'Firebase/Analytics'
  # add pods for any other desired Firebase products
  # https://firebase.google.com/docs/ios/setup#available-pods

After saving the Podfile file, run the below command which creates an .xcworkspace file for your app.

  pod install

In the next step, Firebase will tell you to add the initialization code in AppDelegate .

  import UIKit
  import Firebase
  
  @UIApplicationMain
  class AppDelegate: UIResponder, UIApplicationDelegate {
  
    var window: UIWindow?
  
    func application(_ application: UIApplication,
      didFinishLaunchingWithOptions launchOptions:
        [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
      FirebaseApp.configure()
      return true
    }
  }

Finally, just click the Next button in the Firebase Console to finish the setup.

Summary

That's how to add Firebase to a Flutter application. You need to create a project, add your applications to the project, download and copy the configuration file, and set up a few things in your Flutter application. After the setup has been done, you can access any Firebase service from your Flutter application.

You can also read our tutorial about:

• Using Firebase Analytics in Flutter.
• Using Firebase Dynamic Links in Flutter.
• Using Firebase In-App Messaging in Flutter.
• Using Firebase Realtime Database in Flutter.
• Using Firebase Remote Config in Flutter.