developer tool
PC向けのブラウザに標準で備わっている便利なツール
Chromium系列のブラウザ(Chromeとか)だと
F12 か Ctrl+Shift+i で開ける実はWindows版のDiscordでもCtrl+Shift+iを押すと開ける
最近は日本語に対応している
すごく多機能でこれがないと生きていけないレベル
こんな時に使える
Chromium系列のブラウザでは「要素」タブから見れる
JavaScriptによって変更されたものも反映されている
直接編集して書き換えることもできる
公開projectに書いた課題に名前を入れてPDFにする時に使った
serverに反映させることなく名前を入れられる
コピペ出来ないサイトのテキストやダウンロード禁止になっているデータを取り出すときにもよく使う
要素に適用されているプロパティの確認
CSSセレクタの詳細度による順位の確認
CSSの計算結果の確認
CSSのテスト
自分でプロパティを追加したり既存のプロパティを編集したりできる
JavaScriptコンソールを使う
適当なスクリプトを実行するのに使える
処理を一時停止、ステップ実行する
通信の監視
Chromium系列のブラウザでは「ネットワーク」タブから見れる
場合によってはページの再読み込みが必要
サーバー・ブラウザ間の通信を覗き見れる
当たり前だけど暗号化されたものもちゃんと見れる
セッションIDを抜き取るのによく使う
cookieの中身を直接見たほうが早い
ローカルストレージやcookieの中身を確認
Chromium系列のブラウザでは「アプリケーション」タブの「ストレージ」から見れる
パフォーマンスの測定
メモリとかの使用状況を記録できる