React Native: Firebase GTM Integration Installation

Subscribe to our monthly newsletter to get the latest updates in your inbox
It's possible to use React Native and install Firebase GTM. This is great because no documentation on this topic exists at the moment. Below is a summary. Our goal is to provide a bit of structure around installation because we're combining several different technologies and, therefore, it's easy to become disorganized.  

Step 1: Install Firebase

To accomplish this, we'll use the below integration. This integration allows us to use JavaScript to make analytic calls instead of having to write native code twice.
This is a good starting place for installing the integration. The basic outline is below:
At this point you should have Firebase installed.

Step 2: Install Firebase GTM

You'll need to install an individual container for both iOS and Android. We'll need to access the native level of the React Native app. Because this part is native, it's identical to the standard Firebase GTM installation.
  • iOS
    • Install Cocopods
    • Add the below to the podfile.
      • pod 'GoogleTagManager', '~> 6.0'
    • Run 'pod install'
    • Create GTM Container and download default container.
    • Place default container into a created 'container' folder.
      • <PROJECT_ROOT>/container/GTM-XXXXXX.json
      • Note: This has to be an actual folder with the exact name—otherwise GTM will not be installed correctly.
  • Android
    • Add the below under 'dependencies' within the app gradle.
      • compile 'com.google.android.gms:play-services-tagmanager:11.0.4'
    • Create GTM Container and download default container.
    • Place default container into a created 'containers' folder.
      • app/main/assets/containers
      • Note: This has to be an actual folder with the exact name—otherwise GTM will not be installed correctly.
 

Step 3: Add Analytics Code

We can now add JavaScript code to our React Native app that will send data to Firebase GTM. We do this by calling the below object:
firebase.analytics()
We can send data to Firebase GTM with the below:
firebase.analytics(). logEvent('eventName', {'event':'parameters'});
Here's the  reference for more info.
This information is sent to Firebase GTM and, therefore, Firebase Analytics automatically. We should see this information in the Firebase Analytics StreamView. Once we have Google Analytics tags setup in Firebase GTM, we should see this information appear in Google Analytics Real-Time reports as well.