■目次

re-ducksパターンの特徴と誕生まで

▼上半分は誕生までの変遷、下半分は特徴

https://www.youtube.com/watch?v=cy-mqekl1z8&list=PLX8Rsrpnn3IWavNOj3n4Vypzwb3q1RXhr&index=8

誕生までの変遷

• Ducksパターン以前

  • 各フローごとにディレクトリ（フォルダ）を作り、その中に各stateファイルを格納

  【デメリット】

  • 同じ名前のファイルが量産されるため、今はどのフローのファイルをいじっているのか混乱しやすい
  • reducersはactionsを参照するので、ディレクトリを分けずに一つにまとめた方が楽なのでは？という意見が出始める

• Ducksパターン

  • modulesディレクトリを作成し、その中に各stateファイルを格納

    各ファイル内にactionsやreducersといったフローを全て記述していた

  【デメリット】

  • 全てのフローを1ファイルに記述するため、肥大化しやすい

• re-ducksパターン

  • storeディレクトリの他に、各stateごとにディレクトリを作り、その中に役割ごとに分けたファイルを格納

re-ducksパターンのメリット

https://www.youtube.com/watch?v=cy-mqekl1z8&list=PLX8Rsrpnn3IWavNOj3n4Vypzwb3q1RXhr&index=8

各ファイルの役割

actions.js

• payload（データの塊）をreducersに渡す
• イベント駆動

index.js

• エントリポイント用（？）

operations.js

• 複雑な処理を任される
• redux-thunkで非同期処理を制御する