How to add Firebase to Flutter

Firebase is a backend platform that offers a wide range of services for building mobile applications. It provides developers with tools and infrastructure to build, improve, and grow their apps. Integrating Firebase with Flutter gives a bunch of benefits to the developers. The major ones are mentioned below.

  • Real-time database: It enables real-time data synchronization, allowing our app to instantly reflect changes made by any user.

  • Authentication: It provides ready-to-use authentication methods, such as email/password, social media login (e.g., Google, Facebook, Twitter), and more.

  • Cloud firestore: It is a flexible, scalable NoSQL document database. It allows us to store, retrieve, and query data easily on a larger scale.

  • Cloud storage: It provides secure and scalable cloud storage for our app's files, including images, videos, and documents.

  • Performance monitoring: It helps us monitor our app's performance, such as network latency, rendering time, and UI freezes.

  • Analytics and crash reporting: It also monitors user behavior and engagement, allowing us to make data-driven decisions. Firebase Crashlytics helps us to track and analyze app crashes, enabling us to fix issues proactively.

Prerequisites

Before adding Firebase to our Flutter project, have the following prerequisites.

  • Make sure we have Flutter SDK installed on your machine.

  • I have logged into the Firebase console.

  • Installed Firebase and FlutterFire CLI.

Note: For the detailed installation of FlutterFire CLI, click here.

  • Set up a new Flutter project or open an existing one in our preferred IDE.

Adding Firebase to Flutter project

We can add Firebase to the Flutter project by following the instructions below.

Configure Firebase project

We will use the FlutterFire CLI to configure our Flutter Applications.

Navigate to the project root directory and run the following command to start the configuration process.

flutterfire configure

After running the above command, it will list all the existing projects from the Firebase console. We can navigate between them using the up and down arrow keys. We can choose a project from the existing one or create a new one by pressing the enter key.

After choosing create a new project , we will have to write down a project ID for our new Firebase project.

Project ID should be unique among all other Firebase projects. Otherwise, it will give an error. A valid project ID could be 'example-app-12345'."

After writing the project ID, we will have to choose the platforms on which this application will run. Select or deselect using the space key and press enter key to continue.

After the platform configurations, it will ask for permission to change the android/build.gradle & android/app/build.gradle files to apply configuration so we don't have to do it manually.

After that, firebase_options.dart will be automatically generated in lib folder. This folder will contain all the information related to the Firebase services, which we will avail, and the project IDs.

Initialize Firebase

After the configuration is completed, we can import the core plugin of Firebase by running the following command in the terminal.

flutter pub add firebase_core

Now we can import the generated firebase_options.dart file and firebase_core package into the dart file. Here, the main() function is defined by writing the following lines of code at the top of the file.

import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

Also, initialize Firebase by adding the following code in the main() function.

await Firebase.initializeApp(
  options: DefaultFirebaseOptions.currentPlatform,
);

The DefaultFirebaseOptions.currentPlatform ensures that the appropriate configuration options are used depending on whether the code runs on Android, iOS, or the web. It simplifies the initialization process by automatically selecting the correct options for the current platform.

After completing all the above steps, we can rebuild our Flutter application using the following.

flutter run

Conclusion

Integrating Firebase with Flutter offers numerous benefits, including real-time database synchronization, authentication, cloud storage, serverless functions, performance monitoring, analytics, and crash reporting.

Adding Firebase to your Flutter project can be done using either the Firebase CLI or the manual configuration method. The Firebase CLI provides a convenient way to set up Firebase in your project using the command-line interface with just a few commands.

Copyright ©2024 Educative, Inc. All rights reserved