Firebase Analytics in React Native

Updated on Leave a Comment on Firebase Analytics in React Native

1. Introduction

Firebase Analytics (now called Google Analytics for Firebase) is a free, event-based analytics tool provided by Google. It helps track user behavior, engagement, and app performance in real-time.

In React Native, it allows us to:

      • Track screen visits

      • Capture button clicks / feature usage

      • Analyze user journeys

      • Collect custom events for business insights

 

2. Installation

Step 1: Install dependencies

yarn add @react-native-firebase/app @react-native-firebase/analytics

or

npm install @react-native-firebase/app @react-native-firebase/analytics 
 

Step 2: Setup Firebase Project

  • Go to Firebase Console.

  • Create a new project (or use existing).

  • Add your Android & iOS apps.

  • Download and place:

    • google-services.json → in android/app/

    • GoogleService-Info.plist → in ios/ project root

Step 3: Configure Native Files

Android

  • In android/build.gradle

 
buildscript { dependencies { classpath 'com.google.gms:google-services:4.3.15' } }

  • In android/app/build.gradle

 
apply plugin: 'com.google.gms.google-services'

iOS

  • Run:

cd ios && pod install

3. Basic Usage

Import Analytics

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

Log Events

AnalyticsService.logEvent(‘CHECKLIST_SEARCH’, {
   searched_keyword:text,
   searched_Result_Count:filtered.length,
});

Track Screen Views

import { useEffect } from ‘react’;

import { useNavigationState } from ‘@react-navigation/native’;

import analytics from ‘@react-native-firebase/analytics’;

const useScreenTracking = () => {

  const routeName = useNavigationState(state => state.routes[state.index].name);

  useEffect(() => {

    if (routeName) {

      analytics().logScreenView({

        screen_name: routeName,

        screen_class: routeName,

      });

    }

  }, [routeName]);

};

export default useScreenTracking;

 

4. Debugging Analytics

Enable Debug Mode

For Android:

 
adb shell setprop debug.firebase.analytics.app your.package.name

For iOS:

 
firebase analytics debug mode enabled via Xcode logs

Check events in DebugView (Firebase Console → Analytics → DebugView).

Analytics Result

Conclusion

Firebase Analytics in React Native provides a powerful, free, and reliable way to track user behavior, measure engagement, and evaluate app performance. By setting up standard events, adding custom tracking for key actions, and leveraging DebugView during development, teams can ensure accurate insights without slowing down the app. When combined with Crashlytics and other Firebase services, it becomes a complete solution for monitoring app health and user journeys.

You may also like

Leave a Reply