最近のフロントエンド界隈でのトレンドはVirtualDOMです。これまで苦労してきたDOMのステータス変更を気にすることなく、サーバサイドのようにレンダリングできるようになる技術です。しかし、その結果として通常のJavaScriptよりもデバッグしづらくなっています。 そこで使ってみて欲しいのがKukerです。各種VirtualDOMライブラリに対応したデバッグツールです。

Kukerの使い方

KukerはGoogle Chrome機能拡張としてインストールします。React/Angular/Vueなど各種ライブラリに対応しています。

表示が変化した時にはKuker側のコンポーネントも変化します。

データの内容を見ることもできます。

propsやstateも追えるのでデバッグしやすくなるでしょう。

KukerはReact/Angular/Vueの他、関連するVueX、Redux、redux-saga、Stent、Machina.js、MobXなどと組み合わせて使うことができます。イベントがモニタリングでき、変数の変化が追えるようになることで、開発効率が向上することでしょう。フロントエンド開発時にインストールしておきたい機能拡張です。

KukerはGoogle Chrome機能拡張のオープンソース・ソフトウェア（MIT License）です。

Kuker - Chrome ウェブストア krasimir/kuker: Kick-ass browser extension to debug your apps