「ブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれる拡張機能・「Locator.js」」のご紹介| Webデザイン参考記事まとめアプデ

2022年10月7日(金)

ブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれる拡張機能・「Locator.js」

0

9

3

8

Locator.js

Locator.jsはブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれるブラウザ拡張機能です。Chrome、Edge、Brave、Opera、Firefoxなど主要ブラウザは概ねサポートされています。

オープンソースとなっており、拡張のインストールに抵抗がある方向けにライブラリも用意されています。表題通りで、ユーザーが使用するIDEと連動し、WebサイトのUIコンポーネントをクリックするだけで該当するコードに飛んでくれる、というもの。

無駄なく問題個所まで最短でアクセスできるので開発スピードを上げられる、というのが狙いみたいですね。なかなか面白い試みだと思います。確かに慣れれば速くなるかも。下記のライブラリ紹介ページで動作テストできるのでお試しになってみては如何でしょうか。ライセンスはMITとの事です。

Locator.js

WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログかちびと.netの記事『ブラウザで任意の要素をクリックするだけでIDEを起動して該当のコードに移動してくれる拡張機能・「Locator.js」』についてまとめています。

この記事は特にChrome・Firefoxについて書かれており、気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のかちびと.netで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとかちびと.netの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。