Agentモードを使ってみた
これまでAskモードでを主に使ってあくまでコーディングのサポートとい感じでcopilotを使っていましたが、今年の3月頃からagentモードが追加されていたので使ってみました。
使い方
vscodeでcopilotのチャットを開くとテキストの入力欄左下にモードの選択欄があるので、そこで「Agent」を選択して、Agentモードでcopilotを動かします。
完成まで
※途中経過の画面などは保存し忘れました。。。。
私は学園アイドルマスターをやっているのですが、プレイする際にいつも同じ内容をプレイしてしまうことが多いので、ルーレットでプレイする内容を決めることができるルーレットを作ろうと思いました。
最初に以下のような感じで何をしたいかを伝えました。
ルーレットのwebアプリケーションを作成したいです。
next.jsで作成してください。
キャラとタイプを選択して、ルーレットの対象を選びます。
ルーレットを回すとどのキャラのどのタイプなのか決めることができます。
上記を伝えるとpackage.jsonなど設定ファイルを含む各種ファイルの作成を始めます。
ですが基本的に1発で思ったものはやはりできませんでしたので、１つ１つ自分好みの仕様を伝えて、進めてきました。
例えばルーレットの元データとなる値に追加のプロパティを自分で書き加えました。
{ id: 1, name: '花海 咲季'},
{ id: 1, name: '花海 咲季', color: '#cf2e2e', ableTypes: new Set([1, 2, 3]) },
ここで以下のように要望を伝えました。
固有のカラーと使用できるタイプを個別に設定します。
ルーレット対象、結果の表示に固有のカラーを用いてください
これで細かい配色やレイアウトを以下のようにデザインにしてくれます。
ここで思ったことはテキストで指示をするだけでなく、ソースを自分で書き換えて、それをもとに修正をしてくれるので、言語化がめんどくさい時などに便利だと思いました。
その後もデザインやレイアウトなど気に入らない場合はその都度修正依頼→出来栄えのチェックの繰り返しです。
ターミナルの内容も読み取って対応してくるので、ソースの修正で発生するコンパイルエラー等もすべてcopilotにお任せです。
修正は数秒で終わることはなかったので、その間好きなことをして修正が終わるのを待っていました。
その結果以下のようなページが完成しました。
最後に
当たり前ですが、askモードとの決定的な違いはソースの修正も行ってくれるところです。数ファイルの修正ならば、何をしたかを確認はできると思います。ですがファイル数が多くなるとソースファイルの読み込みが多くなるので、大規模なアプリケーションでは厳しい場合が出てくるのかなという印象が少しあります。ですが確実に作業効率は上がりますし、実装の幅も格段に広がるので、活用すべき機能だと思います。