Skip to content

React Native Tracking Implementation Guide

Info

As of version 1.1.4, GPS geo-location data is not captured and will only be derived from the IP address. To capture GPS geo-location data (requires permission grant by user), please use version 1.1.3.

Abstract

In this section we will walk through how you can implement and verify WOGAA tracking for your mobile application on iOS

Warning

Do not reshare this document with anyone unless they need to implement WOGAA tracking on their mobile applications.


Latest Version

The latest version of WOGAA Mobile Trackers is 1.2.0.


Overview

  1. Install via npm.
  2. Implement codes for React Native tracking.
  3. Check React Native implementation
  4. Verification of React Native implementation

Info

React Native Tracker uses native iOS and Android Tracker underneath.


Step 1. Install via npm

Install via NPM

NPM is an open source package manager for the JavaScript development.

Info

npm will install React Native Tracker under node_modules/react-native-tracker

The steps to install are as follows:

  1. npm install https://trackers.wogaa.sg/react-native/Tracker-1.2.0.tar.gz
  2. react-native link (React Native < 0.60)
  3. Update Podfile and App level Gradle build. See examples below.

Podfile Example

Podfile Example

source 'https://github.com/wogaa/Specs.git'

target 'MasterDetailExampleApp' do
  pod 'RNTracker', :path => '../node_modules/react-native-tracker' # React Native < 0.60
  use_frameworks! # or use_modular_headers! # React Native < 0.60
end

Gradle Example

Gradle Example

repositories {
  maven {
    url "https://trackers.wogaa.sg/android"
  }
}


Step 2. Implement codes for React Native Tracking

In your App.js class,

  1. Add import Tracker from 'react-native-tracker';.
  2. Add the following codes when your application starts for the appropriate environment.

For Staging

Tracker.start("STAGING");.

For Production

Tracker.start("PRODUCTION");.

Add track screenview for each view.

Track ScreenView

componentDidMount() {
    Tracker.trackScreenView('DetailScreen.js', 'DetailScreen');
}

Step 3. Check React Native Implementation

Method 1: Manually check the logs

Run your application using Xcode or Android Studio and verify the platform logs below

Example (iOS Tracker)

[WOGAA Tracker] Started (1.2.0)
[WOGAA Tracker] Sent (1)

Info

[WOGAA Tracker] Started (1.2.0) shows tracker has started and the version number of the tracker
[WOGAA Tracker] Sent (1) shows number of successful event(s) being sent to our backend system

Example (Android Tracker)

I/WOGAATracker: Started (1.2.0)
I/WOGAATracker: Sent: 1

Info

I/WOGAATracker: Started (1.2.0) shows tracker has started and the version number of the tracker
I/WOGAATracker: Sent: 1 shows number of successful event(s) being sent to our backend system

Method 2: Use tool to check if data is being received in your environment(s).

Info

  • Staging received events will take about 10 seconds to process. (Last 24 hours)
  • Production received events will take about 30 minutes to process. (Last 24 hours)

Step 4. Verification of React Native Implementation

A verification email will be sent once we have successfully received data from your mobile application.

It may take up to 7 working days for the verification. Please let us know if there is any issues with regards to this via wogaa@tech.gov.sg