@dagonmetric/ng-log-firebase-analytics

Google Firebase Analytics integration of @dagonmetric/ng-log for Angular applications.


Keywords
angular-firebase-analytics, firebase-analytics, google-analytics, angular-firebase, firebase, angular-analytics, angular-logging-service, angular-logging, angular-log, angular-telemetry-client, analytics, logging, log, telemetry-client, telemetry, angular, typescript
License
MIT
Install
npm install @dagonmetric/ng-log-firebase-analytics@2.1.3

Documentation

Angular Firebase Analytics Implementation for NG-LOG

GitHub Actions Status Azure Pipelines Status npm version Gitter

Firebase Analytics implementation for DagonMetric/ng-log.

Getting Started

Prerequisites

The following npm packages are required before using this module.

  • @angular/common >= v8.0.0-beta.0
  • @angular/core >= v8.0.0-beta.0
  • @dagonmetric/ng-log >= v2.2.0
  • firebase >= v7.2.0

Installation

npm

npm install @dagonmetric/ng-log-firebase-analytics

or yarn

yarn add @dagonmetric/ng-log-firebase-analytics

Module Setup (app.module.ts)

import { LogModule } from '@dagonmetric/ng-log';
import { FirebaseAnalyticsLoggerModule } from '@dagonmetric/ng-log-firebase-analytics';

@NgModule({
  imports: [
    // Other module imports

    // ng-log modules
    LogModule,
    FirebaseAnalyticsLoggerModule.config({
      firebase : {
          apiKey: '<your_firebase_app_api_key>',
          projectId: '<your_firebase_project_id>',
          appId: '<your_firebase_app_id>',
          // Replace 'G-1111111111' with your measurementId
          measurementId: 'G-1111111111',
          // ...
      }
    })
  ]
})
export class AppModule { }

Usage (app.component.ts)

import { Component, OnInit } from '@angular/core';

import { LogService } from '@dagonmetric/ng-log';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  constructor(private readonly _logService: LogService) { }

  ngOnInit(): void {
    // Track traces
    this._logService.trace('Testing trace');
    this._logService.debug('Testing debug');
    this._logService.info('Testing info');
    this._logService.warn('Testing warn');

    // Track exceptions
    this._logService.error(new Error('Testing error'));
    this._logService.fatal(new Error('Testing critical'));

    // Track page view
    this._logService.trackPageView({
      name: 'My Angular App',
      uri: '/home'
    });

    // Track page view with timing
    this._logService.startTrackPage('about');
    this._logService.stopTrackPage('about', { uri: '/about' });

    // Track custom event
    this._logService.trackEvent({
      name: 'video_auto_play_start',
      properties: {
        non_interaction: true
      }
    });

    // Track custom event with timing
    this._logService.startTrackEvent('video_auto_play');
    this._logService.stopTrackEvent('video_auto_play', {
      properties: {
        non_interaction: true
      }
    });

    // Set user properties
    this._logService.setUserProperties('<Authenticated User Id>', '<Account Id>');

    // Clear user properties
    this._logService.clearUserProperties();
  }
}

Related Projects

Feedback and Contributing

Check out the Contributing page to see the best places to log issues and start discussions.

License

This repository is licensed with the MIT license.