React Native

How to install Google Analytics for React Native?

This article is the third of a series aiming to answer to What is Analytics, Why, When and How to use it

In my previous articles, I explained why Analytics is such a great tool to help drive a product, and then I detailed why I think Google Analytics (GA) is the perfect platform for this matter.

Let's now dive into the technical implementation of Google Analytics for React Native.

At the bottom of the article I talk a bit about tracking with Google Tag Manager, and then I mention Firebase which is a new Google tool for doing Analytics (and many more things) on mobile.

Handmade implementation or package?

Handmade implementation

Google Analytics in itself is not very complicated to implement. Without too much trouble (maximum two man days), you can implement the basic native tool yourself and adapt it to React Native: Google Analytics native on Android -Google Analytics native on iOS.

Package

In my opinion however, an up to date and popular NPM package will often be a more sustainable solution than a handmade implementation (provided that the package answers your needs).

So far the best package for React Native I found is GoogleAnalyticsBridge and it works like a charm:

    1 - Package install: Follow the readme in the github repository. You should not face any issues. If you do face any, don't hesitate to ask the author of the package, he is very reactive.

    2 - GA account creation: Create a Google Analytics account here.

    3 - Analytics service creation in React Native: In your code, create a dedicated Analytics service, and pass it the GA account tracking ID (looking like: UA-12345-1), that can be found in the parameters of the freshly created account:

++pre>import { GoogleAnalyticsTracker } from 'react-native-google-analytics-bridge';

export const tracker = new GoogleAnalyticsTracker('UA-12345-1');++/pre>

    4 - Screenviews tracking: We will need to also send the first batches of data to GA, the basic tracking is called Screenviews/Pageviews, in your navigation system you can trigger:

++pre>tracker.trackScreenView(screenName);++/pre>

    5 - Test: It is time to test your implementation on your local/staging environment, and start seeing some hits in the real-time console of Google Analytics.

    6 - Success: Congrats! GA is up and running now. You already will have access to a lot of precious information regarding your visitors path, habits and profiles.

Going further

From there you will be able to progressively customize your tracking and reporting by:

  • Creating two different properties (under one account): one for your staging environments and one for your production environments
  • Preventing your team/company on-app behavior to interfere with real customers data by banning IPs
  • Sending custom events for custom customer actions such as a click on a banner or a login action
  • Setting up goals (using your custom events) to get a deep understanding of the performance of your app
  • Passing custom dimensions along your hits to reinforce your analytics data with your specific business logic
  • Tracking the origin of installs of your customers
  • Retrieving "raw" data directly in Google Spreadsheet to build your own reports
  • If you are a ecommerce/marketplace business, getting to know more thanks to Google Analytics Ecommerce

Google Analytics or Google Tag Manager (GTM)?

There is a second way to send data from your app to GA: by implementing GTM tracking code, and then setting up GTM user interface to transfer data to GA.

GTM is a Tag Management System (TMS) allowing non-tech people to quickly get a glimpse of the platfrom tracking and change it at their will. It is nothing more than a javascript window injected into your platform, connected to a graphical interface from which you can set your tracking, and then dispatch data to different providers/partners (such as Google Analytics, Criteo, Facebook, etc.). Hence much more tracking flexibility with a centralized and organized implementation.

I would always recommend using GTM, the tool complexity is nothing in comparison with the comfort and scalability it brings. However regarding React Native I did not find a convincing solution in the time constraint I had for GTM, hence I went for the GA implementation. You can install GA directly today, and when the need is more pressing, easily transfer your tracking in GTM without losing data consistency.

Firebase: the new Google all-in-one mobile tool

Google Analytics may not be the latest/best solution to do Analytics on mobile apps anymore since firebase from Google. This new solution is a cloud services provider and backend as a service for mobile apps including an Analytics tool.

If you are intrigued, don't hesitate to take a look. As of today, I did not have the opportunity to test Firebase. GA is still great, extremely powerful and the main solution for Analytics on desktop.

In my next article, I will give you some advices to track data usable as actionable KPIs to drive efficiently your business!

New | A new project Made in BAM is out, Lighthouse for Mobile : Flashlight. Get to know your app' score performance right now!

Développeur mobile ?

Rejoins nos équipes