★TechJINイベントスペース　オープン記念LT会★ https://techjin.connpass.com/event/54483/

1. React Native
ってどうなの？

2. 自己紹介
• Ryosuke Hara
• Twitter: @Ryohlan
• anect 株式会社
• iOS/Androidアプリ、Webフロント

3. React Nativeって何？
• Facebook製のiOS, Androidを1つの
ソースで作れるフレームワーク
• 基本的にJavascriptで書く
• ReactJSスタイルのレイアウト
• 出力はネイティブのView
• ビルド待ちゼロでデバッグ
Component定義

4. React Nativeって何？
実行結果(Android)
• Facebook製のiOS, Androidを1つの
ソースで作れるフレームワーク
• 基本的にJavascriptで書く
• ReactJSスタイルのレイアウト
• 出力はネイティブのView
• ビルド待ちゼロでデバッグ

5. React Nativeって何？
ReactViewGroup(ViewGroup)
ReactTextView(TextView)
• Facebook製のiOS, Androidを1つの
ソースで作れるフレームワーク
• 基本的にJavascriptで書く
• ReactJSスタイルのレイアウト
• 出力はネイティブのView
• ビルド待ちゼロでデバッグ
実行結果(Android)

6. React Nativeって何？

7. 実績

8. 実績

9. 周辺の動き
• react-native-windows
• MS製
• Windows 10, Windows 10 Mobile, XboxOne（UMP)

10. 周辺の動き
• ReactXP
• MS製
• ReactNativeベース
• Web, iOS, Android, Windows
• TypeScript

11. 実際どうなの？
• Webエンジニア向け？
• ネイティブコード結構書く？
• 不自然な見た目にならない？
• それぞれに最適化できる？
• ライブラリ足りてる？
• 使ってみて困ったことか

12. Q.Webエンジニア向け？
• A. そんなことはない。
• 導入は楽かも
• Javascript, ReactJSの知識は必要
• 凝ったことをしたいならネイティブ

13. Q.ネイティブコード結構書く？
• A. 書かなくても全然いける。
• 公式APIとライブラリで対応
• 無いなら実装

14. Q.不自然な見た目にならない？
• A. 出力はネイティブのViewなのでならない
• ネイティブ独自のスタイルは適用される
• SDKのバージョンによる差異も出る
• 各々の癖もある
Android iOS

15. Q.それぞれに最適化できる？
• A. できる。
• ファイル
• Hello.ios.js, Hello.android.js
• NativeModules.HelloFunc
• 処理
• fontSize: Platform.select({ ios: 12, android: 14 })
• 片方のみ有効なプロパティ

16. Q.ライブラリ足りてる？
• A. 全然足りてないけど、CocoaPodsやGradleを使える
• CocoaPodsやGradleも使える
• JSのライブラリも使えるものもある

17. Q.使ってみて困ったことか
• まだベータ版
• 圧倒的Document不足
• 諦めてソース読もう（日本語の記事なんて無きに等しい）
• 圧倒的Component不足
• 作ろう
• Breaking Change
• 諦めよう
• 残酷なDeprecated
• 公式ブログ読んどこう

18. ありがとうございました