他人のコードを読む
どんなコードベースでも理解できる体系的なやり方
⏱ 想定 ~8 分
01 · 読む
初心者の多くが驚く事実をひとつ。 プロのエンジニアはコードを書く時間よりも読む時間のほうが長いです 。
チームに入ったり、プロジェクトを切り替えたり、数週間ぶりに自分のコードに戻ったりすると、書いた覚えのない(あるいは思い出せない)コードを読み解く必要があります。やみくもにスクロールして「分かるといいな」では進みません。体系が必要です。
いいニュース?コードを読むのはスキルで、他のスキルと同じく練習すればするほど楽になります。どんなコードベースにも使える再現性のある流れを学びましょう。
💡 想像してみてください新しいコードベースを読むのは新しい街を探検するようなものです。いきなり通りを歩き回ったりはしません。まず地図( README )を見て、近くに何があるか(依存パッケージ)を確認し、幹線道路(エントリポイント)を見つけ、それから一区画ずつ探索(モジュール)します。
02 · 読む
ちょうど他人のプロジェクトを受け取ったところです —— Task API です。このコードは見たことがありません。ターミナルでコードリーディングプロトコルをひとつずつ適用していきましょう。
03 · ターミナル演習
コードリーディングプロトコル ステップ 1: README を読む 。 README はプロジェクトが何をするか、どう入れるか、どう動かすかを教えてくれます。必ず最初に読んでください。
(このセクションはインタラクティブです — JavaScript を有効にしてください。)
04 · ターミナル演習
ステップ 2: package.json を見る 。依存パッケージから使っている技術が分かり、 scripts から実行方法とテスト方法が分かります。
(このセクションはインタラクティブです — JavaScript を有効にしてください。)
05 · ターミナル演習
ステップ 3: エントリポイントを見つけて構成をスキャンする 。 package.json から app.js がエントリポイントだと分かっています。まずフォルダ構成を見て、それからメインファイルを読みましょう。
(このセクションはインタラクティブです — JavaScript を有効にしてください。)
06 · ステップ解説
コードリーディングプロトコル —— どんな新しいコードベースでもこの手順で進めましょう
1. README を読む
README.md はプロジェクトが何をするか、どう入れるか、どう動かすかを教えてくれます。必ず最初に読んでください。 README がないこと自体も情報です —— ドキュメントが弱いプロジェクトかもしれません。
2. package.json を見る
依存パッケージから使っている技術が分かり、 scripts から実行方法とテスト方法が分かります。 "dependencies" で主要ライブラリを、 "scripts" で "start" 、 "test" 、 "build" のようなコマンドを確認しましょう。
3. フォルダ構成をスキャンする
コードはどう整理されていますか? src/ 、 public/ 、 routes/ 、 models/ などを見れば、アーキテクチャのヒントになります。全部が 1 つのフォルダにあるフラットな構成は小さなプロジェクトのサイン。意味のある名前で入れ子になったフォルダは、きちんと整理されている目印です。
4. エントリポイントを見つける
ふつうは index.js 、 app.js 、または main.js —— プログラムはここから始まります。 package.json の "main" フィールドや "start" script が場所を教えてくれます。
5. import を辿る
エントリポイントから require() や import 文を辿って依存ツリーを理解します。ひとつの import が次のピースに案内してくれます。一度にすべて理解しようとしないこと —— まずはつながりをマッピングしましょう。
6. Claude に助けてもらう
Claude Code で「このプロジェクトの概要を教えて」と聞けば、すぐに高レベルのサマリーが得られます。 Claude はすべてのファイルを読んで、コードベースの地図を数秒で渡してくれます —— 手作業だと何時間もかかる作業です。
07 · 空欄補充
新しいプロジェクトを探索するとき、最初に読むファイルは _____ です。
08 · クイズ
新しいコードベースを探索するとき、 最初に 読むべきものは?
- プロジェクトの中で一番大きいファイル
- README.md ファイル
- すべての JavaScript ファイルを上から下まで
- テストファイル
⚠ 全機能のインタラクティブ体験には JavaScript が必要です。JavaScript を有効にして再読み込みしてください。
※ このサイトは独立した教育プロジェクトで、Anthropic の公式製品ではありません。Claude™ は Anthropic, PBC の商標です。