0%
バイブコーディング#Cursor#AI#コードエディタ

Cursor入門|AIコードエディタの使い方と始め方

CursorはAIを搭載したコードエディタです。インストールから基本的な使い方、便利なショートカットまで、初心者向けに解説します。

|(更新: 2024年12月1日|7分で読める

Cursor入門|AIコードエディタの使い方

CursorはAIを搭載したコードエディタで、バイブコーディングに最適なツールです。

VSCodeをベースにしており、使い慣れた操作感でAIの力を活用できます。

Cursorとは?

Cursorは、AIがコードを書いてくれるエディタです。

特徴 説明
AIチャット エディタ内でAIに質問・指示ができる
コード補完 AIが次に書くべきコードを予測
コード編集 選択したコードをAIが修正
VSCodeベース 既存の拡張機能がそのまま使える

インストール方法

ステップ1: ダウンロード

  1. cursor.comにアクセス
  2. 「Download」をクリック
  3. OS(Mac/Windows/Linux)を選択

ステップ2: 初期設定

  1. Cursorを起動
  2. VSCodeの設定をインポート(任意)
  3. AIモデルを選択(Claude推奨)
  4. アカウント作成(無料プランあり)

基本的な使い方

1. AIチャット(Cmd/Ctrl + L)

エディタ内でAIと会話できます。

使い方:
1. Cmd + L(Mac)/ Ctrl + L(Windows)を押す
2. チャットパネルが開く
3. 質問や指示を入力
4. AIが回答・コードを生成

使用例:

  • 「このコードの意味を教えて」
  • 「ログイン機能を作って」
  • 「このエラーを修正して」

2. インラインチャット(Cmd/Ctrl + K)

コードを選択して、その場で編集できます。

使い方:
1. 編集したいコードを選択
2. Cmd + K(Mac)/ Ctrl + K(Windows)を押す
3. 指示を入力(例:「TypeScriptに変換して」)
4. AIが編集案を提示
5. Accept/Rejectで採否を決定

3. Tab補完

AIがコードの続きを予測して提案します。

使い方:
1. コードを書き始める
2. グレーの文字で補完候補が表示
3. Tabキーで採用
4. Escキーでキャンセル

便利なショートカット

操作 Mac Windows
AIチャットを開く Cmd + L Ctrl + L
インライン編集 Cmd + K Ctrl + K
新規チャット Cmd + Shift + L Ctrl + Shift + L
ファイルを参照に追加 @ + ファイル名 @ + ファイル名
コードベース検索 @codebase @codebase

料金プラン

プラン 料金 内容
Hobby 無料 月2000回のAI補完
Pro $20/月 無制限のAI補完
Business $40/月 チーム機能付き

おすすめ: まずは無料プランで試して、足りなければProへ

よくある質問

Q. VSCodeとの違いは?

AIが統合されている点が最大の違いです。VSCodeでもGitHub Copilotを使えますが、CursorはAIとの対話がより自然にできます。

Q. どのAIモデルを選べばいい?

Claude 3.5 Sonnetがおすすめです。コーディングに強く、日本語も理解できます。

Q. 無料プランでどこまでできる?

月2000回のAI補完で、個人開発なら十分です。毎日ガッツリ使うならProを検討。

Q. 既存のVSCode設定は使える?

はい、拡張機能や設定をそのままインポートできます。

Cursorを使いこなすコツ

1. @ファイル名で参照を追加

例: @components/Button.tsx このコンポーネントを使ってフォームを作って

関連ファイルを参照に追加すると、より正確なコードが生成されます。

2. @codebaseで全体を検索

例: @codebase 認証機能はどこに実装されている?

プロジェクト全体からAIが関連コードを見つけてくれます。

3. エラーはそのまま貼り付け

例: 以下のエラーを修正して
TypeError: Cannot read property 'map' of undefined

エラーメッセージをそのままAIに渡すと、的確な修正案が得られます。

まとめ

Cursorのポイント:

  1. Cmd + L でAIチャット
  2. Cmd + K でインライン編集
  3. @ファイル名 で参照追加
  4. まずは無料プランで試す

次のステップ

シェア:

バイブコーディングの他の記事

他のカテゴリも見る