改めて、React Nativeについて書いていきたいと思います。
React Nativeとは何か？
ReactはFacebookが開発したJavaScriptのフレームワークであり、React Nativeはそれをモバイルで使えるようにしたものである。
React Nativeを使用することでネイティブに描画されるiOSとAndroidのアプリを作ることができる。１つのコードで、両方のプラットフォームで動くものが作れる。さらに、JavaやObjective-Cのライブラリを自分で書いてReact Native自体を拡張することもできる。WebでReactを使っているなら、ターゲットがモバイルに代わるだけなので簡単に使い始めることができる。
React同様、React NativeもJavaScriptと、JSXと呼ばれるXMLライクなマークアップを使って記述される。内部では、ネイティブのレンダリングAPIが呼び出されるので、WebViewではなく、ちゃんとしたモバイルUIコンポーネントが描画される。もちろん、プラットフォームの機能であるカメラや位置情報といったものも利用できる。
ネイティブのレンダリングAPIが呼び出されるクロスプラットフォームでのアプリ開発というと、以前だとTitanium Mobile、今だとXamarinなども思い浮かべられるかもしれない。ここでは特に比較などはしないが、１つReact Nativeが安心できるポイントとして、Facebook, Instagram, Airbnb, Baiduといった名だたるアプリがこぞって採用しているということが挙げられる。どういったアプリで利用されているかはこちらのページで見ることができる。
React Nativeの利点
他の多くのクロスプラットフォームを謳う開発方法（CordovaやIonic）と違い、WebViewではなくネイティブで描画されるのが大きな利点となる。
これらの開発方法ではネイティブでの表現（UI/UX）を再現するために多大な努力をしているが、完全な再現とまでは行っていないし、最先端からは一歩遅れた表現（UI/UX）になってしまう。また、パフォーマンスもあまり良くない。
一方でReact NativeではネイティブなUIが使われるし、また、メインのUIスレッドとは別に動くからパフォーマンスも高く維持される。
React NativeのアップデートサイクルはReactと同じで、propsやstateが変化したときにビューが再描画される。
開発の方法はほとんどReactと変わらないので、Reactを使ったことのある人にとって学習コストが低いのも大きい。同様に、開発メンバーも集めやすい。また、以下で述べるように普通のモバイル開発に比べて開発がしやすいのも大きなポイントである。
開発体験
React Nativeは開発ツールが充実している。例えば、React NativeはJavaScriptなのでアプリを再起動することなく、変更を反映することができる。画面上でただCommand + Rを押すだけで良い。
デバッグツールとエラー報告も優秀で、ブラウザのデベロッパーツールと同じように使える。テキストエディタはXcodeやAndroid Studioに縛られる必要がなく、好きなものが使える。
開発体験だけでなく、プロダクトのリリースサイクルにも良い影響がある。例えば、AppleはJavaScriptベースの変更を認めているので、レビューを通さずにアップデートをすることができる。
コードの再利用と知見の共有
React Nativeを使うことで、モバイルアプリ開発に必要なリソースは大きく短縮される。Reactの書き方を知っている開発者なら誰でもWeb、iOS、Androidのアプリを作れることになる。プラットフォームごとの専門職は要らなく、チーム全体で素早く知見を共有することができる。
知見だけではなく、コードも共有可能だ。全てのコードがクロスプラットフォームになるわけではなく、個別のプラットフォームに合わせたObjective-CやJavaのライブラリを作らなければいけないこともあるが、例えばFacebookの広告管理アプリのAndroid版の87%のコードはiOSと全く同じだという。
リスクと欠点
React Nativeにおける最も大きな危険性はおそらく、React Nativeがまだ発展段階にあるということだ。2015年の3月にiOS用としてリリースされ、同年9月にAndroid対応が発表されたばかりである。
まだネット上にも情報が多いとはいえないし、ドキュメントも整備されていない部分がある。ただし、足りないAPIは自分で作ることができるので、完全な「詰み」になることはないだろう。
Reactとプラットフォームでデバッグするべき層が二層になるのも欠点の１つだ。
React Nativeはどのように動くのか
ReactにおけるDOMへの描画の代わりに、React NativeはObjective-CやJAVAのAPIを呼び出してコンポーネントを描画する。例えばReact NativeでのViewはiOSではUIViewとなる。
React Nativeをどのように学習していくか
まず、React周辺の知識は前提として必要になる。また、公式ドキュメントが最初の導入にはやはり良いかと思う。Reactを知っている上で公式ドキュメントに目を通せば、少なくともある程度のアプリは作れるようになると感じた。
また、英語にはなるがLearning React Nativeのような書籍もある。ただし、書籍だと情報はやはり少し古い部分もあるので、新しい情報が欲しい場合はWebで情報を入手するか、あるいは内容が更新される電子書籍などが良いと思う。
あとがき
実は自分はReactより先にReact Nativeについて勉強してしまった（そして、意外と簡単なアプリならそれでも問題なく作ることができた）のですが、結局Reactについて知らないと良いアプリは作れそうにないな、と感じてReactやReduxの勉強をすることになりました。これを一歩目として、React Nativeについての知見がもっと貯まった際にはまた記事を書こうと思います。