ChatGPT APIを使った個人開発のススメ

2023年3月2日ChatGPT APIが発表されました。

このニュースを見て、 「このAPIを使って何か面白いサービスを作れるのでは…？」 と思った方も多いのではないでしょうか？

筆者もそんなふうに思った個人開発者の一人です。

そこで試しに作ってみました。
AIがおすすめの本を選んでくれる 「AI本屋さん」 です。
(ぜひご来店ください)

https://ai-book-store.vercel.app/

アクセスが多いと、API制限がかかって動かないことがあります。ごめんなさい🙇‍♂️

本記事では、ChatGPTを使って何か作ってみたいなと考えている方に向けて、

• サービス開発の流れ
• Tips
• AI 個人開発のススメ

についてご紹介します。

---

サービス開発の流れ

「AI本屋さん」を例にサービス開発の流れを紹介します。

1. 設計

まずはざっくり設計を行いました。

流れは以下のようになります。シンプルですね。

1. 【フロント】質問を投げる
2. 【バックエンド】質問からプロンプトを生成し、ChatGPT APIにリクエスト
3. 【ChatGPT API】レスポンスを返す
4. 【バックエンド】レスポンスからJSONを取り出す
5. 【バックエンド】結果を返す
6. 【フロント】結果を表示する

スタックは、フロント/バックエンドともにNext.js(Vercel)で開発を行いました。
バックエンドをAPI Routesを用いれば、1つのレポジトリでフロントと型を共有しつつ楽に開発できます。

2. プロンプトエンジニアリング

これまでのWebサービスと異なり、ChatGPT使ったサービスを作るのに必要なのがプロンプトエンジニアリングです。

プロンプトエンジニアリングとは、ChatGPTから狙った回答を引き出すために聞き方を工夫することです。

今回の例で言うと、ユーザーの入力をそのまま聞くと以下のような回答が返ります。

JavaScriptの基礎を勉強したいです。おすすめの本を教えてください。

JavaScriptの基礎を学ぶには、次の書籍がおすすめです。

『JavaScript 第6版』(デイビッド・フラナガン著、オライリージャパン)
この本は、JavaScriptの基礎から応用までを網羅した入門書です。コードの例や解説が豊富で、初心者にも分かりやすく書かれています。

『JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで』(山田祥寛著、技術評論社)
この本は、基本的な文法から応用的なテクニックまでを解説した書籍です。実践的な例題が多く、実践的なスキルを身に付けたい人にはおすすめです。

『JavaScriptエンジニア養成読本』(伊藤淳一著、技術評論社)
この本は、JavaScriptの基本から応用、フレームワークの使い方など、実践的なスキルを身に付けることができる書籍です。初心者から中級者まで幅広い層におすすめです。

これらの書籍を読むことで、JavaScriptの基礎を学ぶことができます。また、オンラインのコースやチュートリアルも多数ありますので、合わせて活用すると良いでしょう。

この回答には、以下の問題があります。

• JSON形式でない
• 外国の本ばかり薦めてくる
• 存在しない本を返してくる
• もっと数をお薦めしてほしい

そこで諸々工夫して、最終的には以下のようなプロンプトになりました。
(試すのはPlaygroundが便利です。)

You are an excellent bookseller.

The output should be a markdown code snippet formatted in the following schema in Japanese:

\`\`\`json
[
  {
   title: string, // title of the book.
   description: string // description of the book.
  },
  {
   title: string, // book title
   description: string // book description.
  }
]
\`\`\`

NOTES:
* Do not include books that do not exist.
* Please list only books by Japanese authors.
* Please do not include anything other than JSON in your answer.
* Response must be Japanese

JavaScriptの基礎を勉強したいです。おすすめの本を教えてください。What 5 books do you recommend?

[
  {
    "title": "JavaScript 第6版",
    "description": "JavaScriptの基礎から応用までを網羅した入門書。初心者にも分かりやすく書かれている。"
  },
  {
    "title": "JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで",
    "description": "基本的な文法から応用的なテクニックまでを解説。実践的な例題が多数あり、実践的なスキルを身に付けたい人におすすめ。"
  },
  {
    "title": "JavaScriptエンジニア養成読本",
    "description": "JavaScriptの基本から応用、フレームワークの使い方など、実践的なスキルを身に付けることができる書籍。初心者から中級者まで幅広い層におすすめ。"
  },
  {
    "title": "JavaScriptではじめるデザインパターン入門",
    "description": "JavaScriptを使ったデザインパターンの解説書。デザインパターンを学びたい人や、より良いコードを書きたい人におすすめ。"
  },
  {
    "title": "基礎から学ぶVue.js",
    "description": "Vue.jsの基礎から実践的なアプリケーション開発までを解説した書籍。JavaScriptの基礎も学ぶことができる。"
  }
]

ポイントは

• 英語で質問する
  • 英語の方が精度が高いです。
• 例を示す
  • 今回の場合は、具体的なJSON形式の解答例を示しています。
• 指示を明確にする

  • NOTESの箇所で

    • 存在しない本を出さないで
    • 日本人の著者の本だけ出して
    • JSON以外の回答は含めないでください
    • レスポンスは日本語で返して

    といった、細かい指示を与えています。

より詳しいプロンプトエンジニアリングのコツを知りたい方は、OpenAIが公式で出しているTechniques to improve reliabilityが参考になります。

3. 実装

実装と言っても、通常のWeb開発と大きな違いはありません。

1つだけ、特徴があるのはChatGPTのレスポンスをパースする部分です。
以下のような関数を書いて、```json```と で囲まれたJSONのレスポンスを取り出す必要があります。正規表現を用いているのは、指示を無視して返答にJSON以外のテキストを含めてくる場合があるためです。

/**
 * Parse GPT Response
 * @param gptResponse
 * @returns
 */
export const parseGPTResponse = (gptResponse: string): GPTBook[] => {
  const regex = /```json([\s\S]*?)```/gm
  const match = regex.exec(gptResponse)

  if (match === null || match?.[1] === null) {
    throw new Error("JSON content not found in the string")
  }
  const jsonData: object = JSON.parse(match[1])

  return jsonData as GPTBook[]
}

---

開発Tips

ここからは実際にサービスを開発してみて得られたTipsをご紹介します。

開発にChatGPTをフル活用すべし

開発自体にもChatGPTをフル活用しました。
ネットで調べてわかることは、ほぼ全てChatGPTが一瞬で解決してくれます。
使ったことない方は、いますぐ有料で使ってみることをお薦めします。
今回の「AI本屋さん」の開発でも、全体の3割くらいはChatGPTに書いてもらったコードです。
また、キャッチコピーも、悩んでいたところ、ChatGPT(Notion AI)が素晴らしいコピーを出してくれました。

レスポンスが遅いので工夫する

リクエストの内容にもよりますが、APIのレスポンスは数十秒かかるので、待っている間退屈しないような工夫が必要です。(今回は、①ぐるぐる回した、② 時間がかかる旨を伝えただけですがw)

診断系のサービスであれば、ここで動画広告を出すのも良いでしょう👌

エラーチューニングが必要

APIのレスポンスのフォーマットが予想できないため、通常のWebサービス以上にエラーが発生しやすいです。エラーハンドリングを適切に行うとともに、エラーをウォッチして、起きにくくなるようにプログラムをチューニングする必要があります。

Turbo3.5でも十分パフォーマンスが出る

今回はChat GPT4ではなく、ChatGPT3.5-turbo APIを用いました。

理由は返答の品質に大きな違いがなかったからです。

GPT3.5の方が4と比べて、価格がかなり安いので、返答の品質に違いがないなら3.5を使うことを検討してみても良いでしょう💪

---

AI 個人開発のススメ

最後に今なぜChat GPTを使った個人開発をオススメするのかについて熱く書きます！

スピードを生かせる

個人開発の最も大きな武器はスピードです。
これまではいくら早く作れても、既存の技術でできるニーズのあるサービスは既に存在しており、ニッチを狙うしかありませんでした。

しかし、Chat GPTの登場により状況は大きく変わります。
プログラムは思考できるようになり(これはもう思考と呼んでいいでしょう)、できることの幅が一気に大きくなりました。

これによって、今まで作れなかった多くのサービスが実現可能になりました。

ここで、個人開発者のスピードが生かせます。企業も追随してくるでしょうが、個人開発者のスピードには追いつけません。やってやりましょう💪

集客しやすい

サービスを作った方ならよくわかると思いますが、個人でサービスを作ってリリースしても、誰も見向きもしてくれません。大変なのは開発よりも集客なのです。

しかし、「Chat GPT」にはみんなが興味津々です。
あなたに興味はなくても、ChatGPTを使ったサービスとなれば使ってみたいと思う方も多いです。
実際、「AI本屋さん」のようなかんたんなサービスでも、そこそこの注目を集めることができました。

---

スピードが活かせるのも、集客しやすいのも今だけです。

ぜひ今日から個人開発を始めてみましょう！
あなたの人生が大きく変わるかもしれません😆