Redux Style Guideのメモ

What's Redux Style Guide ?

Reduxを用いたアプリケーションのコードを書くにあたって公式が推奨する設計パターンや開発のベストプラクティス、アプローチの提案など。

ここでは優先度Aの全ルールと優先度B及び優先度Cの中から抜粋したルールを記載する。

原文:
redux.js.org


優先度の判断基準
優先度A:必須
優先度B:強く推奨
優先度C:推奨


必須のルール

ルール 優先度
stateを直接書き換えない A
reducerに副作用を持たせない A
シリアライズできない値をstateやactionに入れない A
storeは1アプリに対して一つだけ A


Actionに関するルール

ルール 優先度
actionをsetterではなくイベントとしてモデリングする B
actionの名前は意味を的確に表現したものにする B
actionタイプ名を「ドメインモデル/イベント種別」のフォーマットで書く」 C
actionをFSAに準拠させる C
dispatchするactionは直に書かずaction creatorを使って生成する C


ツールやデザインパターンの使用に関するルール

ルール 優先度
Reduxのロジックを書くときはRedux Toolkitを使う B
イミュータブルな状態の更新にはImmerを使う B
デバッグには Redux DevTool拡張を使う B
ファイル構造には「Feature Folder」またはDucksパターンを使う B


その他設計に関するルール

ルール 優先度
どの状態をどこに持たせるかは柔軟に考える B
フォームの状態をReduxに入れない C
複雑なロジックはコンポーネントの外に追い出す C
非同期処理にはRedux Thunkを使う C