こんにちは!日々のコーディング、本当にお疲れ様です。
突然ですが、皆さん、AIエディタを使っていてこんなモヤモヤを感じたことはありませんか?
「なんとなく質問したら、全然見当違いなコードが返ってきた……」
「プロジェクト全体の文脈を理解してほしいのに、一部のファイルだけ見て勝手に解釈されてしまった……」
AIのコーディング支援は今や私たちの開発スタイルを劇的に変えましたが、「AIにどう情報を渡すか(コンテキスト管理)」を制することが、AIエディタを使いこなすための最大の分かれ道です。
今回は、AI特化型エディタとして爆発的な人気を誇る「Cursor」の心臓部、`@Files` と `@Folders` を駆使した高精度なコンテキスト管理術を、シニアエンジニアの視点から優しく、そして深く紐解いていきます。
これをマスターすれば、あなたの毎日のコーディングは驚くほどスムーズになり、「AIにイライラさせられる時間」がゼロになりますよ。それでは、一緒に見ていきましょう!
—
1. なぜCursorの「Context Management」が神なのか?(基礎理解)
これまでの一般的なAIチャット(ブラウザ版ChatGPTなど)では、コードを修正してほしいとき、こんな面倒な手順を踏んでいませんでしたか?
1. エディタからコードをコピーする。
2. ブラウザのチャット欄に貼り付ける。
3. 「このコードをこう直して」と指示する。
4. 返ってきたコードをコピーして、エディタに戻して貼り付ける。
……面倒ですよね。それに、プロジェクト全体の構造や、他のファイルで定義されている型(TypeScriptのインターフェースなど)の情報がAIに伝わっていないため、動かないコードが返ってくることが多々ありました。
Cursorの本質:エディタ自体がAIの「脳内」と直結している
Cursorは、VS Codeの使い心地をそのまま引き継ぎつつ、エディタの全ファイルシステムをAIが直接参照できるように設計されています。
ここで重要になるのが、チャット欄で入力する`@`(アットマーク)によるコンテキストのスコープ指定です。
AIに対して「このファイルだけを見て」「このフォルダ全体を把握して」と明示的に指示(メンション)することで、AIの「注意力(Attention)」を必要な場所に集中させることができます。人間のエンジニアに仕事を頼むとき、「この設計書だけ読んで」と渡すのと同じ原理ですね。
—
2. インストールと、最初にやっておくべき「超重要」セットアップ
まだCursorを触ったことがない方、あるいは入れたけど初期設定のままという方のために、最高効率で使い始めるためのステップをご紹介します。
Step 1: インストール
公式ホームページ([cursor.com](https://www.cursor.com/))からインストーラーをダウンロードし、画面に従ってインストールします。VS Codeを使っている方なら、拡張機能やキーボードショートカットをそのままインポートできるので、3分で移行完了します。
Step 2: VS Codeからの設定・拡張機能の引き継ぎ
初回起動時に「Import extensions from VS Code?」と聞かれるので、必ず「Import」を選びましょう。これで今まで愛用していたテーマや便利なLinter設定がそのまま引き継がれます。
Step 3: AIモデルの選択と確認
Cursorの右上にある設定アイコン(歯車マーク)または `Ctrl + Shift + J`(Macは `Cmd + Shift + J`)でAI Paneを開き、使用するモデルを確認します。
現時点では、コードの理解力と速度のバランスが最も優れている `Claude 3.5 Sonnet` をデフォルトに設定しておくことを強くおすすめします。
—
3. 実践! `@Files` と `@Folders` の使い分けと精度の違い
ここからが本題です。AIの回答精度を劇的に引き上げるための、`@Files`(ファイル単位)と `@Folders`(フォルダ単位)の使い分け術を解説します。
`@Files`:外科手術のようにピンポイントで修正したいとき
特定のファイル単体に焦点を当てて、バグ修正やリファクタリングを行いたいときは `@Files` を使います。
- いつ使うか?
- 特定のコンポーネントのロジックを修正したいとき
- 関数単体のテストコードを生成させたいとき
- メリット:
- ノイズ(関係ないコード)がAIに入らないため、指示に忠実で無駄のないコードが返ってくる。
- 使い方:
チャット欄で `@` を入力するとファイル候補が出るので、対象を選択します(例: `@UserCard.tsx`)。
`@Folders`:アーキテクチャ全体や依存関係を把握させたいとき
新しい機能を追加するときや、プロジェクト全体の規約(コーディングスタイルやフォルダ構造)をAIに理解させたいときは `@Folders` を使います。
- いつ使うか?
- 新規機能の追加で、既存のルーティングやAPI設計に合わせたいとき
- 「このプロジェクトのディレクトリ構成に従って、新しいモジュールを作って」と指示するとき
- メリット:
- プロジェクトの文脈や命名規則をAIが学習し、「このプロジェクトらしい」コードを書いてくれる。
- 注意点:
- 関係ないファイルまで大量に読み込ませると、AIが混乱してハルシネーション(嘘のコード生成)を起こす確率が上がります。
—
4. 精度高い「HelloWorld」的動作確認:実際に手を動かしてみよう
百聞は一見に如かず。実際に小さなサンプルプロジェクトを作り、Cursorのコンテキスト管理の威力を体感してみましょう。
今回は、簡単なTypeScriptの「ユーザー管理APIモジュール」を想定した環境を作ります。
1. ワークスペースの準備
任意の場所にプロジェクトフォルダ(例: `cursor-demo`)を作成し、Cursorで開きます。
以下の2つのファイルを作成してください。
`src/types.ts`(データ型の定義)
// ユーザーデータの構造を定義するインターフェース
export interface User {
id: string;
name: string;
email: string;
role: ‘admin’ | ‘user’;
}
`src/userService.ts`(空のファイルを用意)
// ここにユーザーを操作するロジックをAIと一緒に書いていきます
—
2. `@Files` を使った高精度なコード生成の体験
`src/userService.ts` を開き、Cursorのチャット(`Ctrl + L` または `Cmd + L`)を起動します。
ここで、以下のように指示を出してみましょう。
> チャットの入力例:
> 「`@src/types.ts` を参照して、`src/userService.ts` に `getUserById(id: string): User | undefined` という関数を実装してください。メモリ上のダミーデータから検索する実装にしてください。」
🧠 なぜこの指示が良いのか?
- `@src/types.ts` を明示的に指定しているため、AIは `User` 型のプロパティ(`id`, `name`, `email`, `role`)を正確に把握しています。
- 結果として、型エラーのない完璧なコードが一発で生成されます。
AIが生成するコードのイメージ:
import { User } from ‘./types’;
// メモリ上のダミーデータベース
const dummyUsers: User[] = [
{ id: ‘1’, name: ‘山田 太郎’, email: ‘yamada@example.com’, role: ‘admin’ },
{ id: ‘2’, name: ‘佐藤 花子’, email: ‘sato@example.com’, role: ‘user’ },
];
/
- 指定されたIDのユーザーをダミーデータから取得する
- @param id ユーザーID
- @returns 該当するUserオブジェクト、見つからない場合はundefined
/
export function getUserById(id: string): User | undefined {
return dummyUsers.find(user => user.id === id);
}
—
3. `@Folders` を使った全体最適なコード拡張の体験
次に、新しい機能(例: ユーザーのバリデーション機能)を追加するシーンを想定します。ここで `@Folders` の出番です。
チャット欄に次のように入力します。
> チャットの入力例:
> 「`@src` フォルダ全体の構造と規約を理解した上で、メールアドレスの形式が正しいかをチェックする `validateEmail(email: string): boolean` 関数を持つ `src/utils/validator.ts` のコードを提案してください。」
🧠 `@Folders` を使うメリット
AIは `src` フォルダ全体スキャンし、「このプロジェクトではどのような命名規則やファイル配置(ディレクトリ構造)が好まれているか」を推測します。これにより、プロジェクトの雰囲気に完全調和したコードを返してくれます。
—
5. 誤情報を避けるためのスコープ指定ベストプラクティス(プロの知見)
最後に、現場でAIエディタを使い倒しているプロたちが実践している、「AIに嘘をつかせない(ハルシネーションを防ぐ)ための極意」を3つ伝授します。
1. 「とりあえず全部(`@Codebase`)」は避ける
プロジェクト全体を指す `@Codebase` は非常に強力ですが、巨大なプロジェクトでは関係のないコードまで読み込んでしまい、AIが混乱する原因になります。「機能単位」「モジュール単位」で `@Folders` や `@Files` を絞るのが、結果的に一番近道です。
2. 不要になったコンテキストはこまめにクリアする
チャットを継続していると、過去に読み込んだ古いファイルの記憶がAIに残ったままになり、予期せぬバグを誘発することがあります。話題が変わるごとに、チャットを新しく(New Chat)開き直す癖をつけましょう。
3. 「情報のソース」を明示する
「公式ドキュメントのこの仕様通りに書いてほしい」という場合は、Webページをそのまま読み込ませる `@Web` 機能や、公式ドキュメントを `@Docs` でインデックス登録する機能と組み合わせると、さらに精度が跳ね上がります。
—
おわりに
いかがでしたでしょうか?
Cursorの `@Files` と `@Folders` は、単なるショートカット機能ではありません。「AIという優秀だけど少しおっちょこちょいな部下に、正確な指示書と資料を渡すためのディレクションツール」です。
このコンテキスト管理の感覚をつかむと、AIはあなたの最高の相棒へと進化します。「これをマスターすれば、毎日のコーディングが劇的に楽になりますよ!」
ぜひ、今日の開発から `@` を意識したスマートなAI活用を試してみてくださいね。あなたの開発ライフがより快適でクリエイティブなものになることを、心から応援しています!