UIT INSIDE

LINE UIT室の開発者による「最新のフロントエンド」をキャッチアップできる Podcast

  • 0. オープニング
    00:00
  • 1. キャスト自己紹介
    00:39
  • 2. React Hooks 改めて概要
    03:22
  • 3. Hooks の利点
    06:08
  • 4. Hooksをどのような場面で使っていくか
    09:28
  • 5. 周辺ライブラリの対応状況
    14:36
  • クロージング
    18:40

ep.4 改めて React Hooks

2019/03/07
436 views
HANATANI TakumaKawasaki Kohei

キャスト紹介

  • @potato4d
  • @kawasako3
    • LINE は2015年入社
      • LINE@ > LINE NEWS > ?
    • 前職ではマークアップエンジニア

改めて React Hooks API とは

  • モチベーション
    • Function Component にロジックを追加したい
    • 公式には手段が提供されていなかった
    • よく使われていた renderProps, HOC どちらもコンポーネントツリーを汚染する問題がある
  • Hooks は React が公式に提供する Function Component の拡張手段
  • 2月に v0.16.8 で Hooks が出てから現在 v1.6.3

優位性とか

  • extend や mixin との違い
  • 学習曲線と分業
  • 実用
    • form 作るのがしんどい問題
    • 複雑なイベントハンドリングの抽象化

hooksを取り巻く環境

  • ライブラリとして renderProps HOC 両方提供しているものはよくある Formikなど
  • hooks の提供も検討されているがまだ unstable だったりする
    • 自分で書くのは簡単なので やってみるのもいいかも
  • 今後は hooks ベースで書いて HOC と renderProps も提供するみたいな世界観になりそう