はじめに
クラウドサインでフロントエンドエンジニアのツノ(𝕏@2nofa11)です。
私の作業領域は主にクラウドサインのフロントエンドですが、今回の機能開発ではバックエンドが中心となる案件でした。
案件の特性を鑑みてフロントエンドエンジニアもバックエンド開発する方針になり、バックエンドのキャッチアップが必須になりました。
Tour of Go などの基本的な学習は自己学習で補える部分ではありますが、既存プロダクトのコードリーディングを行い、開発できる状態になるまでには課題を感じていました。
この課題に対して、バックエンドメンバーとモブプロを実施し、疑問点を共有しながら解決を図ってきました。しかし、まだ解決できない疑問が残り、十分に習熟できていないと感じています。
そこで、より効率的な学習を実現するため、バックエンドのキャッチアップに Cursor を利用することにしました。
ちょうど社内では開発系 AI の導入・検証も進めており、その一環として Cursor を活用できる環境が整っていました。
本記事では「Cursor の便利だと思った機能」と「キャッチアップでの Cursor の活用例」について、実際の経験をもとにまとめたいと思います。
Cursor の便利だと思った機能
AI 搭載のコードエディタといえば、GitHub Copilot がありますが、Cursor に優位性があると感じた点はいくつかあります。
コード → チャット、ターミナル → チャットの UX がいい
GitHub Copilot が VS Code の拡張機能という位置づけなのに対して、
Cursor は「The AI Code Editor」というだけあって、開発体験が素晴らしいです。
具体例としてターミナル上のコマンド結果をチャットに連携するケースです。
GitHub Copilot では、チャット上から #terminalLastCommand というキーワードを入力します。
Cursor では、ショートカットや範囲選択で指定した内容をスムーズにチャットへ流し込むことができます。
小さいことですが、開発作業とチャットへの動線が考えられていて使ったときの手触りがいいなと感じています。
コンテキストの選択で、公式ドキュメントやリポジトリを選択できる
Cursor ではウェブや Git リポジトリにアクセスして取得した内容をチャットに含めることができます。
初見のライブラリや参考にしてほしいウェブサイトをコンテキストとして加えることができます。
コンテキストは以下のようにチャット内で@を入力して設定できます。
コードベースを学習させることができ、精度が高い
GitHub Copilot だと、チャット上に@workspaceのキーワードを入力することでワークスペース全体をチャットの文脈に入れることができます。
Cursor の場合は@Codebaseでワークスペースをチャットの文脈に入れることができます。
- Cursor の機能説明
コードベースについて質問するには @Codebase や ⌘ Enter を使ってください。Cursor がコードベースを検索し、あなたの問い合わせに関連するコードを探し出します。
特に設定の画面に「Codebase Indexing」という項目があります。
ここの項目では、Git の情報もあわせてインデックス化させたり、インデックスの対象外を設定できたりします。
体感ですが、GitHub Copilot よりも文脈を正確に読み込んだ回答が得られています。
キャッチアップでの Cursor の活用例
上記の Cursor の利点を最大限活用して、バックエンドのキャッチアップを行いました。
恩恵を受けることができたところは以下の 2 つです。
言語知識・ライブラリの知識の補完をチャットで完結できる
クラウドサインではバックエンドを Go 言語で開発しており、複数のライブラリを使用しています。
キャッチアップでは「コードを読む ↔︎ わからないところを範囲選択してチャットに質問する」を繰り返し活用しています。
GitHub Copilot と比べて Cursor はここの体験が非常に優れています。
またライブラリのソースコードリポジトリや公式サイトを読み込ませて、精度の高い情報取得がエディタ内で完結します。
コードベースの理解を深めるために、コードベース横断で処理の流れを図化する
例えば、コードベースを読み込ませたうえで「hoge 関数の処理の流れと、関数間の関係性を Mermaid を使用して解説してください」のように指示すると以下のように視覚化された資料が提示されます。
それを仮説としてコードを読み込んでいく※と、処理の流れの解像度が向上します。これによりキャッチアップがスムーズに行えています。
※一方で Cursor による解説や図解が正しいとも限らないので、有識者に確認をとりつつ利用するべきだと考えています。
まとめ
バックエンド未経験の状態から、Cursor を活用することで効率的にキャッチアップを進めることができています。
特に、コードの疑問点をその場で解決できることと、複雑な処理フローを視覚化できる点は Cursor の利点を活かせていると実感しています。
