【React】なぜReduxを使うのか - ITエンジニア日記～NO SKILL, NO LIFE～

Reactでよく一緒に使われるらしい「Resux」というフレームワークについて、今日勉強してきたころをまとめます。

stateを管理するフレームワークのこと。
React以外にも、Angularなど他のJavaScriptライブラリとも一緒に使うことができるらしいです。

Reactはコンポーネント間でデータを受け渡しをするときに、Propsを介して受け渡します。
Reactの特徴に「Data Flow」といって、データを単方向にデータバインディングするというものがあります。

例えば、コンポーネントGを表示するのに、コンポーネントAが持っているデータが必要な場合、下図のように間のコンポーネントBとEを通ってデータを渡していかないといけません。

このように、コンポーネントのネストが深くなったり横に広がるほど、データの受け渡し回数が増えて大変です。

そこで、Redux を使うとすべてのデータを Store というもので1箇所で管理できるようになります。

先ほどの例だと、どのコンポーネントも必要なデータはStoreから必要なデータを受け渡しできるようになり、素のReactのように欲しいデータをどのコンポーネントから流してこないといけのかを考えなくてよくなります。

とりあえず、今日理解したReduxを使うと何がいいのかまで書いてみました。
これから詳細なところまで手を動かしながら勉強していこうと思います。