はじめてのCTF|ハッカー体験しながら学ぶ20話
ブラウザの開発者ツールから、暗号・OSINT・デジタルフォレンジックまで。CTF(Capture The Flag)の基礎を、5分で1テクニックずつ、すべて手を動かして体験できる全20話の連載です。このページが全話の目次・進捗トラッカーです。
各話のチャレンジに正解すると、ブラウザのlocalStorageに記録され、このページを開くたびに自動集計されます(サーバーには送信されません)。
📖 この連載について
サイバーセキュリティの世界に興味を持っても、「何から始めればいいのか分からない」という人は少なくありません。書籍や講座で用語を覚えるだけでは、実際に手を動かす感覚はなかなか身につきません。CTF(Capture The Flag)は、許可された環境で安全に「攻撃側の視点」を体験できる、世界中で行われている合法的な競技です。とはいえ「興味はあるけど、何から触ればいいか分からない」という人がほとんどではないでしょうか。この連載は、そんな第一歩のために作りました。
各話は5,000字程度の解説+5分で挑戦できるミニチャレンジという構成で統一されています。チャレンジはすべてこのページ・各記事の中だけで完結する自作のシミュレーターで、実在のサイトやサービスを対象にしたものは一切ありません。Cookie書き換え、HTML編集、暗号解読、OSINT、ファイルの偽装発見、画像の中の隠しデータ、ログ解析、パケット解析……ブラウザだけで20種類のテクニックを実際に手を動かして体験できます。
各話のフラグ判定はSHA-256のハッシュ比較で行われ、正解の平文をページのソースに直接書かない設計にしています(ただし本格的な秘匿ではなく、あくまで学習用の軽い仕掛けです)。進捗はlocalStorageのみに保存され、外部に送信されることはありません。
対象読者:セキュリティ初心者・学生・エンジニア転職を考えている方・「CTFという言葉は知っているけど手を出せていない」という方を想定しています。逆に、すでにCTF競技の経験がある方には、各話の解説部分は復習として、フォレンジック編やOSINT編は知識の補強として活用いただけます。
🧩 この連載の設計思想
この連載には、3つの工夫があります。
①ブラウザだけで完結。専用の仮想環境やソフトウェアのインストールは不要です。F12キーで開く「開発者ツール」さえあれば、すべてのチャレンジに挑戦できます。環境構築でつまずいて挫折する、という入門の最大の壁を取り除きました。
②5分で1テクニック。1話につき学ぶ技術を1つに絞り、5,000字程度の解説と5分程度で挑戦できるミニチャレンジで完結する設計にしました。通勤・通学の合間や、休憩時間にも1話ずつ気軽に進められます。
③自作のダミー環境のみ。すべてのチャレンジは学習用に自作したシミュレーターで、実在のサイト・企業・個人を対象にしたものは一切ありません。安心して全力で「攻撃側」を体験できます。
各話のフラグ判定にSHA-256のハッシュ比較を使っているのも、この設計思想の延長です。正解の文字列をページのソースに平文で書かないことで、「うっかり見えてしまう」事故を防ぎつつ、技術的には第12話で解説する「ハッシュは元に戻せない」という性質をシリーズ全体で実践しています。進捗(クリア状況)はブラウザのlocalStorageだけに保存され、サーバーには一切送信されません。
🔎 テクニック早見表
「あの操作、どの話だったかな?」というときの逆引き表です。技術名から該当話を探せます。
| テクニック | 該当話 |
|---|---|
| Cookieの読み取り・書き換え | 第4話・第7話 |
| HTML/DOMの書き換え | 第5話 |
| Network通信の監視 | 第6話 |
| ソースコードの解析 | 第8話 |
| ブレークポイント・デバッガー | 第9話 |
| Base64・URLエンコード | 第10話 |
| 古典暗号(シーザー・XOR) | 第11話 |
| ハッシュ・パスワードクラック | 第12話 |
| 検索演算子(Google Dork) | 第13話 |
| SNS・プロフィールの相関分析 | 第14話 |
| マジックバイト・ファイル偽装 | 第15話 |
| ステガノグラフィー(LSB法) | 第16話 |
| アクセスログの解析 | 第17話 |
| パケットのカプセル化構造 | 第18話 |
| Wireshark・TCPストリーム再構築 | 第19話 |
💼 この連載で学べること
各話で身につく技術は、実際のセキュリティ関連職でもそのまま活かせるものばかりです。
| 身につく技術 | 実務での活用例 |
|---|---|
| ブラウザ開発者ツール全般 | Webアプリの動作確認・簡易デバッグ |
| エンコード・古典暗号の解読 | CTF・マルウェア解析での文字列復元 |
| ハッシュとパスワードの仕組み | 認証システムの設計・セキュリティレビュー |
| OSINT(公開情報調査) | 脆弱性診断の事前調査・脅威インテリジェンス |
| デジタルフォレンジック | インシデント対応(DFIR)・内部不正調査 |
| パケット解析 | ネットワーク監視・通信トラブルシューティング |
🗺️ 全20話の目次
下のカードをクリックすると各話が開きます(新しいタブ)。クリアした話には自動で「クリア済み」バッジが付きます。
イントロ編
CTFの世界に入る前に知っておきたい基礎知識。CTFとは何か、必要な道具、フラグと採点の仕組みをやさしく解説します。
0/3話クリアWeb開発者ツール編
Application・Elements・Network・Sources・Debuggerタブを使い、Cookie操作・HTML書き換え・通信監視・ソース解析・実行時デバッグを一通り体験します。
0/6話クリア暗号編
Base64・古典暗号・ハッシュとパスワード。エンコードと暗号の基礎を学び、「逆算できるか」を見極める視点を身につけます。
0/3話クリアOSINT編
検索演算子とSNS相関分析で公開情報を調査する技術を体験。複数の手がかりをつなぎ、裏付けを取ってから結論を出す考え方を学びます。
0/2話クリアフォレンジック編
ファイル・ステガノグラフィー・ログ・パケット解析。「データは本当に消えているか」を疑い続ける、デジタルフォレンジックの基礎技術を体験します。
0/5話クリア最終回
全技術を結集した卒業チャレンジ。新しい技術は教えず、これまで学んだ技術を3ステージでつなぐ総合問題です。
0/1話クリア🧭 おすすめの進め方
🔰 順番に学ぶ
①から⑳まで順番に。各編は前の話の知識を前提にしているため、初めての方はこのルートが最も理解しやすいです。Web開発者ツール編で操作に慣れ、暗号編で「逆算する」発想を身につけ、OSINT・フォレンジック編で調査の視点を広げ、最終回ですべてをつなぎます。
🎯 気になる編から
「暗号に興味がある」「OSINTを試したい」など、目的がある方は該当の編から読んでもおおむね独立して理解できます。ただし第1〜3話(CTFとは何か・道具・flagの仕組み)だけは、どの編から始める場合でも先に読むのがおすすめです。
📖 辞書として使う
「Cookieの書き換え方を忘れた」「Base64のデコード方法は?」など、後から該当話だけを読み返すリファレンスとしても使えます。各話は独立したページなので、ブックマークしておくと便利です。
❓ よくある質問
Q. プログラミングの知識がなくても読めますか?
はい。すべての話はプログラミング未経験を前提に書かれています。JavaScriptのコードはConsoleにコピー&ペーストするだけで実行できる形で提供しており、コードを「書く」必要はほとんどありません。
Q. スマートフォンでも読めますか?
記事自体はスマホでも読めますが、チャレンジの多くはPCの開発者ツール(F12キー)を使うため、実際に手を動かす部分はPC(できればChromeかFirefox)での実施を推奨します。
Q. 全部終えたら、次に何をすればいいですか?
第20話の最後に、picoCTF・TryHackMe・OverTheWire・CTFtimeといった実在の学習プラットフォームを紹介しています。このシリーズで身につけた基礎を土台に、ぜひ本物のCTF問題にも挑戦してみてください。
Q. 進捗データはどこに保存されますか?
すべてブラウザのlocalStorage内(キー名ctf20_progress)に保存されます。サーバーには一切送信されません。ブラウザやデバイスを変えると進捗は引き継がれない点に注意してください。
Q. ここで学んだ技術を実際のWebサイトに対して使ってもいいですか?
いいえ。このシリーズで紹介する技術は、すべて学習目的の自作サンプルを対象にしたものです。許可されていない実在のサイトやサービスに対して同じ手法を使うと、不正アクセス禁止法等に違反する可能性があります。学んだ知識は、CTF・自分の資産・許可された環境の中でのみ使ってください。
Q. すでにCTFの経験がある人にも役立ちますか?
このシリーズは未経験者を主な対象にしているため、経験者には基礎の再確認・抜けている分野の補強という位置づけになります。特にOSINT編・フォレンジック編は、Web系の問題しか解いてこなかった方の視野を広げるのに向いています。
Q. 各話のチャレンジで答えが分からないときはどうすればいいですか?
各話のチャレンジには2段階のヒントボタンを用意しています。それでも分からない場合は、本文の解説部分に手順がすべて書かれているので、読み返してみてください。CTFでは「分からなければ手がかりを読み返す」のも立派な攻略法のひとつです。


コメント