【2020年版】Macユーザーおすすめアプリ〜Google Chrome拡張機能編〜
こんにちは、おおとろ（@digiangler）です。
人のパソコン環境に興味があり、この企画を始めました。
パソコンを使って仕事をしている方なら、どんなパソコン環境にしているのか興味があると思いますので、少しはお役に立てれば嬉しいです。
#私のパソコン環境を教えます
#私のスマホ環境を教えます
こんなハッシュタグをつくりましたので、noteを始めたけどネタに困っていて書くことに悩んでいた方は、なぜそのアプリを使っているのか❓を考えて書いてみてください。
皆さんのパソコン環境の投稿をワクワクしながらお待ちしております。
前回は、ウェブブラウザ編を書きました。
なんと7種類のウェブブラウザを使用していることを暴露しました（苦笑）
今日は、Google Chrome拡張機能について書いていきたいと思います。
StatCounter（スタットカウンター）というサイトで、リアルタイムのブラウザ内訳を確認することができますが、日本はGoogle ChromeのシェアがNo.1です。
ということで、私がどんなGoogle Chromeの拡張機能を使っているか書いてみようと思います。
テーマ
Dracula Chrome Theme - Dark and Minimal
Dracula Theme for Facebook Messenger
Dracula Theme好きだから入れています。ただそれだけです。
Google Chromeの環境だけでなく、いろんなアプリにDracula Themeを使用しています。
詳細は公式サイトをご覧ください。
Visual Studio Codeの拡張機能で、オリジナルのThemeを作成しましたので、それもいつか書きたいと思います。
追加必須の拡張機能3選
まずは、追加必須の拡張機能3選を紹介します。この3つは、毎日使っていて無くてはならない拡張機能です。
✓SimpleExtManager
拡張機能の切り替え（有効 / 無効）や削除を一括に管理できます。
使用頻度の高い拡張機能は、固定しておくと使いやすくなります。
こんな感じ。
拡張機能を入れすぎるとメモリ消費量が増加して重くなる可能性があるので、SimpleExtManagerを使って、有効・無効を切り替えつつ使うことをおすすめします。
グループ分けもできるので、整理しながらこのあと紹介する拡張機能を入れていきましょう。
バーに固定必須。
✓GoFullPage - Full Page Screen Capture
ページ全体を1枚の画像（png）またはpdfファイルにスクショできる拡張機能です。他にもたくさんの拡張機能がありますが、これ一択でいいと思います。
私の場合、リサーチやサイトのレビュー時、セールスレターや広告などをスクショするときに多用しています。
注意：あまりにも長いホームページなどは分割されてしまいます（苦笑）
バーに固定必須。
✓OneTab
メモリを95%削減できる超便利な拡張機能です。Google Chromeはタブを増やすほどメモリを消費してパソコンが重くなります。
私の場合、リサーチを頻繁にするので、調べ物ごとにグループを作成して使っています。
復元や削除も簡単で、他の人にウェブページとしてシェア（QRコードあり）したりすることもできます。
タブを開きすぎてしまう方にはとてもいい機能だと思うので、ぜひ使ってみてください。
バーに固定必須。
次に、入れておくと便利な拡張機能を紹介します。順不同になっていますので、自分なりのGoogle Chromeを完成させましょう。
バー固定必須用
✓Evernote Web Clipper
Web上のコンテンツを簡単に保存することができます。
もう知らない人はいないくらい有名な拡張機能です。
バーに固定必須。
✓Notion Web Clipper
Evernote（プレミアム）を愛用していましたが、9月からNotionに乗り換えました。使い勝手が違うので、Evernoteと併用しています。
バーに固定必須。
✓Dynalist Companion Clipper
アイディアを考えたりするときにDynalistを使っているのですが、この拡張機能はページタイトルとURLの情報を取得したり、選択したテキスト（URL、タイトル込み）の取得も可能で、自動でDynalistにクリップされていきます。
バーに固定必須。
追加必須用
✓Adblock Plus - free ad blocker
定番の広告ブロック拡張機能です。AdBlock系の拡張機能を使用する際、使用しているWebアプリに支障をきたす場合もありますので、注意する必要があります。
私はこのAdblock Plusで、広告ブロックの役目を十分果たしてくれています。
それと、Google Chromeには広告ブロック機能が備わっていて、拡張機能などをインストールしなくても、設定を変更するだけで不要な広告やポップアップなどをある程度ブロックすることもできます。
✓1Password X – パスワード保管庫
✓LastPass: Free Password Manager
定番のパスワードを管理する拡張機能です。1Password XかLastPassのどちらかでいいと思います。はじめは登録する手間がかかるかもしれないが、後々とても楽になる神アプリです。
タスク管理用
✓Asana
✓TickTick - Todo & Task List
TrelloとTodoist、Togglを使用していたのですが、6月からAsanaとJira、TickTickに変更しました。直接アプリを使用するので、拡張機能はあまり使わないですが、一応入れています。
WEB開発用
✓Web Developer
特定の機能・表示の無効化、異なるサイズのブラウザでの表示など、様々な状況を各設定のオン・オフのクリックで簡単に切り替えられるので、大幅な作業効率化を実現できます。
Web制作やテスト作業に活かせるので、Webディレクターはもちろん、WebデザイナーやWebエンジニアの方にもおすすめです。
バーに固定必須。
✓React Developer Tools
Facebook公式のReact用のデバッグツールで、コンポーネントの構造を視覚的に把握できたり、PropsやStateの値を確認できたり、実際に値を書き換えてテストやデバッグを効率的進めることができます。
バーに固定必須。
✓Redux DevTools
React Reduxを使用して開発しているときに必須のデバックツールで、Reduxの状態管理を可視化してくれます。例えば、stateの偏移やアクションの実行の履歴などを確認することができます。
バーに固定必須。
✓Vue.js devtools
Vue.jsの開発をサポートする拡張機能 で、consoleを開かなくてもdataの中身などを確認することができます。確認できる内容は、Components、Vuex、Eventsの3つです。
Vue.jsでの開発をしていないので、あまり詳しくありません。
バーに固定必須。
WEB制作用
✓HTML to Figma
トレースしたいサイトや気になったサイトのURLからHTMLを生成してくれる拡張機能です。複雑なレイアウトのサイトや画像の多いサイトは、上手く読み込めないことが多々あります。
Figma愛用者なら必須の拡張機能です。
バーに固定必須。
✓PerfectPixel by WellDoneCode (pixel perfect)
拡張機能の名前のとおり、デザインカンプとまったく同じ見た目を作ることを目的とした拡張機能です。
ピクセルパーフェクトとは、Webデザイナーがモックアップにデザインを反映させ、余白の幅や画像サイズ、文字間隔、文字サイズなど、これらの要素を1pxのズレもなく正確に実装すること。
デザインとページの大きなズレがないかしっかりと確認したいときに便利です。模写コーディングして勉強している駆け出しの方にもおすすめです。
バーに固定必須。
一応入れている拡張機能
後々、ジャンルごとにまとめ直そうと思ってます。
✓Material DevTools Theme Collection
デベロッパーツールのテーマやフォント、フォントサイズを変更することができます。
私はDraculaテーマ一択です。
✓WakaTime
日々のコーディング時間を可視化することができる拡張機能です。普段どの言語にどれくらいの時間を掛けているか、正確に把握することができますし、日々の勉強の振り返りやモチベーションアップにも繋がります。
連携できるエディタ / IDE がたくさんありますので、連携してみましょう。
✓WhatFont
Webサイトのフォントに関するすべての項目を確認することができます。確認できる項目内容は、「Family」「Style」「Weight」「Size」「Line Height」「Color」です。
Webデザイナーやフロントエンドエンジニアなら必須の拡張機能です。
バーに固定必須。
Black Menu for Google™
GoogleのWebサービスを頻繁に利用するヘビーユーザーにおすすめの拡張機能です。
バーに固定必須。
Bookolio
新しいタブを開くとGoogle Chromeに登録しているすべてのブックマークがフォルダごとに表示される拡張機能です。
壁紙も追加することもでき、ブックマークマネジャーで追加・編集して、自分が使いやすいようにカスタマイズしましょう。
数ヶ月前まで使用していましたが、さらに使いやすい「Speed Dial 2」に変更しました。
Speed Dial 2 新しいタブ
オリジナルでは、新しいタブを開くと「よくアクセスするページ」が表示されると思いますが、それを自由にカスタマイズすることができる拡張機能です。
ブックマークの整理をするついでに導入しましたが、とても使い勝手がよく、作業効率が上がりました。
私のように、ブックマークが数百以上登録されていて探すのに苦労している方にはおすすめです。
ColorZilla
Google Scholar ボタン
Google 翻訳
Grammarly for Chrome
Image Downloader
Krisp for Chrome
Video Speed Controller
Language Learning with Netflix
Language Learning with Youtube BETA
Postman Interceptor
Preact Developer Tools
SearchPreview
Stylus
Svelte Devtools
TDK Meta Checker
The QR Code Extension
UI Build Assistant
次回は、タスクアプリについて書きたいと思います。
最後まで、読んで頂きありがとうございました❗
それでは、また。
是非、感想をコメントやSNSでくださると嬉しいです。
Twitter: @digiangler
Instagram: @digi_angler
また、スキボタンを”こっそり”押したり、サポートしてくださるのも、とても嬉しいです。
"こっそり"Twitterからのリツイートでの感想もくださると嬉しいです。
よろしければサポートよろしくお願い致します。頂いたサポートはライターとしての活動費に使わせて頂きます❗m(_ _)mまた、感想のツイートやリクエスト、ぜひぜひお寄せください(*⌒▽⌒*)