Enabling Push notification on Flutter using Firebase

2 min readJun 29, 2022

So you have decided you need to show notifications on your app. In this post i will show you how to add push notifications to your flutter app.

I will be showing new way of adding firebase to flutter app.

Setting up Firebase.
Setting Firebase Cli.
Creating Project and adding firebase.

Setting up Firebase

First of create a firebase project if it’s not already there.

Give a name

Setting Firbase Cli

Make sure you have installed nodejs on your computer. If you havent follow instructions from here.

after that run the following command to install firebase cli.

npm install -g firebase-tools

you must authenticate your cli after installing it for that run.

firebase login

to activate firebase cli in dart run.

dart pub global activate flutterfire_cli

Creating Project and adding firebase

Create a flutter project using

flutter create project_name

Then run the following command to initilize Firebase in our project folder

fire configure — project=firebase project name

Yeay we have success fullly integrated firebase into our project. Now what’s left is to add Push notifications into our app. For that we need two packages
1. firebase_messaging

2. flutter_local_notifications

By default Firebase messaging will not show notifications while app is in foreground, for that we use flutter local notifications.

Start by adding both packages in your pubspec.yaml file and then creating a cloud messaging file that contains code for handling diffrent notifications and code for showing notification on foreground.

then add lines in main.dart