Redux DevTools – Diff Monitor - Reduxと組み合わせる状態ビジュアル化ツール
Reactが流行っていますが、より大きなソフトウェアを開発する場合には単にReactを使うだけでなく、Fluxと言われるアーキテクチャで構築するのが推奨されています。ReduxというのもFluxの一実装です。 そんなReduxが提供する開発ツールをさらに拡張し、状態の変化を見える化してくれるのがRedux DevTools – Diff Monitorです。
Redux DevTools – Diff Monitorの使い方
Redux DevTools – Diff Monitorを実行すると以下のように右側にDiff Monitorが表示されます。
そして状態が変化すると自動的にその差分が表示されます。
JSONフォーマットで内容の確認ができます。
データの追加も同じように分かります。
ロールバックするとステータスを戻すこともできます。
Reactにとってデータの状態は肝とも言える技術です。それをビジュアル化することでRedux DevTools – Diff Monitorは開発効率が大幅に向上するのではないでしょうか。
Redux DevTools – Diff MonitorはJavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。