【React Native】知っておきたかったアプリ開発Tipsまとめ

この記事では、React Nativeでアプリを開発してきて得た知見（特に他の記事ではあまり書かれていないもの）を雑にまとめてみました。
##Tip1: react-native-mapsのインストールが辛い
https://github.com/react-native-community/react-native-maps
React Nativeで地図機能を実装したいときに使うライブラリ。
インストールにはとにかく手こずりました。
公式ドキュメントのInstallation Instructionsにそってやっても上手くいかず、いろんな記事を参考にしてXcodeをゴリゴリいじっても上手くいかずって感じでした。。。
最終的にはReact Nativeをバージョン0.56から0.55.4にダウングレードしたら動きました！
##Tip2: react-native-router-fluxのドキュメントがしょぼい
https://github.com/aksonov/react-native-router-flux
画面遷移・ルーティングを実現するライブラリ。
機能は充実しているが、ドキュメントが乏しくてどう実装すればいいのかよくわからないケースがありました。react-navigationの方がよかったかも？
##Tip3: TextInputの日本語変換ができない問題
これは多分公式のバグで、TextInputでonChangeTextを使うと日本語変換がバグります。
(RN0.55.4/0.56ではこのバグがありましたが、RN0.57以降では解決されたそうです。)
関連issue: https://github.com/facebook/react-native/issues/18403
以下の記事に従ってTextInputを自作したら上手くいきました:
http://watanabeyu.blogspot.com/2018/04/react-native0542textinputonchangetext.html
##Tip4: redux-beaconでGoogle Analyticsをカンタンに実装しよう
トラッキングツールはGoogle Analyticsを使いました。
https://rangle.gitbook.io/redux-beacon/index/react-native-google-analytics#setup
redux-beaconを使ってGA用のMiddleware（gaMiddleware）を作成します。
以下のようにstoreを作成すれば実装完了です：

store.js

const store = createStore(
  reducer,
  applyMiddleware(gaMiddleware)
);

あとは先ほどのredux-beaconのドキュメントに従って、トラッキングしたいイベントを定義すれば、画面遷移や、どのactionがdispatchされたか、などをカンタンにトラッキングできます。
##Tip5: react-native-share-extension
他のアプリのShare Extension（例えばinstagramの「シェア」ボタン）から自分のアプリにデータを送ることを実現するライブラリ。
https://github.com/alinz/react-native-share-extension
これもXcodeをゴリゴリいじらないといけなく、相当辛かったです。。。
本体のアプリとShare Extensionは別々のアプリとして扱うので、Share Extension側からreduxのstoreにはアクセスできません。なので、Share Extensionと本体のアプリ間で何かしらのデータ（ユーザIDやアクセストークンなど）を共有したかったら、react-native-swiss-knifeを使うと良いです。その際、App Groupなるものを作る必要があります。
##Tip6: iOSとAndroidは同時に開発するべき
React Nativeの最も大きな特徴の一つとして、クロスプラットフォームが挙げられます。
しかし、僕たちはその特徴を活かしきれませんでした。理由としては、とりあえずiOSをリリースしてからAndroidに対応しようという考えの元、最後までAndroid側を放置していたからです。いくらクロスプラットフォームとはいえ、先述のMapやShare Extensionのようにネイティブの設定をそれぞれでしないといけない場合や、iOSのみ（Androidのみ）対応のコンポーネントなど多々あるので、もしAndroid版もリリースする予定があるなら、Android側も定期的にビルドしてちゃんと動くかどうか確認すべきです。
#最後に
友人2人と一緒にFoolipというグルメ情報管理アプリを作りました。
機能は：
・お気に入りの飲食店を保存して整理
・Instagram・食べログ・Retty・Retripから飲食店情報をカンタンに保存して一元管理
・新しいお店をレコメンド
です。
ぜひ使ってみてください！お問い合わせなどは僕のTwitterまで！
Foolip: https://apple.co/2A4vn4t