Adding firebase analytics to Ionic

Adding firebase analytics to Ionic


  • Create a folder in which you are going to save your project
  • Open your favourite terminal and go to the folder you created
  • The first thing is to create the ionic project, the command below creates an App called MyGoogleDevApp with a blank template

ionic start MyGoogleDevApp blank

Add firebase cordova plugin

  • To add firebase cordova plugin the following the commands are run

    ionic cordova plugin add cordova-plugin-firebase

    npm install –save @ionic-native/firebase

  • Add the plugins the the apps module

Add provider to implement firebase analytics

  • The next step is to create a provider that will implement firebase analytics, you will use this provider to log events to firebase in your app

ionic generate provider FirebaseLogger

  • Add the provider the the app modules, if its not already there
  • Implement the code to call firebase using ionic native


constructor(public http: Http,private firebase:Firebase) {
console.log(‘Hello FirebaseLoggerProvider Provider’);


The next step is to call the provider you created in you app,

You can start by calling it in your home.ts

import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { FirebaseLoggerProvider } from “../../providers/firebase-logger/firebase-logger”;

selector: ‘page-home’,
templateUrl: ‘home.html’
export class HomePage {

constructor(public navCtrl: NavController,private firebaselogger: FirebaseLoggerProvider) {