Angularコードレビュー観点100選
AngularはDIベースの構造と強力なテンプレート機構を備えるが、その抽象度ゆえに設計過剰や責務不明瞭といったトラブルも発生しやすい。構成要素の分離・DI設計・テンプレート責務・RxJS運用・状態制御など、Angular特有のレビュー観点を100項目で整理した。
この記事はAngular 15時点の旧版
以下の100項目は、NgModuleで構成を組み、constructor で依存を受け、takeUntil(this.destroy$) で購読を解除していた時期のコードを前提にしている。Angular 22 では standalone が既定になり、変更検知は OnPush が既定、HttpClient は Fetch 既定、状態保持の多くは signal が担う。前提が変わった項目はこのページでは修正せず、Angular 22 を前提に書き直した5本へ分けてある。各分冊が100項目で、合わせて500項目になる。
- Angular 22のコンポーネント設計をレビュー視点で整理する100観点 — コンポーネント、テンプレート、変更検知、DI、Signal Forms、ルーティング、a11y
- Angular 22のSignalと非同期状態をレビューする100観点 —
signal/computed/linkedSignal/effectと Resource 系 - NgRx SignalStoreの状態設計をレビューする100観点 —
@ngrx/signalsの feature 合成、entities、events、rxMethod - NgRx StoreのAction・Reducer・Effectをレビューする100観点 —
@ngrx/store/ effects / entity / router-store - Angular 22のRxJS運用と購読の寿命をレビューする100観点 — 購読の寿命、競合制御、エラー処理、
HttpClient
状態管理の個別論点(高階 Operator の中断、catchError の位置、Selector の合成、shareReplay の寿命など)はng状態管理に1論点ずつ分けて書いてある。
✅ モジュール・構成設計(01〜20)
✅ DI設計とサービス責務(21〜40)
✅ コンポーネント設計とテンプレート責務(41〜60)
✅ RxJSと非同期設計(61〜75)
✅ フォームとバリデーション(76〜85)
✅ テストとビルド設定(86〜95)
✅ Lint・CI・構文整合性(96〜100)
このチェックリストは、Angular特有のDI・テンプレート・RxJS設計に加え、保守性・疎結合・非同期制御を軸にした実践的なレビュー観点を提供します。プロジェクト初期から運用フェーズまで活用可能です。