React Nativeとは
- Meta社（旧Facebook社）が開発した開発フレームワーク。
- 単一のコードでAndroid,iOS,Webアプリを作成することが可能になる※クロスプラットフォームフレームワーク
※以下XPFWと略する - 開発言語はJavaSctipt,TypeScript。
ReactNativeが流行する以前のモバイルアプリ開発における問題点
- プラットフォームごとに別々のソースコードを記述する必要がある
- プラットフォームごとに採用するプログラム言語が異なる
- プラットフォームごとの言語・FWなどの学習コストがかさむ。
- プラットフォームごとにメンテナンスが必要になり、手間と時間がかかる
つまり、多くのお金・時間・人が必要になるためモバイル市場への参入するハードルが高い
ReactNativeがモバイル市場へのハードルを下げた
React Nativeを利用すると、1つのソースコードを記述するだけで複数のプラットフォームで同じように動作をする事が出来るので、リソースやコスト・手間を削減できるようになる。
その他にもReactNativeには色々なメリットがある。
ReactNativeのメリット・デメリット
メリット
-
効率的な開発が可能となる
1コードでAndroidアプリ iOSアプリ Webアプリを同時開発する事が可能。 -
HotReload
HotReloadが備わっており、開発効率が良いという特徴がある。
例えば、SwiftやKotolinでiOSやAndroidアプリを開発する際、コード修正をした場合、再コンパイルが必要になる。
少量の修正をしただけでも、1からコンパイルが必要になり、時間にするとコード数によるが数秒~数分ほど。
一方、HotReload機能を持つReactNativeは、コードを保存するたびに自動的にリロードが行われ即時反映される。
そのため微修正ごとにコンパイルをしなくて良い。 -
Reactエンジニアだと学習難易度が低い
ReactNaitveとReactJSはコードの記載方法などが酷似しているため学習難易度が低い。
そのため、他のモバイルアプリフレームワーク(Xcode,AndroidStudio)と比べReactNativeを扱うまでにはそう時間はかかならないこと。 -
大規模なコミュニティがある
StripeやFirebaseとの統合やGoogle認証の実装や、多くのサードパーティが付加価値を提供している。
デメリット
-
頻繁にReactNativeのアップデートが発生する
アップデートが原因で動作していたアプリが動かなくなったり、エラーが発生したりするケースもあるため注意が必要。 -
ネイティブ開発エンジニアは学習コストが高い
SwiftやKotolinをメインにモバイル開発をしているエンジニアはJavaScriptを初めから学習する必要ある。 -
エラー箇所特定・解決に時間がかかる
ReactNativeは、JavaScriptレイヤーで発生したエラー、ネイティブレイヤーで発生したエラー、その他で発生したエラーか、など原因を特定・判断するのに時間がかかる。
ReactNativeの開発方法
ReactNativeには２種類の開発方法がある。
-
ReactNativeCLI
- XCodeやAndroidStudioをインストールする必要がある
- iOS/Androidのネイティブ言語の機能を組み込んだり、ネイティブ機能のライブラリが利用可能。
-
Expo
- XcodeやAndroidStudio不要。スマホにExpoClientアプリをいれてQRコード読み取りでアプリ動作確認可能
- ネイティブ機能・ネイティブを含むライブラリが利用できない。
例えば、Bluetooth、バックグラウンドタスク、AR/VR系の機能など・・・ - ReactNaitveCLIより簡単に開発が可能。
どちらを選定するかは、ネイティブの機能をどこまで利用するのか要件をまとめてからが良いかと思う。
ReactNativeCLIとExpoの違いについて詳細は次回記述する。