Cursorというエディタが最近話題になっており、とても便利だという声を耳にするので、今回はインストール方法、AIでのコード生成の流れをご紹介いたします。
Cursorとは
AIを活用した開発に特化したコードエディタで、chatGPTを活用してコードの自動生成、補完、デバッグなどをサポートしてくれる機能があります。
VSCodeをフォークして開発されているので、普段VSCodeを活用してる方でも移行しやすくなっております。
仕様、料金
料金はBasic、Pro、Businessの3パターンあります。
無料のBasicではgpt-4は50回、gpt-3.5はひと月200回コールできます。
有料版では制限ありのgpt-4 turboひと月500回と無制限のgpt-4、gpt-3.5を使うことができます。
OpenAI Keyを使うことで、無料版を使いながら制限を超えてgptを使うこともできます。
Cursorのインストール方法
ダウンロードページからダウンロードしていきます。
ダウンロードできたらインストールしていきます。
Languageの項目には日本語と入力します。
その下のCommand Lineの項目は「install cursor」をクリックしておきます。こちらをクリックしておくと、ターミナルでcursorと入力するだけでCursorが立ち上がるようになります。
VSCodeの拡張機能を使いたいので、画像のUse Extensionsをクリックします。
この画面でPrivacy Modeを選択することでCursorで書いたコードはサーバーに保管されないようにすることができます。
ログイン画面が出てくるので、アカウントがない場合はSign Upから作成していきます。
インストールが完了し、Cursorが立ち上がりました！
VSCodeをフォークして作ってるだけあって、見た目はほぼVSCodeなのでかなりとっつきやすそうです。
READMEが表示されていますが、サンプルのプロジェクトがあらかじめ入ってるのでそちらを確認していきます。
対話しながら三目並べのゲームを開発してみる
インストール後にあらかじめ用意されているprojects/python/main.pyを開きます。
【Step1】 三目並べのゲームを作成
Ctrl ＋ Kで指示を入力する枠が出てきます。gpt-4かgpt-3.5を選択できます。
Step 1に記載してあるようにCLIベースで三目並べのゲームを作成するよう指示を出します。
指示した内容でコードが生成されました。追加の指示を出したり、生成されたコードを直接編集したりもできます。
今回はそのまま受け入れますので、画像左上青色ボタンのAcceptもしくは右上緑色ボタンのYを押してコードを確定させます。
【Step2】 生成されたコードを実行
生成されたコードを実行していきます。
実行すると構文エラーが出ました。エラーの内容を右側のCHATの枠内に貼付けてエラーを修正するように指示を出してみます。
エラーの説明と修正案が表示されました。こちらで問題なければApply to Current Fileをクリックすると元のコードに反映されます。
修正前後の差分が表示されるので問題なければCtrl ＋ Shift ＋ Yもしくは緑のボタンを直接押すことで修正後のコードに変更されます。
再度実行してみると、ターミナル上で三目並べが無事動きました！
勝ち負け判定もちゃんと機能しています。
【Step3】 三目並べのゲームに色をつける
Step3に記載している通り、三目並べに色をつけて見やすく修正していきます。
指示を出して提案されたコードを同様に反映させます。
再度実行すると、色がつき見やすくなりました！
コードやプロジェクト全体の説明をしてもらう
コードの処理内容を説明してもらう
コードを範囲選択してAdd to Chatを押すことで、右側のCHAT欄にそのコードを選択した上で指示を出すことができます。
今回は選択した範囲の処理内容について教えてもらいます。
処理の概要、各メソッドの説明が表示されました。
また、コードだけでなくプロジェクト全体、リポジトリに対しても質問や指示ができます。
この処理はどこでやっているかといったことや、各プログラムの役割についても確認できます。
画像ではリポジトリの説明を聞いています。
指示を入力する枠の右下に記載してる通り、回答をchatもしくはコードベースで選択できますが、今回はコードベースで回答してもらいます。
main.pyを説明するREADME.mdを書いてもらう
次はmain.pyを説明するREADME.mdを書いてもらいます。
新しくREADME.mdを作成した後、ファイル内でCtrl ＋ Kを押して指示する枠を出し、@を入力した後Codeを選択してコードを参照できるようにします。
画像の通り、main.pyを説明するREADME.mdが作成できました。
このように単純な指示から処理内容やリポジトリの説明を確認したり、コードの作成まですることができました。
AIとのチャットではコードやプロジェクトに関する指示はもちろんのこと、関係のない内容についても普通のchatGPT同様に使用することができます。
最後に
VSCodeでもGitHub Copilotを導入することで、今回紹介したコード補完やチャットによる開発といったことができますが、Cursorは元々それらの機能が付いたものとしてより使いやすく感じました。
今回挙げてない機能として、外部サイトのドキュメントを直接読み込ませて、その情報を利用することで導入・開発を楽に進めるといった機能もあるようです。
VSCodeをフォークして開発されているのでこれまでのVSCodeの拡張機能も使うことができ、操作についてもVSCode同様にできるといったことや、全ての作業がエディタ内で完結するので手間が省けるといったことからCursorに移行を考えようかと思います。
もちろんAIの提案が最善とは限らないため使う側が理解することも必要ですが、Cursorを使うことでコーディングが効率的になり、開発スピードも上がるのでぜひお試しください。
