Step by Step how to deploy flutter on Firebase Hosting

💡

Please Follow me on LinkedIn and GitHub

1. Install Firebase CLI

First, you need to install the Firebase Command Line Interface (CLI) to interact with Firebase from the terminal.

If you have Node.js (Make Sure if none you can downloat it from their official website) installed, run this command in your terminal:
```
  npm install -g firebase-tools
```
After installation, verify that Firebase CLI is installed by running:
```
  firebase --version
```
if no problem encountered, We are ready to go on to the next step

2. Create a Firebase Project

If you don't already have a Firebase project, create one in the Firebase Console. You’ll need this project to host your Flutter app.

Go to this link and login

https://firebase.google.com/

Go to Console

Click Create Project

I named it flutter test deploy

Go to Hosting Tab

Just Click continue to console

and here we have site, If you click the link:

Site not found cause we did not yet deploy our flutter app

💡

Just Follow the instruction and we will proceed to the next step

3. Log in to Firebase

Log in to your Firebase account by running in your cmd:
```
  firebase login
```
Follow the instructions to authenticate your Google account.

💡

Type Y . Then it will automatically direct to the browser, if not just copy the link and paste it to your browser. Choose your account where your project created in #2

If successfully

4.Firebase CLI provides web framework support. To enable it, call the following:

firebase experiments:enable webframeworks

4. Set Up Your Flutter Web App

Ensure your Flutter app is ready for web deployment by switching to the web platform:
```
  flutter config --enable-web
```

💡

Make sure the project directory is in your flutter project

Build your Flutter web app:
```
  flutter build web
```
This will generate a build/web/ directory that contains the compiled files for your web app.
again this is from bash but it the directory of my flutter project

💡

as you can it generates a build folder on your Flutter app. Every time we change or modify our app, if we deploy for the next version we need to flutter build . to rebuild your changes and ready for deployment

5. Initialize Firebase Hosting

Navigate to your Flutter project directory in the terminal, and then initialize Firebase Hosting:
```
  firebase init hosting
```
When prompted:
- Select your Firebase project.
  
  Clieck Enter