# Flutter on Fire: Connect Your App to Firebase Now!

### Step 1: Create a Firebase Project and Initialize it in your flutter app

I know you all know this already but just to be sure go ahead and create a firebase project. In my case I am using a project I just created for this purpose:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713024215860/84935f26-50f0-4b62-9dae-6bd4e9752f74.png align="center")

### Step 2: Setup Flutter Project

You can either use your existing project or create a Flutter project either from Android Studio or Visual Studio Code or IDE of your choice. But this the terminal command to create a Flutter project named app\_check\_demo for iOS and android.

```bash
flutter create app_check_demo --platforms android,ios
```

This is my `main.dart` from the default starter project. I just moved `MyHomePage()` to another page to get concise code here.

```dart
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}
```

### Step 3: Add Firebase core plugin to your Flutter

We have to add the latest [firebase\_core](https://pub.dev/packages/firebase_core) into our `pubspec.yaml` . So in our project terminal run the following command:

```bash
flutter pub add firebase_core
```

This is the terminal output:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713025526209/46c8ca29-9941-4a0b-b7b7-3ce28d9fe357.png align="center")

Here's the `firebase_core` in my `pubspec.yaml` . Do note that `firebase_core` your version might be different from mine as it gets updated regularly.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713025727763/f87f8f2c-047b-448d-89ce-675ff4eb7755.png align="center")

### Step 4: Initialize Firebase in your terminal.

In order to have complete control over Firebase, I'd generally recommend installing Firebase tools into your terminal. Here's how to do it.

<mark>Note: You can run the following commands from anywhere.</mark>

**Using npm:**

```bash
npm install -g firebase-tools
```

[You can check out Firebase docs for alternate installation methods.](https://firebase.google.com/docs/cli)

**Login to Firebase:** Once it's installed log into Firebase using your Google account by running the following command:

```bash
firebase login
```

The above command connects your local device to Firebase.

**See Firebase Projects:** You should be able to see all your firebase projects in your terminal with the next command:

```bash
firebase projects:list
```

### Step 5: Connecting your Flutter project to Firebase

<mark>Note: You have to run the following commands from your project root folder.</mark>

**Activate FlutterFire:** FlutterFire is a tool that helps us with connecting with firebase right from our terminal. So to activate the FlutterFire run the following command:

```bash
dart pub global activate flutterfire_cli
```

This is the output from my terminal:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713026871719/e3a12f95-8e0d-405c-8cda-354e5cff5704.png align="center")

**Connect Flutter apps to Firebase:**

```bash
flutterfire configure
```

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713027256582/c7261730-46d2-45ea-b01c-ad03e678ebe0.png align="center")

After you select the project you change choose which platforms you want to support. In our case we are supporting Android and iOS:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713027422076/94366076-1ab3-4327-ad51-b98a4f724f8b.png align="center")

After you confirm the platform. FlutterFire will automatically setup everything in our Firebase project

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713027644352/fa7c823c-0d9b-4115-977d-d352ee8f4cce.png align="center")

### Step 6: Final Step: Initialize Firebase in our main.dart

You just need to add the following lines to your main.dart:

```dart
void main() async {
  // Ensure that Firebase is initialized
  WidgetsFlutterBinding.ensureInitialized();
  // Initialize Firebase
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
  
  runApp(const MyApp());
}
```

There you go your Flutter apps are officially connected to your Firebase Project. You can check them out in your Firebase project console:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1713027960697/a9276122-5287-4148-b505-5d30ba144f5b.png align="center")
