How can we integrate Firebase into the Flutter project?

Hello everyone!

In this article, I talk about how can we integrate Firebase into the Flutter project. The one is manually setup for platform based, other one also new one is cli setup in the terminal.

Manual setup

We used to use this setup before the Firebase console got updates for the Flutter projects. Of course, i assume we have a gmail account to start.

We need to see -Get started- button in Firebase website and then we can select an account to create a project.

We enter the project name when click to -Create a project- button.

Only select -Continue- button.

Analyti s location is not important so i don’t change it.

The Firebase project is ready!

Now, we see main page in the Firebase console. There isn’t any project integrated but we can select any one also in there for integrating. So we can start it with iOS, then Android for the Flutter mobile project.

In here, we need to know Apple bundle ID. We can learn it while project is opening in the XCode.

Open the Runner > Signing&Capabilities .

It creates a Google-Service-Info.plist file depending bundle id. Dowload this file.

After download, we need to put this file in the ios > Runner .

We don’t need 3. step so Next.

We generally use Swift so coppy Swift codes and paste in AppDelegate.swift file. But sometimes, we don’t need this step too.

iOS setup is done!

Android setup is turn.

Almost same steps with iOS setup.

We can learn Android package name in AndroidManifest.xml file. Open the android > app > src > main > AndroidManifest.xml .

It creates a google-service.json file depending bundle id. Dowload this file.

After download, we need to put this file in the android > app .

We generally use Kotlin, so we need to watch this steps with Kotlin language in the project.

Android setup is done!

Thus, we have completed the manual integrations separately.

Just remember, we need to add firebase_core library to the Flutter project for run the app with Firebase.

CLI setup

Actually, CLI setup started for the Flutter project last year after updates and it’s really developer-friendly. I like this way because it’s faster and simple than other one. Many steps can be sometimes confuse.

We see the Flutter symbol in platforms. Select Flutter icon.

Start with install the Firebase CLI in the Flutter project.

We see some informations depending operating systems.

I use macOS so i use command line in project terminal like below.

curl -sL https://firebase.tools | bash

I have already Firebase CLI so i see this texts but if you don’t have, it will install.

Then need to login.

firebase login

Now, we can run Firebase CLI commands.

If you see any problem about command lines like that, we need to add some needed commands to path.

export PATH=~/Documents/flutter/bin:$PATH

We see activated the flutterfire_cli . But also we see a warning about next command line, because flutterfire’s path is not defined.

flutterfire’s path solution is there:

Then it’s successful and we see firebase_options.dart file.

Last step, add this line in the main.dart file.

All platforms’ setup is done!

We checked both Firebase integrations, which one is good for you?

Thanks for reading!
Any comments or suggestions are welcome!

Check out my YouTube channel here and Twitter here.