At the heart of Firebase is Google Analytics for Firebase, a free and unlimited analytics solution also referred to as Firebase Analytics. Firebase Analytics integrates across Firebase features and provides you with unlimited reporting for up to 500 distinct events that you can define using the Firebase SDK. Analytics reports help you understand clearly how your users behave, which enables you to make informed decisions regarding app marketing and performance optimizations.
Before we dig deeper into the technical aspects of tracking React Native Mobile Apps using Google Analytics for Firebase, what is React Native?
What Is React Native?
Enabling Firebase Analytics in React Native App
To enable Firebase Analytics tracking in a React Native app, we are going to use React Native Firebase (aka RNFirebase). RNFirebase is a well-tested feature-rich modular Firebase implementation for React Native. It supports iOS & Android platforms for over 15 Firebase services (including Firebase Analytics). Using the RNFirebase Analytics Module, we can implement Firebase Analytics to track React Native mobile apps. During the opening keynote at the Firebase Summit in Prague, Google openly announced its working relationship with the RNFirebase team – check it out here.
RNFirebase provides a light-weight layer on top of the native Firebase SDKs (iOS & Android). RNFirebase supports a vast majority of Firebase services; each module is optional – only install what you require. In our case, we are going to install Google Analytics for Firebase module.
Installing the Google Analytics for Firebase Module of RNFirebase
The steps below start with creating a Firebase Project and detail how to add your app to the Firebase project and RNFirebase to your app.
Step 1: Assuming you have your React Native App up and running, open your terminal, redirect to your project directory, and run the following command to add RNFirebase to your project:
Step 2: Go to console.firebase.google.com and create your Firebase Project.
Note: Android and iOS each require specific installation steps; below we are providing the Android installation steps specifically.
Step 3: Add your app to the Firebase project. In the android version of your app, go to the AndroidManifest.xml file to get the Android package name to use it while you are adding the Android app to the Firebase project.
Step 4: Click the “Register App” button and download the google-services.json file and move it to the android/app folder.
Step 5: To link the RNFirebase to your app, in your terminal, make sure to redirect to your project folder and run the following command:
Step 6: Add Firebase SDK to your Android App as shown in the following screenshot:
Step 7: After adding the RNFirebase to your project, to be able to use it, you need to import it in the JS files as follows so you then log events:
Sending Data to Firebase with RNFirebase
To verify tracking, use the DebugView to see your events logged into the Firebase console in real-time.
During development, it is important to validate your Analytics configuration. Once you have enabled Debug mode on your development device, you can see your app’s events being logged in the DebugView report.
To enable Analytics Debug mode on an emulated Android device, execute the following command line:
This behavior persists until you explicitly disable Debug mode by executing the following command line:
To enable Analytics Debug mode on your iOS development device, specify the following command line argument in Xcode:
This behavior persists until you explicitly disable Debug mode by specifying the following command line argument:
Don’t Sacrifice Tracking for React Native