イントロダクション
つい先日、「Pythonで遊ぼう!基礎編 ① おすすめテキストエディタ5選」で、現在、個人開発者のプログラミングで使われている有力なテキストエディタを紹介しました。
AIプログラミング全盛のこの時代であっても、Github Copilotを導入すれば問題ないと「VSCode」を最有力候補に選出しました。
しかし、モリモリと評判を上げ始めている新しいエディタが登場したようなので、記事を分けて紹介させていただきます。
PR
AIプログラミングエディタ「Cursor」
日本語での読みは「カーソル」でいいかと思います。
以下が、カーソルが自らのダウンロードページで主張している利点です。
私が実際に触った感じでも、書かれている内容に偽りはなく、VSCodeの拡張機能も動いている状態です。実際に触ってみましょう。
「Cursor」ダウンロード・インストール
下記公式HPにアクセスしてください。


「Download for Windows」をクリックすると、Windows用の.exeファイルのダウンロードが始まります。
MacやLinuxを利用している方の場合、Downroad for Mac などにHP表示が変わっているかと思います。希望のファイルと違うならば、Otherをクリックして該当するファイルをダウンロードしてください。
ダウンロードが完了したら、Cursor Setup……exeファイルを開きます。このとき、ファイルを開くとすぐにインストールが始まりますのでご注意ください。

設定画面が登場したら、Languageの設定を変えたい方はここに”日本語”と記入してください。英語のままでも構いません。
「Continue」を押すと以下の画面に変化します。

VSCodeの拡張機能をそのまま導入したい方は、「Use Extention」を押してください。

その後、LogIn画面が表示されますが、まだサインアップが終わっていない方は、「Sign Up」を押してください。グーグルと連携してアカウントを作成するとすぐに完了します。

サインアップまたはログインが完了すると、エディタが立ち上がります。
以上でインストールは完了です。
Cursorの日本語化
「Cursor」を最初に立ち上げると、VSCodeの拡張機能を導入しているのに「Japanese Language Pack for Visual Studio Code」が有効になっていない状態になっているかと思います。設定していきましょう。
「Ctrl+Shift+P」を押すと、「コマンドパレット」が開きます。「Display」と入力するか、「Configure」と入力すると、「Configure Display Language」という選択肢が出てきますので、選択します。


「日本語」を選択してください。

「日本語にスイッチするためにCursorをリスタートしますか?」と聞かれますので「Restart」を選択。
以上で日本語化は完了です。
Cursor AIの威力を体験!
AIプログラミングを体験するチュートリアルがCursor内に用意されていますので、以下でそれを簡単に実行してみましょう。
AIコーディング
画面左側にファイル一覧が表示されています。「python」フォルダから「main.py」を開いてみましょう。

なにやらピンク色の文字で書かれています。英語ですが、内容は、順番に設定したステップを体験してみましょうというものです。

新しい行で「Ctrl+K」を押してくださいとのことなので押します。

AIとの対話インターフェイスが開きました。ここにAIへの指示(プロンプト)を書きます。GPT-3.5とGPT-4のどちらを使うかも選択ができます。

さて、ピンク色の文字の指示をさらに読み進めてみます。「Ask for CLI-based game of TicTacToe.」とあります。TicTacToeとは、三目並べのことです。CLIベースの三目並べゲームを頼んでみましょうとのことなので、そのように書きます。
日本語ならば、「CLIベースの三目並べのゲームを作成してください。」とAIに指示(プロンプト)を入力してみてください。

すると、ものすごい勢いでAIがプログラムを作成し始めます。コードに問題がなければ、AcceptまたはCtrl+Enterを押します。
以上でコーディングは終了です。
コードの実行・デバッグ
作成したファイルを実行してみましょう。

画面左側の「main.py」を右クリックし、赤枠で囲んだ「ターミナルでPythonファイルを実行する」をクリックします。

すると、SyntaxErrorが発生しました。コードにバグがあるようです。

赤くなった部分をクリックすると、「Debug with AI」というボタンが出てきます。デバッグしてもらいましょう。

英語で分かりにくいかもしれませんが、出てきたエラーメッセージを打ち込んでくださいと書いてありますので、エラーメッセージを打ち込んでみます。

エラーの原因が指摘されました。エラーにカーソルを合わせると再生ボタンのところに、「Apply to Current File」とありますので、クリックして適用します。

コードが修正されました。コードの緑色の方をクリックするか、チャット画面の「Accept Edit」を押して確定します。デバッグはこれで終了です。
バグが治っているか、もう一度ターミナルからコードを実行します。

3目並べゲームが起動しました。作成成功です。
コードの改善
さて、このままでは三目並べのゲーム画面が物足りず、色なども付け足したいという希望が出たとします。そのような改善も、ChatGPTに依頼することが出来ます。
ピンク色の英語テキストで言う、ステップ3の部分です。
修正したいコードを選択して、「Ctrl+L」を押します。
コードがチャット画面に展開され、AIへの指示(プロンプト)入力画面が表示されます。
ここで、「三目並べの盤面をわかりやすくなるように追加して、ゲームに色を付けてください。」と入力します。

すると、AIが再びものすごい勢いでコードの修正案を書き込んでいきます。
上のデバッグ時と同様に、緑色のコードを選択するか、「Accept Edit」を押します。
ゲームを遊んでみましょう。

コードの改善が完了しました。
AIの破壊的な威力
ご覧になった通り、GPTチャットに少し指示を出しただけで、コーディング・実行・デバッグ・改善があっという間に終わってしまいました。
プログラミングでの人間の役割を考えると、Cursorのようなエディタをいじくり回せて、思い通りのプログラムを書かせられるか、ということが重要な要素になってくるのではないでしょうか。
AIの力を手軽に体感できる「Cursor」は、体験程度の利用ならば無料です。GPTをもっと使う方には課金プランもあります。ただし、Cursorで月額契約するよりも、OpenAIでAPIキーを取得して利用した方が、様々なサービスでAIを使うことが出来ますので、そちらをお勧めします。
ぜひ一度はこの驚異的な体験をしておくことをオススメします。
PR
コメント