- React会 #1に参加してきました。
- React Hooksで盛り上がってる中でのReactのイベントということで、最新情報をキャッチアップできる勉強会でした。
- React会は今後React meetupと合流するということで、Reactコミュニティの盛り上がりにも期待してます。
タイトル | 登壇者 |
---|---|
typescript-fsaに頼らないReact/Redux | camcam_lemonさん |
Recomposeとは何だったのか、またはHooksが開けたパンドラの箱についての考察 | 大岡由佳@oukayukaさん |
ReactNative(Expo) + Firebaseを使って爆速でアプリを作る | はがさん |
React Hooksで遊ぼう | yamatatsuさん |
Context APIを使ったライブラリを作った | dai_shiさん |
typescript-fsaに頼らないReact/Redux
- camcam_lemonさん
Component
Stateful Component
- interfaceかtypeでprops/stateを宣言
Stateless Functional Component
React.SFC<P>
で型付ける
Container
- maoStateToProps
- mapDispatchToProps
- reduxのDispatchで型つける
Action
- actionのtypeプロパティに
as typeof xxx
- typeをただの文字列じゃなくて型として扱える
Reducer
- Conditional typeのReturnTypeを使ってActionを型定義
- switch文で該当するものがなければdefaultでnever型で拾う
- 受け取るActionが一つの時はnever使えない
- if使う
まとめ
- tsの機能だけでいい感じに型をつけることができる
- ActiontReducerのテンプレを崩さずに書けるのがいい
Recomposeとは何だったのか、またはHooksが開けたパンドラの箱についての考察
- 大岡由佳@oukayukaさん
技術書店で本出した
- Reactの本
- RecomposeとHOCの話も書いてた
- その数日後ReactConfでReact Hooks発表
- Recoposeは開発終了今後はReact Hooksでとのアナウンス
- 嘆いてたらDan先生からDMが来た
Recomposeとは
なぜRecomposeは開発をとめるのか
- Recomposeの作者がfacebookにジョインしてHooksを作った
- withStateとuseStateがそっくり
これからどうなるか
- ReactHooks反響大きすぎて後戻りすることはない
- HOC, Render Propsもフェードアウトしていくのではないか
- classコンポーネントもそのうち非推奨になりそう
- Reduxがなくなることはないのでは
- connectがuseReduxのようなインターフェースになるのでは
ReactNative(Expo) + Firebaseを使って爆速でアプリを作る
- はがさん(FACTBASE)
サンプルアプリ
Expo
- ReactNative開発をWeb開発に近づけるプラットフォーム兼ライブラリ
- アプリのビルドをせずとも実機で動作確認できる
ReactNativeのライブラリ
- ReactNavigation
- ナビゲーションライブラリ
- NativeBase
- UIライブラリ
- react-native-swiper
- 画像のスワイプ簡単に作れる
- react-native-gifted-chat
- チャット風UIを簡単に作れる
まとめ
- OSSを活用すると爆速で作れる
- Expo使うことでビルドで実機とPCを繋がなくてよかった
React Hooksで遊ぼう
- yamatatsuさん
React Hooks
- 三行で言うと
- Functional Componentで状態を持てる
- Functional Componentでupdate系のイベントを扱える
- Consumer無しでContextを使える とかとか
useState
- Functional Componentでstate持てる
useReducer
- reducerっぽく使えるuseState
useCallback
- memoKeyが変わらない限り一回しか実行されない
- 一回だけ走って欲しいやつに使う
useMemo
- useCallbackに似てる
- 関数の戻り値をくれる
uesRef
- createRef的な
DidMount
- Dan先生曰くSuspenceを待たれよとのこと
Context APIを使ったライブラリを作った
- dai_shiさん
ContextAPI
- React16.3ではいった
- Reduxの代替になるのではと噂に
- コンポーネントツリーの階層をジャンプして値を渡すことができる
- Providerで値を渡してConsumerで値を受け取る
- State管理できるわけではない
- npm化した
React Hooks
- React Hooksで世界が変わる
- classでしかできなかったことがなくなる
- hooks版も作った