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 |