エディタ設定
このレッスンで学ぶこと
良いコードエディタは開発を速く、ミスを減らします。このレッスンでは、VS CodeまたはCursorのセットアップを扱います。どちらもClaude Codeとの相性が良いです。
エディタを選ぶ
VS Code — 無料、広く使われ、巨大な拡張機能エコシステム。code.visualstudio.comからダウンロード。
Cursor — AI機能が組み込まれたVS Codeフォーク。cursor.shからダウンロード。
おすすめ：初めての方はVS Codeから始めましょう。業界標準であり、ほとんどのチュートリアルがこれを前提としています。
必須の設定
ファイルではなくフォルダを開く
常にプロジェクトフォルダを開きましょう（File → Open Folder）。ファイルツリーと適切なプロジェクトコンテキストが得られます。
統合ターミナル
Ctrl+`（バッククォート）で内蔵ターミナルを開けます。ウィンドウを切り替える必要がありません。
コマンドパレット
Cmd+Shift+P（Mac）または Ctrl+Shift+P（Windows）。ほとんどの機能にアクセスする方法です。
便利な拡張機能
拡張機能パネルからインストール（ブロックアイコンをクリックするか Cmd+Shift+X）：
- Prettier — 保存時にコードを自動整形
- ESLint — JavaScript/TypeScriptのエラーチェック
- GitLens — 誰がいつ何を変更したかを表示
- Error Lens — エラーをインラインで表示
キーショートカット
これらは時間を大幅に節約します：
Cmd/Ctrl + P— ファイルをすばやく開くCmd/Ctrl + Shift + F— 全ファイルを検索Cmd/Ctrl + D— 次の出現箇所を選択Cmd/Ctrl + /— コメントをトグルAlt + 上/下— 行を上下に移動
Pro tip：設定で「Auto Save」を有効にしましょう。保存を忘れて作業を失うことがなくなります。
まとめ
- VS CodeまたはCursor — どちらも良い
- 個別のファイルではなくフォルダを開く
Cmd/Ctrl + Pでファイルナビゲーションを覚える- PrettierとESLintでコードをきれいに