Blogs/Technology

How to Integrate Firebase with Flutter: 7 Simple Steps

Written byTaha
Aug 4, 2026
8 Min Read
How to Integrate Firebase with Flutter: 7 Simple Steps Hero
Too Long? Read This First
- Create a Flutter project and a corresponding Firebase project.
- Install the Firebase CLI and FlutterFire CLI.
- Run flutterfire configure to connect your Flutter app to Firebase.
- Add firebase_core and any Firebase product plugins your app requires.
- Initialise Firebase in main.dart before calling runApp().
- Run the application and verify that Firebase starts successfully.
- Enable and configure individual Firebase services before using them in production.

Building a Flutter application often involves more than creating screens and interactions. Most apps also need a reliable way to authenticate users, store data, upload files, send notifications, and monitor errors.

Developing and maintaining separate backend infrastructure for all these requirements can take considerable time. Firebase simplifies the process by providing managed backend services that can be connected directly to a Flutter application.

In this guide, you will learn how to integrate Firebase with Flutter using the FlutterFire CLI. We will also test the connection, add Firebase Authentication, and troubleshoot some common integration errors.

Why Use Firebase with Flutter?

Flutter helps developers build applications for Android, iOS, web, and desktop from a shared codebase. However, it primarily handles the client side of an application. Features such as user authentication, cloud data storage, push notifications, and analytics still require backend services.

Firebase fills this gap by providing tools such as:

  • Firebase Authentication for managing user accounts
  • Cloud Firestore for storing and synchronising application data
  • Cloud Storage for handling images, videos, and documents
  • Firebase Cloud Messaging for push notifications
  • Crashlytics for tracking crashes
  • Analytics for understanding user behaviour
  • Remote Config for changing app behaviour without releasing a new version

These services can be added individually. You do not need to adopt the entire Firebase ecosystem simply because your application uses one Firebase product.

A Simple Example

Imagine that you are developing a real-time chat application in Flutter.

Without a managed backend, you would need to create authentication endpoints, design a database, build real-time communication, secure the APIs, deploy the server, and monitor its performance.

With Firebase, you can use Authentication to manage users, Cloud Firestore to store and synchronise messages, Cloud Storage for media files, and Cloud Messaging for notifications.

Firebase does not remove the need for application architecture or security planning. However, it removes much of the infrastructure work, allowing the development team to focus on the product’s core functionality.

Prerequisites

Before starting, make sure you have:

  • The Flutter SDK installed
  • Android Studio or Xcode configured for the platforms you plan to support
  • A Google account
  • Node.js and npm, which are required to install the Firebase CLI
  • A device or emulator for testing the application

You can verify your Flutter installation by running:

flutter doctor

Resolve any platform-specific issues reported by this command before continuing.

How to Integrate Firebase with Flutter in 7 Steps

1. Create a Flutter Project

Open a terminal and create a new Flutter application:

flutter create my_flutter_firebase_app
cd my_flutter_firebase_app

If you already have a Flutter application, navigate to its root directory instead.

Run the project once before adding Firebase:

flutter run

This confirms that the base Flutter project and your development environment are working correctly. If the app does not run at this stage, fix the Flutter or platform configuration first. Otherwise, it may be difficult to determine whether a later error comes from Flutter or Firebase.

2. Create a Firebase Project

Open the Firebase Console and select Create a project.

Enter a project name and follow the setup process. Firebase may also ask whether you want to enable Google Analytics. Analytics is optional for the initial integration, although some Firebase products benefit from it.

A Firebase project acts as the central container for your application’s backend services. The same project can contain separate Android, iOS, and web app registrations, allowing them to access the same Firebase resources.

For a production application, it is better to maintain separate Firebase projects for development, staging, and production. This prevents test users and development data from affecting the live environment.

3. Install the Firebase and FlutterFire CLIs

The recommended setup uses two command-line tools:

  • Firebase CLI manages access to Firebase projects.
  • FlutterFire CLI configures Firebase specifically for Flutter applications.

Install the Firebase CLI using npm:

npm install -g firebase-tools

Log in to Firebase:

firebase login

Next, install the FlutterFire CLI:

dart pub global activate flutterfire_cli

Confirm that both tools are available:

firebase --version
flutterfire --version

If your terminal cannot find flutterfire, add Dart’s global executable directory to your system path and restart the terminal.

Let’s Build Your Flutter App Together!

Work with our expert team to turn your app idea into a fast, stunning Flutter product.

4. Connect the Flutter App to Firebase

From the root of your Flutter project, run:

flutterfire configure

The CLI will ask you to:

  1. Select an existing Firebase project or create a new one.
  2. Choose the platforms your Flutter app supports.
  3. Confirm or provide platform-specific app identifiers.

After configuration, the CLI generates this file:

lib/firebase_options.dart

This file contains the Firebase configuration for each selected platform. Your Flutter application will use it to connect to the correct Firebase project.

The FlutterFire CLI also registers the selected platform applications in Firebase. Therefore, you usually do not need to download and place google-services.json or GoogleService-Info.plist manually when using this workflow.

Run flutterfire configure again whenever you:

  • Add a new platform
  • Connect the app to a different Firebase project
  • Add certain Firebase products that require platform-specific configuration
  • Change an app identifier or build configuration

The values in firebase_options.dart identify your Firebase project, but they are not treated as secret credentials. Access to Firebase data should be protected using Authentication, Security Rules, and App Check—not by hiding this configuration file.

5. Add the Required Firebase Packages

Every Flutter application using Firebase requires the core plugin:

flutter pub add firebase_core

You can then add plugins for the Firebase products your application needs. For Authentication and Cloud Firestore, run:

flutter pub add firebase_auth
flutter pub add cloud_firestore

Using flutter pub add is preferable to copying fixed package versions into pubspec.yaml because it selects versions compatible with the current project.

After adding the plugins, update the Firebase configuration:

flutterfire configure

You do not need to install every Firebase package. Each additional plugin increases the app’s dependencies and may require its own platform configuration. Add services only when the application needs them.

6. Initialise Firebase in the Flutter App

Open lib/main.dart and initialise Firebase before running the application:

import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';

import 'firebase_options.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

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

  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Text('Firebase connected successfully'),
        ),
      ),
    );
  }
}

WidgetsFlutterBinding.ensureInitialized() prepares Flutter before any asynchronous platform operation is performed.

Firebase.initializeApp() then creates the default Firebase application using the platform-specific values generated by the FlutterFire CLI.

The await keyword is important. It ensures that Firebase finishes initialising before widgets that depend on Firebase are rendered.

7. Run and Test the Integration

Rebuild the application:

flutter run

If the app launches and displays Firebase connected successfully, Firebase Core has been initialised without an immediate configuration error.

However, displaying this text alone does not confirm that every Firebase product is configured correctly. Each service should be tested independently. For example, Authentication requires a sign-in provider to be enabled, while Firestore requires a database and appropriate Security Rules.

You can also confirm the connection by checking the debug console for Firebase initialisation errors.

When switching between platforms, test each target separately:

flutter run -d android
flutter run -d ios
flutter run -d chrome

The available device names may differ depending on your environment.

Using Firebase Authentication in Flutter

Once the base integration works, you can begin adding Firebase services. Authentication is a useful first example.

Before writing the authentication code, open the Firebase Console and navigate to:

Authentication → Sign-in method → Email/Password

Enable the Email/Password provider and save the setting. Installing the Flutter package alone does not activate a sign-in method.

Create a User Account

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential?> signUp({
  required String email,
  required String password,
}) async {
  try {
    return await FirebaseAuth.instance.createUserWithEmailAndPassword(
      email: email.trim(),
      password: password,
    );
  } on FirebaseAuthException catch (error) {
    switch (error.code) {
      case 'weak-password':
        print('The password is too weak.');
        break;
      case 'email-already-in-use':
        print('An account already exists for this email.');
        break;
      case 'invalid-email':
        print('Enter a valid email address.');
        break;
      default:
        print('Registration failed: ${error.message}');
    }

    return null;
  }
}

Sign In an Existing User

Future<UserCredential?> signIn({
  required String email,
  required String password,
}) async {
  try {
    return await FirebaseAuth.instance.signInWithEmailAndPassword(
      email: email.trim(),
      password: password,
    );
  } on FirebaseAuthException catch (error) {
    print('Sign-in failed: ${error.message}');
    return null;
  }
}

Sign Out

Future<void> signOut() async {
  await FirebaseAuth.instance.signOut();
}

Printing errors is acceptable while testing, but production applications should display understandable messages in the interface and record unexpected failures using an appropriate monitoring service.

You should also validate user input, support password resets, consider email verification, and avoid revealing whether a particular email address is registered.

Let’s Build Your Flutter App Together!

Work with our expert team to turn your app idea into a fast, stunning Flutter product.

Common Firebase and Flutter Integration Errors

No Firebase App “[DEFAULT]” Has Been Created

This error appears when a Firebase service is used before Firebase Core has finished initialising.

Make sure the application awaits Firebase initialisation before calling runApp():

WidgetsFlutterBinding.ensureInitialized();

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

Also check for code that creates a Firebase service at the top level before main() runs.

Cannot Find firebase_options.dart

The configuration file is generated by the FlutterFire CLI. If it is missing, run:

flutterfire configure

Then confirm that the file exists under lib/ and that the import path in main.dart is correct.

flutterfire: Command Not Found

The FlutterFire CLI may be installed, but Dart’s global executable directory may not be available in your system path.

Add the appropriate directory to the path, restart the terminal, and run:

flutterfire --version

Firebase Works on One Platform but Not Another

Each platform must be registered and included in the generated configuration. Run flutterfire configure again and select every platform the app supports.

Also check that the Android package name, iOS bundle identifier, and other application identifiers match those registered in Firebase.

Authentication Requests Fail

Confirm that the required authentication provider is enabled in the Firebase Console. For email and password authentication, enable Email/Password under the project’s sign-in methods.

The error may also be caused by invalid credentials, network problems, disabled users, or provider-specific configuration.

Firestore Returns permission-denied

This usually means that the request was rejected by your Firestore Security Rules.

Do not solve the problem by leaving the database open to everyone. Update the rules so authenticated users can access only the data they are authorised to read or modify.

Preparing the Integration for Production

Connecting Firebase is only the first part of building a production-ready Flutter application. Before launch, review the following areas.

Configure Security Rules

Firestore and Cloud Storage Security Rules control who can access your application’s data. Rules should be based on authentication and data ownership rather than unrestricted public access.

Separate Your Environments

Development activity should not affect production users or data. Use separate Firebase projects for development, staging, and production, and generate the correct configuration for each environment.

Enable App Check

Firebase App Check helps reduce requests from unauthorised clients by verifying that traffic comes from a legitimate instance of your application. It complements Authentication and Security Rules but does not replace them.

Monitor Usage and Costs

Several Firebase products have free usage allowances, but costs may increase as traffic, database reads, storage, or cloud functions grow. Configure budget alerts and monitor product usage before releasing the app.

Add Crash Reporting

Firebase Crashlytics can help identify crashes, affected devices, and stack traces after release. This becomes particularly valuable when an issue cannot be reproduced locally.

Conclusion

Integrating Firebase with Flutter is straightforward when the configuration is handled through the FlutterFire CLI. The CLI registers the selected platforms, generates firebase_options.dart, and reduces the amount of manual Android and iOS configuration required.

Once Firebase Core has been initialised, you can add Authentication, Firestore, Cloud Storage, Crashlytics, Analytics, and other products as the application evolves.

The integration itself may take only a few steps, but a reliable production setup also requires secure access rules, environment separation, service-specific testing, and cost monitoring. Addressing these areas early helps you build a Flutter application that remains secure and maintainable as usage grows.

Author-Taha

Flutter Dev @ F22 Labs, solving mobile app challenges with a cup of coffee and a passion for crafting elegant solutions. Let's build something amazing together!

Share this article

Phone

Next for you

8 Best GraphQL Libraries for Node.js in 2025 Cover

Technology

Aug 4, 202613 min read

8 Best GraphQL Libraries for Node.js in 2025

8 Best GraphQL Libraries for Node.js in 2026 Too Long? Read This First - Choose Apollo Server when you need a mature ecosystem, GraphOS integration, plugins, or Apollo Federation. - Choose GraphQL Yoga for a modern, portable server with Fetch API compatibility and built-in support for subscriptions over Server-Sent Events. - Choose Mercurius when your application already uses Fastify and runtime efficiency is a major priority. - Use GraphQL.js when you need the official JavaScript implementati

9 React Native Animation Libraries and Tools Compared Cover

Technology

Aug 4, 202615 min read

9 React Native Animation Libraries and Tools Compared

Too Long? Read This First - Use React Native Reanimated for gesture-driven, interruptible, and performance-sensitive interface animations. - Use the built-in Animated API for simple fades, transforms, and timed sequences without another dependency. - Pair React Native Gesture Handler with Reanimated for swipes, dragging, pinching, rotation, and other touch-driven experiences. - Use Lottie React Native for non-interactive motion graphics supplied by designers. - Choose React Native Skia for cust

9 Critical Practices for Secure Web Application Development Cover

Technology

Aug 4, 202616 min read

9 Critical Practices for Secure Web Application Development

Too Long? Read This First - Define security requirements and model threats before implementation begins. - Treat authentication, account recovery, and MFA as one complete identity system. - Apply server-side authorization to every protected action and object. - Prevent injection with parameterized APIs, structured validation, safe output handling, and restricted outbound requests. - Protect sessions and tokens throughout their complete lifecycle. - Minimise sensitive data and manage encryption