コーディングしていてわからないことはGoogle先生にお尋ねすることになりますよね

ただ、知りたい情報に早くいきつきたいものです

そんな時に使っているChromeの拡張機能まとめました

google検索

AdBlock — 最高峰の広告ブロッカー

その名の通り、広告をブロックしてくれる拡張機能

情報に集中できるのはありがたいのですが、デメリットも

「あれ？ページ真っ白！」

「表示されないぞ？」

「なんか文字だけが表示されてる、CSS効いてない？」

こんなときはオフにしてみよう！

ちゃんと表示されないときはこの子が原因のときがよくある

（わたしは結構時間をむだにしました(。-ω-)z）

SearchPreview

google検索結果に画像でプレビューを表示してくれます

雰囲気は画像がやはり把握しやすい

AutoPagerize

たまにあるページを分割しているサイト

1 2 3 次のページ

これめんどくさいので、自動で一枚のページのように表示してくれます

Google検索結果も読み込んでくれます

サイトの設定もできて便利

コーディングお助け拡張機能

Awesome Screenshot: キャプチャーと注釈

ブラウザに表示されているページをキャプチャできる

ページ全体もできるし、選択範囲を指定できたり編集機能もある

メモにも使えるし、サイトの素材としても使えるしgood

Image Downloader

もう一つ画像関係

ページに表示されている画像を一括でダウンロードできる

サイトを模写する時にお世話になります

注意：CSSでbackground-imageのように設定している画像はとれないみたい

HTMLのimgタグの画像のみ

ColorPick Eyedropper

ブラウザの色を16進数やRGBでとることができる
これも模写でお世話になります

CSSViewer

これいれてたのにつかってなかった！忘れていた

選択したHTMLタグにどんなCSSが当たっているのか表示してくれる

ディベロッパーツールでも確認できるけど、それよりも手軽にできる

この記事書く時に、「こんなのいれてたのか！」って。書いてよかった(˘︶˘)

Page Ruler Redux

選択ツールで要素の幅をはかれます
これも模写で活躍

WhatRuns

サイトで使用しているサービスやツールをみることができます

同じブラウザで見てるのに違う技術っていっぱいあるんだなと感心した記憶が

プロジェクト始める前の参考によいです　　

まとめ

詰まることが多い独学プログラミングは必然とググる回数も増えていきます

ググる力を身につけるのはもちろん大事ですがスピードを早めることも同じくらい大事です

頑張っていきましょう！