1. Reduxとは・Fluxフロー

React

Reduxを使う理由

どこからでもstateの状態を参照/変更可能にするためです

Reduxを使わない場合、useStateであるstateが孫Componentで変更されたとします

変更内容は孫→子→親→別の子Componentとバケツリレーで他のComponentに伝わります

そのため別の子Componentでstateを書き換えたいと思った場合、離れた場所のComponentを操作しないといけません

ReduxではReactのComponentツリーとは別にstoreという場所でstateの状態を一括管理します

stateの状態を参照したり変更したくなったら、storeの内容を参照したり変更するだけで済みます

Fluxフロー

Component … 宝石

Container … 宝石ショップ

Action … 店員(ユーザーの要求(購入ボタンのクリック)をバックに伝える人)

Reducer … storeの在庫管理する人

Store … stateの在庫を管理する場所

map … storeの在庫変更をContainerに伝える役割

BACK