react-native-google-analytics

Google Analytics for React Native!

Getting started

1. npm install react-native-google-analytics@latest --save
2. AdSupport

• You can find RCTAdSupport.m in node_modules/react-native/Libraries/AdSupport.
• In xcode: Add RCTAdSupport.m in Your Project > Libraries > React.xcodeproj > React > Base.

Usage

Below is an example that utilizes this library along with react-native-ab for A/B testing.

'use strict';varReact=require('react-native');var{
AppRegistry,
StyleSheet,
Text,
View,
TouchableHighlight
}=React;var{ Experiment, Variant }=require('react-native-ab');var{
Analytics,Tracking: GATracking,Hits: GAHits,Experiment: GAExperiment}=require('react-native-google-analytics');varga=this.ga=null;varrnabtest=React.createClass({getInitialState(){return{experiments: {}};},componentWillMount(){GATracking.getClientId(function(err,clientId){ga=newAnalytics('UA-XXXXXXXX-X',clientId);varscreenView=newGAHits.ScreenView('GA Test','1','com.example.app');ga.send(screenView);});},render(){return(<Viewstyle={styles.container}><TouchableHighlightonPress={this._resetExperiment}><View><Experimentref="welcomeMessageTest"name="welcome-message"onChoice={this._onChoice}><Variantname="standard"><Textstyle={styles.welcome}>
Welcome to React Native!
</Text></Variant><Variantname="friendly"><Textstyle={styles.welcome}>
Hey there! Welcome to React Native!
</Text></Variant><Variantname="western"><Textstyle={styles.welcome}>
Howdy, partner! This here is React Native!
</Text></Variant></Experiment></View></TouchableHighlight><TouchableHighlightonPress={this._sendEvent}><Textstyle={styles.sendEventTest}>
Send GA Event
</Text></TouchableHighlight><Textstyle={styles.instructions}>
To get started, edit index.ios.js
</Text><Textstyle={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+Control+Z for dev menu
</Text></View>);},_onChoice(testName,variantName){varexperiment=newGAExperiment(testName,variantName);varstate=this.state;state.experiments[testName]=experiment;this.setState(state);},_resetExperiment(){this.refs.welcomeMessageTest.reset();},_sendEvent(){varexperiment=this.state.experiments['welcome-message'];vargaEvent=newGAHits.Event('Demos','send','React Native',100,experiment);ga.send(gaEvent);}});varstyles=StyleSheet.create({container: {flex: 1,justifyContent: 'center',alignItems: 'center',backgroundColor: '#F5FCFF',},welcome: {fontSize: 20,textAlign: 'center',margin: 10,},instructions: {textAlign: 'center',color: '#333333',marginBottom: 5,},sendEventTest: {color: 'blue',fontSize: 16,textAlign: 'center'}});AppRegistry.registerComponent('rnabtest',()=>rnabtest);

TODO: App example that doesn't use react-native-ab

API

Coming soon. For now, refer to the usage section.