Using Firebase as your Backend for your Flutter Mobile Applications (I)

Jesutoni Aderibigbe
6 min readApr 10, 2023

--

The picture was got from Wikipedia Commons

Ever wondered how you can make your Flutter application functional without any form of stress? Firebase is the right option for you.

I recall when I started working with Flutter, I was already building pixel-perfect screens but I had a lack of satisfaction because my applications had no backend system, state management, state preferences, or validation system. To me, it looked like I was doing the job of a UI/UX designer but just drafting it out as codes. I didn’t really see excitement or much logic in what I was doing. However, one particular evening after coding classes, I stumbled on a youtube video where the instructor was to build an Instagram clone using Flutter and Firebase. It was from this video, my eyes opened to the several riches found in Firebase.

What is Firebase?

Firebase is a Backend-as-a-service(Baas) platform acquired by Google in 2014. It provides a suite of services for mobile and web applications. It is a very powerful tool used by developers to build highly scalable secure mobile and web apps with minimal effort. It is very easy and simple to use. Firebase can provide the following services;

  • Firebase provides a no SQL database that allows developers to store and sync data between clients in real-time. In other words, you can’t write SQL queries or work with MongoDB on the server side, Firebase provides a very easy-to-use and work database for the effectiveness and scalability of your application.
  • Firebase offers an authentication service that makes it easy for developers to integrate authentication into their apps, including email/password authentication, social login, and phone number authentication
  • Firebase provides a fast and secure way to host static websites, and web apps with features like automatic SSL, CDN integration, and easy deployment through the Firebase CLI

These and many more features would be examined in this article and subsequent ones.

Moving on……

Firebase provides a command line interface(CLI) that makes it easier to use its services. Before I knew about CLI, I used to go through long methods to have my codes run. In this article, we would be using the Firebase CLI to automate our codes.

What is The Almighty Firebase CLI?

Firebase CLI is a powerful tool for developers that simplifies the development and deployment of Firebase apps. It allows developers to manage their Firebase projects, test their code, and deploy their apps without leaving their terminals. It is a command-line tool provided by Firebase that allows developers to interact with Firebase services from their local development environment. The features of the CLI include;

  • Deployment: Firebase CLI allows developers to deploy their Firebase functions, hosting, and other services to Firebase from their terminal with a single command
  • Local testing: Firebase CLI provides a local testing environment for Firebase functions and hosting features, allowing developers to test their code before deploying it to Firebase.
  • Project management: Firebase CLI provides commands for creating, managing, and deleting Firebase projects, allowing developers to manage their Firebase projects from their terminal.
  • Emulators: Firebase CLI provides emulators for Firebase functions, hosting, and other services, allowing developers to test their Firebase code locally without having to deploy it to Firebase.

In simple terms, instead of going through the rigorous process of linking your Flutter project to your Firebase account, you can do it through a simple line of code.

HOW TO USE FIREBASE CLI WITH YOUR FLUTTER PROJECT

To set up your Firebase CLI with your Flutter project, you would have to follow these steps;

  • Create a Firebase account by clicking on the link below

After creating an account, you should have a window like this;

  • Create a new Flutter project
  • After this is done, create a new Flutter project by running the following commands in your terminal or command prompt(if you are a Windows User)
flutter create firebase_demo
  • After this is done, you should have a new Flutter project….
I created a fresh project to demonstrate our codes.
  • Install the Firebase CLI by running the following command in your terminal:
npm install -g firebase-tools

You should have something like this

  • After this is done, go to your project directory in the terminal and log in to your Firebase account using the following command:
firebase login
  • Initialize Firebase in your project by running the following command:
firebase init

You should have something like this;

  • Select the Firebase features you want to use in your project by using the arrow keys and space bar to select the features.
  • After choosing the features you want(which is an existing project), press enter
  • Follow the prompt where you would be asked whether you want to create a new project, use an existing project, or add Firebase to an existing Google Cloud Platform Project

After these steps, you are good to go... Congratulations, you are now a Backend developer!

Let’s start coding……

To use Firebase, you would have to install the following packages from the pub. dev; firebase auth and firebase core. To do this, you would have to use the following commands;

flutter pub add firebase_auth
and
flutter pub add firebase_core

The Firebase Core package is a required dependency for all Firebase packages in Flutter. It provides the necessary functionality to initialize and configure your Firebase project in your app.

The Firebase Authentication package is a specific package that provides APIs for user authentication in your app, such as email/password, Google, Facebook, and more. If you want to enable user authentication in your app using Firebase, you need to include the Firebase Authentication package as a dependency.

By including these packages, you can have access to all Firebase services.

In your main. dart file, add the following line of code.

await Firebase.initializeApp()

Your code would thus look like this;

Now to test if you have correctly installed the right packages, run the application on your emulator.

Congratulations, you can now use Firebase for your Flutter Application.

In our next tutorial, we would build a login and sign-up screen and use Firebase for our authentication and database. See you there!

--

--