ちょうど1年くらいにReact Nativeでちょっとしたアプリを作っていたのですが、最近はめっきり離れてしまっていました。Reactもv16になり、少し開発環境も変化しているかなと思っていたら・・・結構変わっていました。
React Native Showcaseを見ると、FacebookやInstagramはもとよりAirbnb, Skype, Tesla, Walmart, Wix, UberEATSなど日本でも有名な企業やサービスの採用が目立っています。

showcase

今回は良く使いそうなツール・コンポーネント・サービスを集めてみました。
随時更新もしていきたいと思います！

1. Expo

https://expo.io/

ExpoはReact Nativeの開発をサポートするツールです。
主に以下を提供してくれています。

Expo XDE、Expo exp
Expo Module
Create React Native App

Expo XDE / Expo exp

Expo XDE、Expo expを使ってアプリの実機確認や公開ができます。便利なところは、QRコードを発行して、スマホにインストールしたExpo.ioのアプリからQRコードを読み取るとアプリを確認できます。
個人的にシミュレータは好きでなかった（自分のマシンスペック的に厳しい）ので、実機確認できるのはとても助かります。もちろんHot Reloadも可能です。

Expo Module

Expoモジュールを使う事で、連絡先、カメラ、ソーシャルログインなどを手軽に扱う事ができます。
例えばSQLiteなどのモジュールがあります。

// SQliteのサンプル
import { SQLite } from 'expo';

const db = SQLite.openDatabase({ name: 'example.db' });

const getItem = (id) => {
  return new Promise((resolve) => {
    db.transaction(tx => {
      tx.executeSql(`select * from items where id = ?;`, [id], (_, { rows: { _array } }) =>  {
        resolve(_array);
      });
    });
  });
}

Create React Native App

create-react-native-appコマンドを使い、簡単にReact Native & Expoの開発環境を構築できます。
React-Nativeの公式チュートリアルのQuick Startで紹介されています。

React Native - Quick Start

2. CodePush

https://microsoft.github.io/code-push/

審査なしにコードの更新ができるという事です。
「そんな事して大丈夫なのか？」という感じだったんですが、jsbundleのデプロイについては問題ないとの事。ネイティブAPIの挙動を変更させる事がNGみたいなので、React Nativeについては影響がないと考えて問題ないみたいです。

参考：AppleのHot Code Pushリジェクト問題、React Nativeへの影響は？ - 踊る犬.netブログ (旧)

3. storybook

https://storybook.js.org/

storybookはUIコンポーネントを管理できるツールです。
以前はreact-storybookでしたが、現在はstorybookとしてReact、React Native、Vue.jsに対応しています。

4. Realm

https://realm.io/jp/

SQLiteに変わるデータベースで、パフォーマンスに関しても基本的にはSQLiteよりも良いとの事です。
他にも以下のような機能を提供してくれます。

双方向のデータ同期
リアルタイム共同編集
サーバープッシュ

自分もSQLiteからRealmに乗り換えました。

5. Auth0

https://auth0.com/

ソーシャルログインのサービスでReact Nativeにも対応しています。
メジャーなものだけであれば良いのですが、普段見かけないログインの実装が必要な場合に使えると思います。
docomoのサポートはなかなか見かけないですね。下記が一例になります。

salesforce
fitbit
shopify
soundcloud
wordpress
docomo

6. React Native Navigation

https://wix.github.io/react-native-navigation

Wixが作っているルーターです。
ルーターは他にも、

React-Navigation
react-native-router-flux

などもあります。

7. react-native-calendars

https://github.com/wix/react-native-calendars

またしてもWix製のコンポーネントです。カレンダーは使いどころが多そう。

8. react-native-maps

https://github.com/airbnb/react-native-maps

こちらはAirbnb製です。かなり多機能なので使える場面は多そう。

9. react-native-camera

https://github.com/lwansbrough/react-native-camera

Cameraを扱えるコンポーネントです。onBarCodeReadというプロパティを持ち、QRコードなどのバーコードにも対応しています。

10. react-native-vector-icons

https://github.com/oblador/react-native-vector-icons

こちらもお馴染みのアイコンです。限られたiconではなく、複数のアイコンに対応しているので使いやすくおすすめです。
対応しているアイコンは以下になります。

Entypo
EvilIcons
Feather
FontAwesome
Foundation
Ionicons
MaterialIcons
MaterialCommunityIcons
Octicons
Zocial
SimpleLineIcons

11. react-native-animatable

https://github.com/oblador/react-native-animatable

コンポーネントの設定だけで簡単にアニメーションを作成することができます。

12. react-native-progress

https://github.com/oblador/react-native-progress

プログレスバーのコンポーネントです。

13. react-native-lightbox

https://github.com/oblador/react-native-lightbox

lightboxのコンポーネントです。こういったのが動きがあるだけでアプリがリッチに見えます。

コラム

実は、react-native-vector-icons、react-native-animatable、react-native-progress、react-native-lightboxは同じ作者で、Joel Arvidssonという方が作っています。
彼の作ったVogueというアプリは、Appleが選ぶ2016年のBest Appsに選ばれており、React NativeのShowcaseにも掲載されています。
そして彼が作ったライブラリはReact Nativeのコミュニティの約35%で採用されているとの事です。

参考： https://oblador.se/

14. react-native-masonry

https://github.com/brh55/react-native-masonry

pinterest風UIを実装する事ができます。

15. react-native-blur

https://github.com/react-native-community/react-native-blur

ブラーのエフェクトをかけてくれるコンポーネントです。

16. react-native-keyboard-input

https://github.com/wix/react-native-keyboard-input

keyboardを切り替えれるようにカスタマイズできます。画像やスタンプの投稿を意識して作られたみたいです。これもWix製です。

17. react-native-tinder-swipe-cards

https://github.com/meteor-factory/react-native-tinder-swipe-cards

tinder風UIのコンポーネントです。

18. react-native-star-rating

https://github.com/djchie/react-native-star-rating

ユーザーに評価してもらうときに使えそうなコンポーネントです。

19. react-native-swiper

https://github.com/leecade/react-native-swiper

よくあるスワイプです。拡張もできるのある程度自分の思ったようにカスタマイズできると思います。

20. react-native-textinput-effects

https://github.com/halilb/react-native-textinput-effects

inputに対してカスタマイズができるコンポーネントです。コンポーネントの名前が<Sae>（さえ）、<Isao>（いさお）、<Madoka>（まどか）など日本の人名になっているのが面白いです。

サンプルは<Makiko>（まきこ）です。

21. react-native-fbsdk

https://github.com/facebook/react-native-fbsdk

Facebook公式のアナリティクスです。しかしGoogle Analyticsに比べると機能や管理画面が貧弱みたいなので今後に期待という感じでしょうか。

参考：https://qiita.com/imaimiami/items/4071aecbe1a63106d8e3

22. react-native-swipeable

https://github.com/jshanson7/react-native-swipeable

リストをスワイプするとしたから削除ボタンとかが出てくるあれです。

23. lottie-react-native

http://airbnb.io/lottie/

lottieはAirbnbが開発したアニメーションライブラリです。After Effectsで作ったアニメーションを取り込む事ができます。

24. react-native-action-button

https://github.com/mastermoo/react-native-action-button

アニメーションのボタンのコンポーネントです。

25. react-native-modal

https://github.com/react-native-community/react-native-modal

モーダルを実装してくれるコンポーネントです。

26. NativeBase

https://nativebase.io/

NativeBaseはUIライブラリで様々なコンポーネントを提供してくれます。WebでいうところのBootstrapみたいなものですね。

まとめ

開発環境もかなり変化していたり、便利そうなコンポーネントも増えているのでアプリの開発が捗りそうです。
調べているとWixがReact Nativeに対してかなり力を入れている印象でした。

ここにあるいくつかはExpoを使う事で代用できます。
しかしExpoを使うとNativeコードの編集が難しいので、Expoの機能をみて、自分の実装したいものがNativeコードの編集をしなくて完結できるか確認しましょう。
自分もこれが理由で、create-react-native-appを諦めました。

参考：https://qiita.com/gogotanaka/items/07f9f5ed8e93a47a8bcd#expo