Cursorにはエディタウインドウエージェントウインドウの2種類のウインドウがあります。

エージェントウインドウとは

エージェントウインドウは、AIに開発作業を依頼するための画面です。ファイルの操作やコマンド実行を含む、以下の機能を利用できます。

  • プロジェクト内のファイルを調べる
  • ファイルを新しく作る
  • 複数のファイルを変更する
  • コマンドを実行する
  • エラーの原因を調べる

エージェントウインドウは大きくわけて3つのエリアに分かれます。

  1. サイドバー:エージェント関連の履歴や検索などのメニュー領域です。
  2. チャットパネル:エージェントに指示を入力したり、結果を確認したりする領域です。
  3. アプリバー:ターミナルや履歴、ブラウザ表示などを表示する領域です。

エージェントウインドウはエージェントを使うことに特化したウインドウだよ。コーディングツールなのに、編集機能を外しているところがかっこいいと思う(一応編集できるけど)。

サイドバー

サイドバー
  1. New Chat:新しいチャットを開始します。
  2. Search:過去のチャット履歴やファイル、設定などを検索します。
  3. Automations:定期的な作業をエージェントに任せることができます。
  4. Customize:環境設定ができます。
  5. Repositories:開いたことがあるリポジトリリストです。

チャットパネル

チャットパネル
  • リポジトリ:ターゲットにするリポジトリを選択します。
  • ブランチ:ターゲットにするブランチを選択します。
  • 実行先:ターゲットにする実行先を選択します。
  • エージェント:エージェントに指示をします。

アプリバー

アプリバー
  • 変更履歴:エージェントで変更したファイルの変更履歴を開きます。
  • ターミナル:WindowsであればPoweshellが起動します。
  • ブラウザ:ブラウザを起動します。
  • ファイル:現在のワークディレクトリを開きます。

エージェントウインドウとエディタウインドウの使い分け

エージェントウインドウは、複数のエージェントを動かしたり、管理したい場合に向いています。一方、エディタウインドウは、コーディングするのに適しています。

どちらもウインドウでもコーディング、AIへの指示が可能なので、最初は使い分けで迷うことがあると思います。まずは、コーディングするならエディタウインドウ、AIに作業を任せながら進めたいときはエージェントウインドウと考えると分かりやすいでしょう。

それぞれのウインドウから相手のウインドウを開くことができます。ショートカットならエディタウインドウを開く場合は[Ctrl]+[Shift]+[N]、エージェントウインドウを開くには[Ctrl]+[Alt]+[N]です。

エージェントウインドウからエディタウインドウを開く
エディタウインドウからエージェントウインドウを開く

エディタウインドウとは

エディタウインドウでは、HTMLやCSS、JavaScriptなどのコードを編集します。コードを書く、ファイルを管理する、エラーを確認する、ターミナルを使うといった、開発に必要な機能をひとつにまとめたソフトです。

Cursorの画面は大きく分けると6のパーツで構成されています。

CursorのUIは6つの領域に分かれています。

  1. アクティビティバー
    サイドバーのビューを切り替えます。
  2. サイドバー
    アクティビティバーの操作により、エクスプローラーや検索、ソース管理などのさまざまなビューが切り替わります。
  3. ステータスバー
    プロジェクトとファイルに関する情報を表示します。
  4. エディタグループ
    ファイルを編集するためのメインエリアです。
  5. パネル
    エラーや警告、出力結果、ターミナル、デバッグコンソールなどを表示します。
  6. エージェントサイドバー
    エージェント用のエリアです。

画面には多くのボタンやメニューがあるけど、必要な機能から徐々に覚えていくでOKだよ。

アクティビティバー

ファイル一覧や検索、バージョン管理、拡張機能など、サイドバーに表示する機能を切り替えるためのエリアです。

  • エクスプローラ:開いているファイルを一覧表示します。ファイルの編集を含むファイル・ディレクトリ操作が行なえます。
  • 検索:プロジェクト内のファイルを検索、置換します。
  • ソース管理: Git操作が行なえます。
  • 拡張機能:拡張機能の検索、インストールを行います。

アクティビティバーの右端にある下矢印をクリックすると、[実行とデバッグ]、[リモートエクスプローラー]、[Github]のメニューが表示されます。

アクティビティの右矢印をクリック

サイドバー

アクティビティバーのアイコンをクリックすると、その機能がサイドバーに表示されます。

ステータスバー

ステータスバーはエディタの設定やファイルの状態などを管理するエリアです。デフォルトで表示される項目と、ファイルを開くと表示される項目があります。

エディタグループ

ファイルを編集するメイン画面です。右上にファイルの変更履歴やウインドウ分割などの機能ボタンが並びます。

キャプション

パネル

問題、[Output]、デバッグコンソールターミナル、[ポート]を切り替えて使うパネルです。ここからコマンドを実行したり、エラーや出力結果などを確認したりすることができます。

エージェントサイドバー

エージェントに指示を送るためのエリアです。右上にはチャット履歴や、新規チャットなどの機能ボタンが並びます。

エージェントサイドバー