Part 2: コード生成のサポートテクニック

開発者が生成 AI を使ってより質の高いコードを効率的に生成できるよう、DevRel として提供すべきサポートテクニックをご紹介します。

今までの課題

開発者が生成 AI でコードを作ろうとしたとき「どう頼めばいいか分からない」「思った通りのコードが出てこない」という声をよく聞きます。

ハッカソンの現場では、参加者が生成 AI に「～～～を作って」とシンプルに大きめの質問で頼んでしまって、作りたいことと合わなかったりエラーだらけのコードが生成されてしまうことがありました。

生成されたコードがうまく動かず、デバッグに時間を取られてしまい、本来作りたかったものに集中できないケースへと発展してしまうこともあります。

ハッカソンでの、いい意味でのプロトタイプ開発風景であればあまり気にしないところではありますが、最新の API 仕様でなかったりセキュリティの最低限のポイントが反映されていないコードが生成されることもあり、そのまま使うと危ないな～？ということもありました。

アプローチ例

生成 AI でコードをつくるときに、ヒントなくお願いするのではなく、ソースコードや仕様などヒントを加えて良いガードレールを添えることが大切です。

こうすることで、生成 AI は、すぐに使いやすいコードを開発者に提供しやすくなります。DevRel として開発者にこうしたテクニックを伝えることで、生成 AI との対話がスムーズになり、つくりたいたいものの開発に集中してもらえるようになります。

テンプレートコードを用意する

まず、よく使うパターンのベースコードをテンプレートとして用意しておきます。たとえば：

// Web API を呼び出す基本テンプレート
async function fetchData(endpoint) {
    try {
        const response = await fetch(endpoint);
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        const data = await response.json();
        return data;
    } catch (error) {
        console.error('Fetch error:', error);
        throw error;
    }
}

これをもとに https://httpbin.org/json にアクセスしてデータを取得して下さい。GET リクエストです。

と Claude でお願いいすると、

このようにテンプレートに沿った処理が出力できます。

テンプレートを渡してから「この基本形に、○○の機能を追加してください」と頼むと、エラーハンドリングも含めた質の高いコードが生成されやすくなります。

今回は JavaScript で例を示しましたが、ハッカソンサポートの場では、こちら側からアポートプログラミング言語をそろえたり、可能であれば、そのハッカソンで利用者の多いプログラミング言語に寄せるとより良いサポートができます。

とはいえ、最近の生成 AI であれば、JavaScript や Python のようなシェアの高い言語であれば「このコードをこのプログラミング言語に書き換えて」といったもかなり書き換わるので、そう促しても良いですね。

プロンプトの書き方を伝える

生成 AI への依頼は「仕様書を書くように」具体的にすることをお伝えしておくのもよいです。

たとえば、こんな感じです。

以下の仕様で JavaScript の関数を作成してください：

【関数名】getUserData
【入力】userId (文字列)
【処理】
1. https://api.example.com/users/{userId} に GET リクエスト
2. レスポンスを JSON として取得
3. エラー時は適切なエラーメッセージを返す
【出力】ユーザーオブジェクト または エラーオブジェクト
【使用ライブラリ】fetch API のみ

とお願いします。

Claude の場合このように返ってきます。いいかんじですね。

これだと固すぎで書くのが大変すぎなので、

プロジェクトの中で JavaScript の仕組みをつくりたいです。サポートお願いします。

関数名は getUserData で https://api.example.com/users/{userId} に GET リクエストします。レスポンスは {"name":"Seigo Tanaka" "type":"engineer"} という値が来るので name を取得します。エラー時のメッセージも返してください。fetch API がよいです。

といったお願いでもいいです。

このような返答が来ます。こちらのほうが、ざっくりしたお願いなので、イイ感じのボリュームのコードが出力される印象です。

公式ドキュメントの URL も一緒に伝える

最新の仕様を反映させたい場合は、公式ドキュメントの URL も一緒に渡すと効果的です：

Unity の UnityWebRequest の最新仕様はこちらです：
https://docs.unity3d.com/ScriptReference/Networking.UnityWebRequest.html

この仕様に沿ってコードを生成してください。

実際にやってみよう

実際に Unity でランダムな犬の画像を表示するコードを生成してみましょう！

この章のまとめ

生成 AI を使ったコード生成は、適切なテンプレートやプロンプトの工夫でよりよいコードが出力され、つくりたいものに早く近づきます。

DevRel として、開発者が生成 AI と上手に対話でき、技術を試す楽しさに早く触れてもらえるよう、サポートすることで、より創造的な開発に集中してもらえるようになります。