このアイコンなんだろう
- カテゴリ:
- その他
- JavaScript
- コメント数:
- Comments: 0
◆ JavaScript ツールのアイコンがどのツールなのか探してみました
ネットで見かけたスライドで JavaScript ツールのアイコンが並んでいました

全部わかるかな っと見てみたのですが
結構難しいです
npm と babel と node.js はロゴに名前が入ってるのでかんたんです
残るは 5 つ
右下は electron ですね
いっつも react.js と electron のアイコンがどっちがどっちかわからなくてググって確認してます
上側左から 2 つめの水色と青色の六角形は webpack です
左下の青と紫の六角形は見たことあるけど出てこなくて知ってるツールを順番に見ていくと eslint でした
残りは全く見覚えがないので関係しそうと思うワードで画像検索を繰り返していたところ
右上の赤色は rollup というツールでした
webpack と一緒に明るく表示されてるページがあったので webpack 関係かなとググってみたのが当たりでした
webpack と似たものでモジュールを解析して 1 つのファイルにしてくれるツールだそうです
最後の 1 つですがこれが全然わかりません
ドキュメントみたいなのですが ドキュメント作る系のツールでこのアイコンはみつかりませんでした
もしかして テストのカバレッジとか表してるのかも とテスト系を見るもだめでした
他にもとりあえず
などのツールをググって見ていったのですが全くヒットしません
eslint と一緒に明るく表示されてるので lint 系かと思って jshint, jslint, esformatter など見てみましたが違いました
こういうアイコンを調べるのってどうすればいいんでしょう
切り取って画像検索しても関係ないのばかりですし
github のページにアイコンはないので違うかな と思いつつ公式ページに行ってみると

これだ!!
よくみたらドキュメントみたいなのの色ついてるところが P の形してます
全部わかってすごくスッキリしました

全部わかるかな っと見てみたのですが
結構難しいです
npm と babel と node.js はロゴに名前が入ってるのでかんたんです
残るは 5 つ
右下は electron ですね
いっつも react.js と electron のアイコンがどっちがどっちかわからなくてググって確認してます
上側左から 2 つめの水色と青色の六角形は webpack です
左下の青と紫の六角形は見たことあるけど出てこなくて知ってるツールを順番に見ていくと eslint でした
残りは全く見覚えがないので関係しそうと思うワードで画像検索を繰り返していたところ
右上の赤色は rollup というツールでした
webpack と一緒に明るく表示されてるページがあったので webpack 関係かなとググってみたのが当たりでした
webpack と似たものでモジュールを解析して 1 つのファイルにしてくれるツールだそうです
最後の 1 つですがこれが全然わかりません
ドキュメントみたいなのですが ドキュメント作る系のツールでこのアイコンはみつかりませんでした
もしかして テストのカバレッジとか表してるのかも とテスト系を見るもだめでした
他にもとりあえず
- tempalte engine
- hightlight
- framework
- db
- chart
- taskrunner
- canvas
などのツールをググって見ていったのですが全くヒットしません
eslint と一緒に明るく表示されてるので lint 系かと思って jshint, jslint, esformatter など見てみましたが違いました
こういうアイコンを調べるのってどうすればいいんでしょう
切り取って画像検索しても関係ないのばかりですし
追記:見つかりました!!
format してくれるものでそういえば AST ベースで一から作り直すから統一感出るとかいうツールあったなぁと思ってぐぐってみると Prettier という名前でしたgithub のページにアイコンはないので違うかな と思いつつ公式ページに行ってみると

これだ!!
よくみたらドキュメントみたいなのの色ついてるところが P の形してます
全部わかってすごくスッキリしました