How to connect with Firebase

Abubakar Saddique
6 min readJan 30, 2024

--

What is Firebase ?? :

Firebase, Inc. is a set of backend cloud computing services and application development platforms provided by Google. It hosts databases, services, authentication, and integration for a variety of applications, including Android, iOS, JavaScript, Node.js, Java, Unity, PHP, and C++.

For detailed information about firebase . Kindly read it from the official documentation .

Now let’s start . How to connect your app with firebase .

For connection with the firebase first you should go to the firebase console and create the new project in it .

Click on the add new project to add the new project in firebase .

Now here you have to add the project name in it (You can give any name whatever you want’s) .

Now click on the continue button after you successfully give the name to your firebase project .

Now disable the google analytic’s if you don’t need it and then click on the continue button .

Now it’s takes some time to create the new project in firebase .

After the project is created successfully in your app click on the continue button once again .

Now the project is create successfully . Now it’s time to connect your android , flutter , web and ios with your firebase project .

All of them have different way to connect with it .

Now click on these button’s to add whatever from these you want’s in your app .

In my case i am going to connect only with android and web .

You can connect as many as you want’s .

i ) Android :

Now when you click’s on the android it will show the following page and you have to add the data in it one by one .

Now in the first register section you have to provide three thing’s .

Android package name :

In the android package name you have to add the package name of your flutter app .

You can find the name of your app inside the . Android >> App >> Build . gradle section in which you will find the application id in the default config section .

You have to copy that name (This is name of your flutter project ) and paste it inside the android package name of the firebase project .

Now it’s time for the app nickname . It is optional and here you can any name to your firebase project .

Now it’s time for the SHA-1 key which is optional and used for different purpose in your flutter app .

SHA-1 information is required by Firebase Authentication (when using Google signin or phone number signin) and Firebase Dynamic Links. If you’re not using these features, you don’t have to provide a SHA-1.

Now you can get the SHA-1 key from from your flutter project by running the below command in the terminal of the vs code .

cd android

The above command is used to change the directory to the android directory . When the directory of your flutter project is changed successfully then you have to run the below command in the terminal of the vs code .

./gradlew signingReport

Now it will will generate a lot of data . Now you have to copy the SHA-1 key without blank spaces and with very care and paste it inside your firebase project .

After adding all of the above thing’s you have to click on the register app button to register your project for the android .

Now it will give’s you the google-service.json file .

You have to download the above file and paste it inside the Android >> App

After you have successfully paste it inside the flutter project in the Android >> App section then you have to click on the next button .

It will give you some of the lines of the groovy file or kotlin file you have to copy either one of them most of the cases your file of the flutter is in the groovy format so copy the copy line’s and paste it inside the mentioned area on the top of these line’s .

When you successfully paste the line in your flutter project then you should click on the next button .

Now in the next section you have to click on the continue to the console button .

That’s all for the connection to the android .

Web :

The connection with the web is much easier than the android .

Now click on the add app button in the firebase console and then click on the web button to connect your firebase project with the web .

App Nickname :

Now here you have to provide the app nickname . Here you can give any name to your fitebase project .

Now click on the register app after you have successfully add the nickanme to your firebase project .

Now you have to copy the firebase config data and paste inside the main app of your project .

Must add the dependencies of the below package in your flutter project to enables connecting to multiple Firebase apps.

Before any Firebase services can be used, you must first install the firebase_core plugin, which is responsible for connecting your application to Firebase.

For detailed information kindly read it from the official documentation .

Make the main method async and add the

 void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(
options: const FirebaseOptions(
apiKey: "AIzaSyAp8ljDNEBSuKQ8zUycDyw9y4f0SxVLNXA",
authDomain: "fir-ba361.firebaseapp.com",
projectId: "fir-ba361",
storageBucket: "fir-ba361.appspot.com",
messagingSenderId: "794169732064",
appId: "1:794169732064:web:8b3f538b898f259e09d985")
);
runApp(const MyApp());
}

When you have successfully paste the above line in your project then you have to click on the continue to console button .

That’s all for the connection with the firebase to the web . Now your flutter project is also enabled for the web .

Now in the same way you can connect to the flutter and other’s .

That’s all for this article . In the next article’s i will write for firebase authentication , firebase firestore database and many other’s in detail’s . Kindly also read these topics .

I hope you have learned a lot of new things 😊

Thanks for reading 📚

--

--