Why not React Native
- Pramendra Gupta(mercari)
- https://speakerdeck.com/pramendra/why-not-react-native-jp
メルカリ
- メルカリはReactNativeを使ってるらしい
- mayakai
- https://github.com/nparashuram/maya-kai
- 複数の端末が連動してページ遷移が連動する
- QA対応で使っている
Our choice in ReactNative
- joe_re(freee)
- https://speakerdeck.com/joere/our-choice-in-reactnative
交通費生産のAndroidアプリを作った話
- suicaタッチしてその情報(NFCタグ)を読取る
- Reactだけどnativeの知識は必要
- AndroidSDKでNFC読み込み
- Nativeコンポーネント使うとこはJavaも書いてる
- それをReactから呼び出す
- NativeModule.xxxxxxxって呼ぶ
- NativeアプリとReduxStateの相性がいい
- HOC
- Crashlytics
- モバイルはwebよりユーザの状態によって予期せぬエラーが起きる
- AsyncStorage
- rails consoleみたいなものがほしくて作った
- https://github.com/joe-re/async-storage-repl
async/await 構文を使った Android とのブリッジ
- nullpoo(メルカリ)
- http://qiita.com/nullpoo/items/83e47281353b92d2b675
Androidのインテントを使って、処理結果を受け取りたい
- インテント
- カメラの起動とか写真を選んだりとか
React Native でブリッジするには
- Android側でJS側に公開するメソッドを作成
- @ReactNative
- JS側で呼び出し
- NativeModulesで呼べる
async / await を使ってstartActivityForResultの結果を受け取る
- JSでpromiseを入れてJavaに返せる
まとめ
- Callbackを渡す方法やAndroid→JSのブリッジを作って結果を渡す方法もある
- しかしPromiseをasync/awaitでハンドリングするほうがスマートに書ける
- 同期処理でない処理を行うブリッジはPromiseで統一したほうが引数もすっきりして良さそう
Animated入門
種類
- animated
- 複雑アニメーション
- LayoutAnimated
- 簡単なアニメーション
アニメーションの流れ
ReactNativeでアニメーションできるview
- AnimatedXXXというのが4種類ある
いろんなアニメーション
- interpolate()
react-navigation について
- hotchpotch(WAmazing CTO)
navigationライブラリ必要？
- アプリが大きくなると・・・
navigationで必要なこと
- タブとかスタックとか
- スタック -> headerのやつ
- 何を表示するか
- Router + state管理
- deeplinkからの復元
何を使うか
- 自分で作る?ライブラリ使う?
- pureJS?
- jsだけで完結
- react-native-navigation
- native-navigation
- react-navigation
- pureJSベース
- 標準
- よくあるパターンは揃ってる
- サンプルもある
- Redux,Mobxだとstateのツリー構造を理解しないといけない
- MobXの方が非同期とかやり方が決まっててやりやすい
- Reduxはいろいろあってどうやるか悩んじゃう
ReactNativeで8個アプリを作って、1個リリースして、使ったおすすめツールを紹介
使っておくべきツール/機能
- Hot Reload
- Debugger
- cmd + D
- JS debugger?を選ぶ
- ReactNativeDebugger
- Firebase
- push通知で便利
- どこまで通知届いたかとか分からない
- CodePush
- Storeの審査なしでバージョンアップできる
- JSだからできちゃう
- Bugsnag
- エラー検知
- ReactNativeRouterFlux
- どれがいいかはやはり悩みどころ
- Atom
- Nuclide,Deco
- eslint
- eslint-config-airbnb
- Redux
- Expo
- サンプルアプリ公開ツール
- http://expo.io/
- fastlane
- pem PUSHの証明をコマンドで作る
Web開発者がReact Nativeで開発から運用までして辛かった事
- DotEarl(togetter)
- https://speakerdeck.com/rskull/webkai-fa-zhe-ga-react-nativede-kai-fa-karaben-fan-yun-yong-madesitexin-katutashi
togetter
- ReactNativeで作り直してリリース
VUP
- 公式のやり方でやってもコンフリクトしまくる
- react-native-git-upgrade
- こまめに上げないいとつらい
- ビルドが通らなくなってつらい
- ライブラリが対応してなかったりとかつらい
