JavaScriptで使えるジェネレーティブAI活用5選｜業務効率アップ＆お手軽導入例

「AIってすごそうだけど、自分が使う場面ってあるのかな？」 そんな疑問を持っている方へ。 実は、JavaScriptと組み合わせることで、AIはぐっと身近になります。 この記事では、実務や日常の中で使えるジェネレーティブAIの活用例5つをコード付きで紹介します。 「便利そう！」「やってみたい！」と思えるアイデアを見つけてみましょう。

---

ジェネレーティブAIって何？

まず「ジェネレーティブAI」とは、文章・画像・音声・コードなどを自動で生成するAIのことです。

よく知られている代表例は：

• ChatGPT（テキスト生成）
• Stable Diffusion（画像生成）
• ElevenLabs（音声生成）

これらはJavaScriptを通じてブラウザ上で簡単に呼び出すことが可能です。

---

活用例①：文章の要約・返信生成（ChatGPT API）

業務での会議メモの要約や、問い合わせメールの自動返信に便利です。

const res = await fetch("https://api.openai.com/v1/chat/completions", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "Authorization": "Bearer YOUR_API_KEY"
  },
  body: JSON.stringify({
    model: "gpt-3.5-turbo",
    messages: [{ role: "user", content: "この会議内容を要約してください。" }]
  })
});

---

活用例②：画像を自動生成（Replicate API + Stable Diffusion）

SNSやブログのアイキャッチ画像生成に便利。

fetch("https://api.replicate.com/v1/predictions", {
  method: "POST",
  headers: {
    "Authorization": "Token YOUR_API_KEY",
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    version: "model-version-id",
    input: { prompt: "猫とカフェの風景、イラスト風" }
  })
});

---

活用例③：Webサイトの読み上げ音声をつける（TTS）

サイトの操作ガイドやアクセシビリティ向上に役立ちます。

const utterance = new SpeechSynthesisUtterance("ようこそ、当サイトへ！");
speechSynthesis.speak(utterance);

---

活用例④：チャットUIでFAQ対応（ChatGPT）

社内問い合わせやQ&A対応を自動化する簡易チャットボットも作成可能です。

const userMessage = "パスワードを変更したい";
const response = await fetch("https://api.openai.com/v1/chat/completions", {...});

---

活用例⑤：手書き文字の簡易認識（TensorFlow.js）

簡単なOCRとしてアンケートや学習アプリなどに組み込めます。

• ブラウザ上で手書き文字を認識して、結果を返すサンプル多数
• 学習済みモデルを使えば、手軽に精度の高い入力補助が可能です

---

活用のポイント

ポイント	説明
コスト	無料枠のあるAPIが多く、試しやすい
学習コスト	JavaScriptの基本がわかれば導入可能
応用しやすさ	UIと組み合わせれば、プロトタイプ開発にも活用可能

---

まとめ

今のAIは「大規模な開発」だけのものではありません。 JavaScriptで少しコードを書くだけで、普段の業務やWebサイトにAIを組み込むことができます。 まずは一つ、気になる活用例から手を動かしてみてください。