Cursorを使ってみた

# はじめに

今回は、開発者向けに特化した生成AIツールである「Cursor」について紹介します。
簡単なデモ画像を交えて、今更ですが、基本的な機能をご紹介します。

# 1. Cursorの主要な機能

### ①Chat

Chat機能は、エディター内でAIと対話しながらコーディングをサポートする機能です。
質問や指示を入力すると、AIがその場で適切なコードを生成したり、既存コードの修正を提案してくれます。
他の生成AIツールを使ったことがある方なら、この機能はイメージしやすいと思います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/ee5fd1c2-638c-4283-b535-0b99e03189eb.png)

### ②Composer

Composerは、AIを活用してコードの生成やリファクタリングをより戦略的に進める機能です。
Chatが対話型なのに対し、Composerはより具体的な指示をもとにAIがコード全体を提案・編集してくれます。
また、Composerを使用すると、複数のファイルを同時に編集でき、プロジェクト全体の構造を保ちながら開発を進めることができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/ad927283-7231-422a-bd3c-815fd8e3f3d4.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/35c6f77b-7fae-41dd-b989-57c3f839d841.png)


### ③Composer Agent

Composer Agentは、AIが自律的にコードの修正や最適化を行う機能です。
自動でコマンドを作成・実行してくれるため（デフォルト設定では、実行前に確認が求められます）、手動でコンテキストを追加する手間が省け、作業がよりスムーズに進みます。

以下画像のように、Composerでは、normalとagentのモードを選択できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/d8108e31-e323-4e18-9a0f-000b4fc40c0e.png)

コード生成が終了した後、「mvn spring-boot:run」コマンドまで実行してくれます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/84b0b44e-cdbb-4a1c-aead-9c6e54b8eecb.png)

### ④Bug Finder

Bug Finderは、コードの変更をコミットする前に、コード内のバグを自動的に検出し、修正候補を提案する機能です。
通常のバグ検出ツールとは異なり、AIがコード全体のコンテキストを理解し、潜在的な問題点を洗い出してくれます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/41c047de-fa25-441a-a090-d92b9ed9b490.png)

# 2. 視覚情報でコード生成

チャットの下にあるimageボタンを押すか、画像を入力ボックスにドラッグ＆ドロップすることで、視覚情報をチャットに追加できます。
画像を解析し、適切なコードを生成してくれるほか、ブラウザで表示されたエラーのスクリーンショットをそのまま添付して質問することなども可能です。

以下は、Amazonのサイトページをスクリーンショットし、プロンプトに画像を含める例です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/36b167ad-9a49-4fdb-8d51-1c89863a21e1.png)

コード生成後、実際にブラウザで表示してみました。
理想的なデザインに近づけるには、修正が必要ですが、画像からコードを生成してくれる点は非常に便利だなと感じました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/530ddb47-963c-4cfb-811d-ceee09dc486a.png)


# 3. Reference Symbols

Reference Symbols機能では、「@」を使って特定の要素（ファイル、フォルダ、コード、Gitなど）をAIのコンテキストとして指定できます。
これにより、AIがより正確にコードを理解し、適切な提案を行うことができます。

以下は一例となります。

|記号  |説明  |
|---|---|
|`@Files`|プロジェクト内の特定のファイルを参照する。|
|`@Folders`|フォルダ単位で、広範なコンテキストを参照する。|
|`@Code`|特定のコードスニペットやシンボルを参照する。|
|`@Docs`|ドキュメントやガイドを参照する。|
|`@Git`|Git履歴や変更点を参照する。|
|`@Web`|外部のウェブリソースやドキュメントを参照する。|


# 4. 設定ファイルでCursorの動作を最適化

Cursorにおける設定ファイルには、「.cursorignore」と「.cursorrules」があり、Cursorの動作をカスタマイズすることができます。

#### .cursorignore

.cursorignoreは、Cursorが特定のファイルやディレクトリを無視するための設定ファイルです。
通常、コードエディタや生成AIツールがプロジェクトの全体を解析する場合、一部のファイルやディレクトリを無視したいことがあります。その場合に.cursorignoreを使用します。

##### 使用方法
.cursorignoreファイルをプロジェクトのルートディレクトリに作成します。
このファイルには、無視したいファイルやディレクトリを指定します。
以下の例では、拡張子が .log のファイルを無視する設定を行っています。
```
# ログファイルを無視
*.log
```

#### .cursorrules
.cursorrulesは、Cursorがどのように動作するかを制御するルールを定義するためのファイルです。これを使うことで、特定のコードの構造やプロジェクトの規約に基づいて、CursorがどのようにAI補完を行うかをカスタマイズできます。

##### 使用方法
.cursorrulesファイルをプロジェクトのルートディレクトリに作成します。
このファイルにルールを記述することで、特定のファイルタイプや状況での動作を変更できます。

```
# 命名規則は、以下に従ってください。
・ディレクトリ名 : 機能・役割が明確になるようにする（例：order_processing）
・ファイル名 : クラス名と統一する（例：PaymentHandler.java）
・クラス名 : 目的が明確な単語を組み合わせて命名する（例：OrderProcessor）
・メソッド名 : 動作が分かりやすい命名にする（例：calculateTotalPrice())
```

# 5. Privacy設定

生成AIツールを使用する上で気になるのは、セキュリティ面やプライバシーの取り扱いだと思います。
Cursorでは、プライバシー設定を行うことができます。

Cursor画面の右上にある「歯車アイコン」をクリックすると、エディター上に「Cursor Settings」が表示されます。
以下画像のように、「Privacy mode」項目があると思いますので、それを「enabled」に設定してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3163879/61e8c26d-0c4a-42c0-8a82-09a5648ba8f1.png)

# おわりに

今回は「Cursor」について紹介しましたが、AIツールが進化していく中で、コードを書くだけではなく、生成されるコードを正確に理解し、活用する力も重要だと感じています。


生成AIは開発作業を効率化し、強力なサポートを提供してくれる存在ですが、最終的にどのようにそのコードを活用するかは、開発者自身のスキルに依存すると思いました。

最後までお読みいただき、ありがとうございました。
この記事が少しでもお役に立てたなら、嬉しく思います。