https://github.com/dagonmetric/ng-log-firebase-analytics
Google Firebase Analytics integration of @DagonMetric / ng-log for Angular applications.
https://github.com/dagonmetric/ng-log-firebase-analytics
analytics angular angular-analytics angular-firebase angular-firebase-analytics angular-log angular-logging angular-logging-service angular-telemetry-client firebase firebase-analytics google-analytics log logging telemetry telemetry-client typescript
Last synced: 12 months ago
JSON representation
Google Firebase Analytics integration of @DagonMetric / ng-log for Angular applications.
- Host: GitHub
- URL: https://github.com/dagonmetric/ng-log-firebase-analytics
- Owner: DagonMetric
- License: mit
- Created: 2019-10-12T18:01:49.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-08-14T19:47:56.000Z (almost 2 years ago)
- Last Synced: 2025-06-01T20:52:55.501Z (about 1 year ago)
- Topics: analytics, angular, angular-analytics, angular-firebase, angular-firebase-analytics, angular-log, angular-logging, angular-logging-service, angular-telemetry-client, firebase, firebase-analytics, google-analytics, log, logging, telemetry, telemetry-client, typescript
- Language: TypeScript
- Homepage:
- Size: 3.61 MB
- Stars: 6
- Watchers: 4
- Forks: 1
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# Angular Firebase Analytics Integration for NG-LOG
[](https://github.com/DagonMetric/ng-log-firebase-analytics/actions)
[](https://dev.azure.com/DagonMetric/ng-log/_build?definitionId=20)
[](https://www.npmjs.com/package/@dagonmetric/ng-log-firebase-analytics)
[](https://gitter.im/DagonMetric/general?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
Google Firebase Analytics integration of [DagonMetric/ng-log](https://github.com/DagonMetric/ng-log) for Angular applications.
## Getting Started
### Installation
npm
```bash
npm install @dagonmetric/ng-log @dagonmetric/ng-log-firebase-analytics
```
or yarn
```bash
yarn add @dagonmetric/ng-log @dagonmetric/ng-log-firebase-analytics
```
### Module Setup (app.module.ts)
```typescript
import { LogModule } from '@dagonmetric/ng-log';
import { FirebaseAnalyticsLoggerModule } from '@dagonmetric/ng-log-firebase-analytics';
@NgModule({
imports: [
// Other module imports
// ng-log modules
LogModule,
FirebaseAnalyticsLoggerModule.configure({
firebaseConfig : {
apiKey: '',
projectId: '',
appId: '',
// Replace 'G-1111111111' with your measurementId
measurementId: 'G-1111111111',
// ...
}
})
]
})
export class AppModule { }
```
Live edit [app.module.ts in stackblitz](https://stackblitz.com/github/dagonmetric/ng-log-firebase-analytics/tree/master/samples/demo-app?file=src%2Fapp%2Fapp.module.ts)
### Usage (app.component.ts)
```typescript
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 metrics
this.logService.trackEvent({
name: 'foo',
custom_map: {
dimension2: 'age',
metric5: 'avg_page_load_time'
},
measurements: {
avg_page_load_time: 1
},
properties: {
age: 12
}
});
// 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('', '');
// Clear user properties
this.logService.clearUserProperties();
}
}
```
Live edit [app.component.ts in stackblitz](https://stackblitz.com/github/dagonmetric/ng-log-firebase-analytics/tree/master/samples/demo-app?file=src%2Fapp%2Fapp.component.ts)
## Samples
* Demo app [view source](https://github.com/DagonMetric/ng-log-firebase-analytics/tree/master/samples/demo-app) / [live edit in stackblitz](https://stackblitz.com/github/dagonmetric/ng-log-firebase-analytics/tree/master/samples/demo-app)
## Related Projects
* [ng-log](https://github.com/DagonMetric/ng-log) - Vendor-agnostic logging, analytics and telemetry service abstractions and some implementations for Angular applications
* [ng-log-applicationinsights](https://github.com/DagonMetric/ng-log-applicationinsights) - Microsoft Azure Application Insights implementation for `ng-log`
* [ng-log-gtag](https://github.com/DagonMetric/ng-log-gtag) - Angular Google Analytics (gtag.js) logger implementation for `ng-log`
* [ng-log-facebook-analytics](https://github.com/DagonMetric/ng-log-facebook-analytics) - Facebook Pixel Analytics implementation for `ng-log`
## Feedback and Contributing
Check out the [Contributing](https://github.com/DagonMetric/ng-log-firebase-analytics/blob/master/CONTRIBUTING.md) page.
## License
This repository is licensed with the [MIT](https://github.com/DagonMetric/ng-log-firebase-analytics/blob/master/LICENSE) license.