Google Analytics

2019-05-23

RN(react native)で開発したアプリをグーグルアナリティクス(Google Analytics)を使ってアプリを分析してみましょう。

概要

グーグルアナリティクス(Google Analytics)を使ってRN(react native)で開発したアプリを分析することができます。グーグルアナリティクス(Google Analytics)を使ってRN(react native)アプリを分析してみましょう。

ライブラリインストール

RN(react native)アプリとグーグルアナリティクス(Google Analytics)を連携するためにはGoogleAnalyticsBridgeライブラリをインストルする必要があります。下記のコマンドを実行してGoogleAnalyticsBridgeライブラリをインストールしてください。

npm install --save react-native-google-analytics-bridge

下のコマンドでRN(react native)とGoogleAnalyticsBridgeを連携してください。

react-native link react-native-google-analytics-bridge

react-native-google-analytics-bridgeライブラリを使う準備が終わりました。今まからグーグルアナリティクス(Google Analytics)を連動する準備をする必要があります。

Google Analytics

下のリンクを押してグーグルアナリティクス(Google Analytics)サイトへ移動します。

ログイン後左下のAdminメニューを選択します。

create account for mobile

左上の+ Create Accountを押します。

click create account

RN(react native)で作ったアプリの情報を入力して一番下のGet Tracking IDを押してトラッキングアイディ(Tracking ID)を生成します。

insert-app-info

react-native-google-analytics-bridgeライブラリとグーグルアナリティクス(Google Analytics)の連動する準備が終わりました。実際トラッキングアイディ(Tracking ID)を使ってRN(react native)で作ったアプリを分析してみます。

分析コード

RN(react native)で開発したアプリへグーグルアナリティクス(Google Analytics)で分析したいページへ下記のコードを追加します。

...
import { GoogleAnalyticsTracker } from "react-native-google-analytics-bridge";
...

...
let tracker = new GoogleAnalyticsTracker("UA-12345-1");
tracker.trackScreenView("Home");
...

はい、これで終わりました。簡単ですね?下記のコードへ自分のグーグルアナリティクス(Google Analytics)のトラッキングアイディ(Tracking ID)を入力します。

new GoogleAnalyticsTracker("自分のトラッキングアイディ")

トラッキングしたいページの識別するためのタイトルを入力します。

tracker.trackScreenView("Home");

私たちはこのコードをrender()へ入れて使ってます。どこがいい場所かは皆さんが判断して入れたらいいと思います。

もっと深い分析がしたい方は公式サイトを参考してreact-native-google-analytics-bridgeの色んな機能を使ってみてください。

お知らせ

私たちはアプリの分析だけではなくグーグルのファイアベース(Google firebase)の色んな機能を使うためreact-native-firebaseを使ってアプリを分析することにしました。別の機能のためreact-native-firebaseライブラリを設定するだけで児童にアプリを分析してくれます。react-native-firebaseライブラリの設定に関してはFirebase Admobのブログをみてください。

参考

Buy me a coffeeBuy me a coffee
Posts