js-expo
導入: React Native (Expo)¶
注釈
本ページでは、Expo (Managed Workflow) を利用する場合の導入方法を紹介しています。React Native で Expo を利用しない場合 または Bare Workflow で開発を行う場合の方法は 導入: React Native を参照してください。
Expo Plugin のインストール¶
プロジェクトに対し、以下の通りパッケージをインストールしてください。
npx expo install react-native-repro
npx expo install expo-repro
app.json ファイルを編集する¶
以下のようにプロジェクトの app.json ファイルに設定を記述してください。
{
"expo": {
"plugins": [
[
"expo-repro",
{
"sdkToken": "00000000-0000-0000-0000-000000000000"
}
]
]
}
}
| キー | データ型 | 概要 | 詳細 |
|---|---|---|---|
sdkToken |
String | アプリで使用するSDKトークン | 管理画面の 設定 > プロジェクト設定 に記載されている SDK トークン を設定してください。 設定は必須です。 |
logLevel |
String | ログレベル | デフォルトで info レベルが設定されています。変更する場合のみ指定が必要です。設定可能な値は “debug”, “info”, “warn”, “error” のいずれかです。 |
endUserOptInDefault |
Boolean | オプトイン/オプトアウト初期状態の指定 | デフォルトで “true”（初期状態でオプトイン）が設定されています。変更する場合のみ指定が必要です。 |
advertisingIdentifierCollectionEnabled |
Boolean | 広告ID取得設定 | デフォルトで “false”（取得しない）が設定されています。広告ID（AAIDおよびIDFA）の取得を行う場合のみ “true” を指定してください。 |
openUrlFilterRegExList |
Array(String) | ユニバーサルリンクのURLパターン | ユニバーサルリンク機能を使用する際に指定が必要なURLパターンを設定します。この機能を使用する場合のみ記述してください。詳細は プッシュ通知（iOS） を参照してください。 |
androidPushNotificationChannelId |
String | プッシュ通知のチャネルID | プッシュ通知のチャネルIDを設定します。プッシュ通知機能を利用する場合のみ指定してください。（プッシュ通知機能を利用しない場合は、この項目を設定しないでください） |
androidPushNotificationChannelName |
String | Android用 プッシュ通知のチャネル名 | プッシュ通知のチャネル名を設定します。プッシュ通知機能を利用する場合のみ指定してください。 |
androidPushNotificationChannelDescription |
String | Android用 プッシュ通知のチャネルの説明 | プッシュ通知のチャネルの説明を設定します。プッシュ通知機能を利用する場合のみ指定してください。 |
androidPushNotificationShowBadge |
Boolean | Android用 プッシュ通知受信時のバッジ機能の利用可否の指定 | プッシュ通知のバッジ表示可否を設定します。プッシュ通知機能を利用する場合のみ指定してください。デフォルトで “true” が設定されています。 |
アプリケーションのネイティブコードを生成する¶
以下のコマンドを実行し、アプリケーションをビルドしてください。
npx expo prebuild --clean
React Native で Repro をインポートする¶
JavaScript のコード内で下記のように Repro をインポートしてください：
import Repro from 'react-native-repro';
これにより、 JavaScript のコード内から Repro オブジェクトのメソッドを呼び出せます：
Repro.track("user review", { rating: 3 });
SDKが収集した情報は定期的にサーバーにアップロードされます。
イベントをトラックする¶
意味のある分析や、マーケティング施策を実施するためには、適切なユーザーグループを絞り込むことが重要です。イベントをトラックしてユーザーの行動を記録することにより、管理画面上で目的に応じた適切なユーザーグループを選択することができるようになります。
イベントを用いたユーザーグループ指定の例:
どういうイベントをとるべきかわからない場合は、まず各画面の表示時にイベントをとってみることをおすすめします。
例:
@implementation MainViewController
- (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
[Repro track:@"MainViewController" properties:nil];
...
}
class MainViewController: UIViewController {
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
Repro.track(event: "MainViewController", properties: [:])
...
}
public class MainActivity extends AppCompatActivity {
@Override
protected void onResume() {
super.onResume();
Repro.track("MainActivity");
...
}
}
#include "ReproCpp.h"
...
ReproCpp::track("Initialized");
Repro.Track ("Initialized");
// Will be written later
class MainScreen extends React.Component {
componentDidMount() {
Repro.track("MainScreen", {});
}
...
}
import Repro from 'react-native-repro';
...
Repro.track("MainScreen", {});
import 'package:repro_flutter/repro.dart';
...
await Repro.track("Initialized");
ユーザーIDをセットする¶
Repro では分析結果はユーザー単位で集計しています。ユーザーIDをセットすることにより、下記のメリットがあります:
- 複数のデバイスを使っているユーザーを同一視できる
- キャンペーンの配信対象の抽出がより精緻になる
詳しくは こちら をご覧ください。
Next...¶
その他の機能についての詳細は、以下をご覧ください。