【保存版】2020年現役で使い続けたアプリ達まとめ


タイトルの通り、自分が2020年の現在までよく使っているChromeのアドオンやアプリ、オンラインサービスを紹介します。
駆け出しのエンジニアさんやバリバリ前線で活躍するエンジニアさんに、一つでも多く、良いアプリやサービスに巡り合って貰えれば幸いです。

リモート

Chrome リモートデスクトップ
同じGmailアカウントでログインしているPCをリモートで操作できる。Windowsも可能。
IP制限のかかったサーバーにアクセスしないといけない時などに活用。

ビデオ会議

ビデオ会議の定番。
クライアントによって使うサービスやアプリが異なるため、最低でも下記の3つは接続や動作確認をしっかりしましょう。
画面共有の仕方は周知しておいたほうが良いです。

Zoom

teams

Google Meet

チャットツール

Slack
メモを共有できるポスト機能が便利です。
slackでポストを使う
是非使いましょう。
後はサイドバーに全未読表示を設定しておくと忙しい方は便利です。
よく使うショートカットは下記

shift+command+9・・・引用
shift+command+C・・・コード
テキスト選択してcommand+B・・・太字
shift+option+command+C ・・・コードブロック
shift+command+X・・・打ち消し線
shift+command+U・・・リンク追加
shift+command+7・・・順序付きリスト

Chrome 便利アドオン

WEB Vitals
GoogleのUX指標「Core Web Vitals(コアウェブバイタル)」を簡易に確認するアドオン。

Check My Links
リンク切れが無いか自動チェック

HTML差分(diff)チェックツール
今開いているページと、外のタブで開いているページの差分を見ることができる。

HTML5 Outliner
HTMLのアウトラインをチェック

ResponsiveViewer
複数のスクリーンサイズを確認

The QR Code Extension
QRコード画面が開く

Pesticide for Chrome
要素のアウトラインを表示してくれる。CSSのレイアウトの崩れを見つける時に役立つ

Alt & Meta viewer
カーソルを当てるとAltが表示。

PerfectPixel by WellDoneCode (pixel perfect)
デザインカンプをブラウザ上で透過させて合わせる。

WhatFont
HATFONT サイトの要素ごとに使われているフォントを見やすく表示するアドオン

Tag Assistant (by Google)
Google アナリティクスのタグの動作確認や、サイトにどのようなタグが使われているのかを確認する

Web Developer
HTMLチェッカーはよく使う。

headingsMap
SettingからHTML5 Outline treeをActivatedにするとツリーマップも表示される。

ColorZilla
「Pick Color From Page」でページ内の色を選択。コピーのフォーマットはoptionで設定可能。

Dimensions
ブラウザ上で要素間の幅などを視覚化できるアドオン

ezLinkPreview
リンク先をホバーしただけで表示するウィンドウを並べる

Vimium
ほぼマウスを使わずにブラウザ操作をできるようになる

Google検索キーボードショートカット
検索窓へ飛ぶショートカットが便利。Google検索結果画面が表示されると1番上の記事に▶︎マークが表示される。↑↓で移動

Localhost OGP チェッカー
【注意】未使用のため安全面は分かりかねます。localhost や Basic 認証下などインターネットからリーチできない環境の HTML ファイルの OGP タグの動作確認を行うためのブラウザ拡張です。

JSONView
JSON をブラウザで見やすくします。

テキストエンコーディング
右クリックのコンテキストメニューからエンコードを選択。

Awesome Screenshot: キャプチャーと注釈
画面キャプチャ、スクリーンレコーダー

META SEO inspector
SEOに対してアラート表示。独自領域なのですべてが正しいわけではない。

HTMLエラーチェッカー
タグの閉じミスなど簡単なエラーチェックに

Google Analytics オプトアウト アドオン (by Google)
Googleアナリティクスで自分を計測させたくないときに

Google Analytics Debugger
Google Analitycsの確認用。

LiveMd
ブラウザ上でMarkdownを使用したメモが、ライブプレビューをしながら手早くとれます。

便利アプリ

画像最適化・リサイズ

iMageTools
画像を一括でリサイズ。

ImageOptim
画像最適化。

動画キャプチャ

Gyaozo Gif
無料版だと最長7秒の動画キャプチャを送れる。動画キャプチャをURLで送れる。

LICEcap
デスクトップをキャプチャーしてアニメーションGIFとして保存

Mac純正動画キャプチャ
shift + command+ 5 で動画をキャプチャ。
音声の有無も可能。容量が大きくなりがち。

iPhone純正動画キャプチャ

スクリーンショット

MAC純正 control + command + shift + 4

クリップボードに画像をコピー
Mac純正 command + shift + 4

データ圧縮

ZIPANG
ZIP圧縮

コピペ、スニペット登録

Clipy
コピー&ペーストの拡張やスニペットの登録に

Gitクライアントソフト

Source Tree
無料のGUI Gitクライアントソフト。

FTPクライアントソフト

FileZilla
無料のFTPクライアントソフト。踏み台サーバの設定等、
小難しい設定が必要なければFileZillaで事足ります。

画面共有

ApowerMirror
iOS、アンドロイド対応の画面ミラーリングアプリ。
Zoomなどを繋ぎながらスマホの画面共有をしたい時に便利。

RSS

Feedly
通勤時間に気になるサイトを確認する用に。

仮想サーバ

MAMP

Local
簡単にWordPressサイトをローカル環境に構築できる。

Docker
https://qiita.com/heeroo_ymsw/items/82a6578aa2c150522987

サイトデータの吸い上げ

SiteSucker
URLを入力してサイト一括ダウンロード。(一昔前は無料でした)

オンラインサービス

翻訳したい時

Codic
プラグラミングを日本語から英語に翻訳したい時に。
各テキストエディター(VScodeやSublime等)のAPIあり。
「プログラムを走らせる → run_program」

英語の発音がわからない時

weblio
発音わからない時用。
わからない単語の読み方があればこちらも是非。↓
https://qiita.com/s-kato/items/17bfa45ab0b6df5cea2b

その他

視力回復
視力が落ちてきているあなたに。

kingBox
動画保存/画像保存のファイル管理アプリ。
自分が集中できる曲をダウンロードしてプレイリストを登録。
自分はクラシックやジャズをプレイリストに登録してます。

TimeTree
お互いの仕事予定を共有。
仕事とプライベートのカテゴリも分けられて共有できる。
自分は家族と使ってます。

最後に

以上です。
便利な世の中になりました。
開発していただいているエンジニアさん達に感謝です。

茂吉でした。