はじめに
Vibe Codingは、Coding Agentの台頭により、コーディング作業が劇的に素早く、簡単になりました。
今回は、サクッとツールを作るときのコツについて紹介します。
ツールづくりのコツ
要件が全てです。が日常でめんどくさいなと感じたときにツール作ったらいけないかな？をちょっと考えてみるのが良いと思います。
手元でサクッと動かすという点ではローカル環境で動かすことを前提に考えると楽かもしれません。
最近で作ったツールだと、
- sitemap.xmlのURL一覧からスクレイピングして各HTMLをマークダウンファイルに変換して保存するツール
- jpgやpng画像をwebpに変換するクライアントアプリ
- 会議室の利用状況を取得するChrome拡張機能
等です。
これらをどのようなプロンプトで作ったかを紹介します。
プロンプトにわたすことは基本的にこの4点です。
- やりたいこと
- 言語・フレームワークの指定(制約の設定)
- どの環境で動かしたいか
- どのようなアウトプットを期待しているか
これらをまとめます。
慣れないうちは、やりたいことだけを伝えていきなりソースコードを生成させないように指示します。
特定のsitemap.xmlのURL一覧からスクレイピングして各HTMLをマークダウンファイルに変換して保存するツールを作りたい。
まずは要件を設定するところからはじめたいです。
このようにプロンプトを書くと、事前に要件を整理出来ます。
納得がいったら、ソースコードを生成させます。
後は動かしてみて要件を満たす作りになっているかを確認し、出来ていなかったらエラーが出ている場合はエラーを見に行き、エラーが出ていない場合は、ソースコードを見に行きます。(生成されたタイミングである程度ソースをなめておくと良いです。)
以降はやりたいことを伝え、動いていることを常に担保しつつ新しい要件を追加していく
アドバイス
Vibe Codingをする上で、効率良く成果を出すためのプラスアドバイスがあります。
3つあります。
- 早めにテストコードを生成しておく
- コードを生成するたびにコミットする
- チャットが長くなってきたら、Summaryにまとめて次のチャットへ
これらはどれも精度を高める、維持するためのものです。
コード量が膨大、チャット量が膨大になるとハルシネーションや要件を満たさなくなったりすることが頻発するので工夫が必要です。
さっきまで動いていたのに動かなくなった、というのは結構起こるので意識してみてください。
まとめ
要件の設定も大事ですが、精度を高めるための工夫も大事です！
どんどん身の回りの不便をツールを作って解決していきましょう〜