react-native-firebase/docs/analytics/quick-start.md

title, description

title	description
Quick Start	Getting started with Analytics in React Native Firebase

Analytics Quick Start

Installation

Install this module with Yarn:

yarn add @react-native-firebase/analytics

Integrating manually and not via React Native auto-linking? Check the setup instructions for Android & iOS.

Module usage

The Analytics package will automatically start tracking events such as when users clear app data, dismiss notifications and more. To view the full list of automatic events, see Reserved Events.

The package also provides a JavaScript API to allow for logging custom events and metrics throughout your application.

Import the Cloud Functions package into your project:

import analytics from '@react-native-firebase/analytics';

The package also provides access to the firebase instance:

import { firebase } from '@react-native-firebase/analytics';

Custom events

To log a custom event, use the logEvent method:

import analytics from '@react-native-firebase/analytics';

async function onProductView() {
  await analytics().logEvent('product_view', {
    id: '123456789',
    color: 'red',
    via: 'ProductCatalog',
  });
}

Attaching user data

User data can be attached to analytical events via the setUser* methods:

import analytics from '@react-native-firebase/analytics';

async function onSignIn(user) {
  await Promise.all([
    analytics().setUserId(user.uid),
    analytics().setUserProperty('account_balance', user.balance),
  ]);
}

Tracking screen names

Similar to Analytics on the web, it's important to understand the user journey within your application, for example tracking drop off points during a e-commerce transaction flow. The Analytics package provides a method called setCurrentScreen to help track this.

import React, { useEffect } from 'react';
import { View } from 'react';
import analytics from '@react-native-firebase/analytics';

function BasketScreen() {
  async function trackScreenView(screen) {
    // Set & override the MainActivity screen name
    await analytics().setCurrentScreen(screen, screen);
  }

  // Track a screen view once the component has mounted
  useEffect(() => {
    trackScreenView('BasketScreen');
  }, []);

  return <View />;
}

Resetting analytics data

In some cases, resetting all analytics data is required on certain events such as signing out of the application. To achieve this call the resetAnalyticsData method.

import analytics from '@react-native-firebase/analytics';

async function onSignOut() {
  await analytics().resetAnalyticsData();
}