Integration of Cloud Database on Flutter by using Firebase

Frouen Medina Jr — Fri, 04 Oct 2024 23:17:36 +0000

So many people still confused on how to intergrate firebase in 2024?
So we will discuss in this section on how to intergrate our flutter in firebase.

First is to add the firebase dependency on your project, the filename is pubspec.yml

as you can see in this image we added firebase.core , and you can also others firebase dependencies like:

Firebase real time database
cloud storage
Firestore
Firebase Machine learning
and other types of firebase dependencies

For integrating the firebase on android you need to add the project on the firebase

select add app then select android app

Add the package name on the register project which you can find on the android manifest

go to the app then src, and you can find the android manifest file

Then download the file

Don't forget to add the google services json file

Add the required dependencies on the gradle app and project

Build Gradle - Module

Build.Grade - App

For IOS

Add the package name on the register project which you can find on the

Go to IOS folder in your flutter project and find project.pbxproj and go to line 371

Then press register and next go to download the google-services

Next is go to back to the IOS folder and Runner and Base.lproj and extract the GoogleService-info.plist, just press next to add the IOS app on the firebase.

Next is to Create an connection on your flutter project to initialize the firebase

Create a dart file that initialize the firebase details

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

class FirebaseRun {
  static Future<void> run() async {
    await Firebase.initializeApp(
        options: const FirebaseOptions(
          apiKey: 'your-api-key',
          appId: 'your-app-id',
          messagingSenderId: 'your-messaging-sender-id',
          projectId: 'your-project-id',
          storageBucket: 'your-storage-bucket',  // Add this line
    ),
    );

    if (Firebase.apps.isEmpty) {
      Fluttertoast.showToast(
          msg: "Firebase initialization failed",
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.BOTTOM,
          timeInSecForIosWeb: 1,
          backgroundColor: Colors.black,
          textColor: Colors.white,
          fontSize: 16.0
      );
    } else {
      Fluttertoast.showToast(
          msg: "Firebase is already initialized",
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.BOTTOM,
          timeInSecForIosWeb: 1,
          backgroundColor: Colors.black,
          textColor: Colors.white,
          fontSize: 16.0
      );
    }
  }

Then call the class file on your main.dart and make sure don't forget to add async and WidgetFlutterBinding.ensureInitialized.

And done you successfully Intergrate your firebase into your flutter project.

Credit for the Photo Cover : https://www.easternts.com/blog/the-dynamic-duo-flutter-and-firebase/

DEV Community: Frouen Medina Jr

Integration of Cloud Database on Flutter by using Firebase