発表内容

title

テストファーストで考えるReactのコンポーネント設計

summary

テストのしやすさからReactのコンポーネント設計を考えてみるフロントエンドのコンポーネント設計の難しさ

全部コンポーネント
再利用性？
詰め込みすぎる
どこに何を置くのか？

テストから考えることでコンポーネントの責務を明らかにしてみる

function test
component test
hooks test
union test

index

自己紹介

名前
写真
技術
プロジェクト
趣味

話すこと

関数とコンポーネントを分割する

純粋な値の演算とコンポーネントのレンダリングを分けるコンポーネントを純粋に保つ

stateとコンポーネントを分割する

custom hookを使いテストを書く、状態の変化を保証するコンポーネントを純粋に保つ

結合する

組み合わせなければならない状態を管理する特殊なコンポーネントを考える(container component) フロントでの動作確認とする(e2eはFlaky)

他にテストするならば

ビジュアルリグレッションテストコンポーネント単位で簡単にテスト e2eテスト結合テストでカバーできるかも？