Keeping It Simple: Integrate Firebase and Agora.io in your Flutter Projects (Part 2)

This post is the second part of the three-part article on integrating Firebase and Agora.io in a Flutter Project. In the first part, we’ve specified what Flutter is and how to create and run the project.
In this part, we’ll be integrating Firebase and persist user data.

Backend as a Service (BaaS)

As the backend for Flutter, we decided to use Firebase. Firebase is a Backend-as-a-Service platform from Google.

Firebase provides a variety of services, including:

• Real-time database: This is a cloud-hosted NoSQL database that gives the developer the ability to store data and sync it between users in real time. If the app goes offline, the data is still available.

• Authentication: Firebase Authentication makes sure that the app can be built with secure authentication systems and enhances the login experience. Not only can you use your ‘local’ login credentials but Google, Facebook, GitHub and much more services can be used to log in.

• Reporting and Monitoring: The reporting and monitoring tools that Firebase provides are impressive. It connects to Google Analytics to provide free, unlimited reports about user behaviors, which gives the developer the ability to have better decision-making performance. Besides reporting, Firebase Performance Monitoring service allows you to have an insight into the performance characteristics of your app.

Impressive right? Let’s take a look at how we used it in our app.

First, we need to understand how we need to connect our Flutter app to the Firebase service. Take a look at How to set up Firebase.

Now everything is set up, let’s start to use the real-time database. In this small tutorial, we are going to tackle how we can save to and read from the database.

In Firebase, we’re going to make our first collection named ‘notes’.
In the screenshot below, you’ll see a few more as an example.

We are going to add the firebase packages to our pubspec.yaml file. Let’s also add the authentication package.

Always search for the latest version of the packages on https://pub.dev/

dependencies:
 flutter:
   sdk: flutter
 firebase_core: ^1.12.0
 firebase_auth: ^3.3.7

To use the package we’re going to import it into our dart file.

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';

In the code below you see how we can reference our notes collection and add a new item. It’s that simple.

CollectionReference ref =     FirebaseFirestore.instance.collection('notes');
User? user = FirebaseAuth.instance.currentUser;

ref.doc(user?.uid)
   .collection('notes')
   .add({
 'title':'Flutter Demo',
 'content':'First Note',
 'owner' : user?.uid
});

For more advanced usage of realtime databases check Realtime Database: Overview.

Why did we choose Firebase?

Well, both Flutter and Firebase are Google products. This makes it convenient for the developer, connections are easily programmed (as you saw in the tutorial!). Firebase SDK and UI libraries are instant and also quite stable.

It gives the developer the experience of an easy and fast development and the user a smooth usage of the app.

What’s next?

We’re almost there. There is only one important thing on our TODO list:

• Integrate Agora.io for our Real-Time Communication Needs.

In part 3 we’ll be integrating Agora.io in our project.