はじめに
React Nativeアプリケーションのデータ管理手段について検討してみます。
下記の記事を大いに参考にさせていただきつつ、自分の関心に応じて気づいた範囲でアップデートしています（題名については、オマージュ？ということで）。下記記事では、「Couchbase: 情報が少なかったので除外しました...」とのことだったので、Couchbaseについての記述を追加しています。
また、上記記事の参考として挙げられていた下記のサイト(githubリポジトリですが、実際上READMEが下記引用通りののリストとなっています)は、上記記事発表以降もアップデートされており、今回一部参考にさせていただきました（ここに挙げた以上のストレージ系コンポーネントが紹介されています）。
Awesome React Native is an awesome style list that curates the best React Native libraries, tools, tutorials, articles and more. PRs are welcome!
今回の検討の方向性としては、まずは、アプリケーションのローカルでデータを管理する手法を対象とし、補足的に、アプリケーションにとってのリモート＝サーバーとのデータ同期について触れます。
Redux
React Nativeでの利用について、こちらの書籍で詳細に扱われています。
Reduxそのものの紹介については、上掲の【2018年5月版】や、下記記事などに譲ります。
MongoDB Realm
Realmは、MongoDB Atlas (DBaaS)と連携機能(Realm Sync)があります。
React Native Async Storage
React Nativeから提供されていましたが、下記サイトからの引用のように、すでに非推奨(deprecated)となっています。
Deprecated. Use one of the community packages instead.
コミュニティパッケージのいずれかを使うことが推奨されており、以下で紹介されています。
React Native Firebase
React Native Firebase is a collection of official React Native modules connecting you to Firebase services; each module is a light-weight JavaScript layer connecting you to the native Firebase SDKs for both iOS and Android.
Google社のMBaas(サービスとしてのモバイルバックエンド)のフロントエンド。
SQLite
react-native-sqlite-2
SQLite3 Native Plugin for React Native for Android, iOS, Windows and macOS. This plugin provides a WebSQL-compatible API to store data in a react native app, by using a SQLite database on the native side.
Inspired by fantastic work done by Nolan Lawson. It should be a drop-in replacement for react-native-sqlite-storage. It works pretty well with PouchDB on React Native app.
上記記事の日本語訳が下記で公開されています。
react-native-sqlite-storage
下記の利用記事が公開されています。
react-native-simple-store
下記でコードのサンプルを見つけることができます。
react-native-local-mongodb
Embedded persistent or in memory database for react-native. API is a subset of MongoDB's (NeDB).
It is a subset of MongoDB's (NeDB) API (the most used operations).
下記でコードのサンプルを見つけることができます。
Couchbase Lite
Couchbase Liteは、iOS、Android、.Netプラットフォーム用の組み込みNoSQLデータベースです。Android（Java）、iOS（Swift、Objective-C）、およびUWP/Xamarin（C#）のネイティブプラットフォームバインディングをサポートしています。
Couchbase Liteには、Couchbase Serverとの双方向同期を行う機能が提供されています。
React Nativeアプリで、Couchbase Liteを使用する場合、Couchbase LiteのネイティブAPIにアクセスする必要があります。そのために、React Nativeモジュールを利用します。
アーキテクチャー
Couchbase Liteを使用するReact Nativeアプリのアーキテクチャー以下のような構成を持ちます。
- UIレイヤー: JavaScript/TypeScriptで記述され、AndroidとiOSとで共通
- データ永続化レイヤー: ネイティブプラットフォーム言語で記述され、Couchbase Liteとのインターフェースを担当する。
- Couchbase LiteネイティブAPI: React Nativeモジュールを使用してJavascript UIにエクスポートされる
以下のようなチュートリアルが公開されています。提供されているReact NativeのUI実装（スタータープロジェクト）に対して、Couchbase Liteを利用するためのコードを追加していく形になっています。2018年時点のものにて、提供されているReact Nativeのソースコードは、すでに時代遅れなものとなっていますが、提供されているUI実装は無視しても（React Nativeを昔から使っている人は、提供物をベースに最新化してもよいかもしれませんが ）、チュートリアルの内容を参考にして実装を行うことができるでしょう（将来別の記事で発表したいと思っています）。
react-native-couchbase-lite
NOTE: This plugin works for Couchbase Lite 1.x only. For new projects, we recommend to use the Couchbase Lite 2.0 Native API and to write your own wrapper to access Couchbase Lite APIs from a JavaScript codebase (see https://facebook.github.io/react-native/docs/communication-ios.html).
ご注意まで。
Couchbaseについて
Couchbaseをモバイルアプリケーションで利用する意義について、以下の記事をご参考ください。
Couchbase Liteについての記事を以下の投稿で整理しています。
Couchbase Serverについては、日本語で読むことができるまとまった情報として、次の拙著を紹介させていただきます。