chat ai samples

クイックリンク?

• 登録してストリームの API キーを取得します
• ReactJS の例
• ChatGPT ノードサーバー
• ジェミニノードサーバー

リポジトリの概要 ?

このリポジトリには、チャット製品でジェネレーティブ AI をどのように使用できるかを示す Stream の公式サンプル プロジェクトが含まれています。これには、ChatGPT および Gemini のサンプル バックエンド サーバーが含まれており、Stream で Gen AI を使用する際のリファレンス ガイドとして使用できます。

ReactJS、Android、Flutter のサンプル統合は「frontends」ディレクトリにあり、AI プロバイダーから送信されるリアルタイム メッセージ チャンクの操作とレンダリングも示しています。

プロジェクト/パッケージ

• バックエンド
  • ChatGPT サーバー: OpenAI と Stream チャットの両方に接続して、リアルタイムでメッセージを傍受して応答するノード サーバー。
  • Gemini サーバー: Stream Chat を Gemini に接続し、メッセージの送信、受信、および返信を可能にするノード サーバー。
• フロントエンド
  • React/NextJS: ChatGPT と対話し、ストリーミング応答を実装する NextJs アプリ。
  • Android: Google の Gemini と Jetpack Compose SDK を統合する、Kotlin で書かれた Jetpack Compose アプリ。詳細な開始手順については、サブディレクトリを参照してください。

どうやって走るの？

環境変数を設定する

cp .env.example .env

次の認証情報を.envファイルに追加します。

1. ストリーム チャット アプリの API キーとシークレット
2. ユーザーIDとトークン
3. OpenAI APIキー
4. または Gemini API キー

バックエンド

バックエンドサーバーを起動するには、ChatGPT と Gemini のどちらかを選択できます。サーバーはメッセージをリッスンし、AI が生成した応答で応答します。このサーバー URL を Stream Chat アプリの Webhook として構成する必要があります。

 cd server
yarn ;

# Start ChatGPT server
yarn start:openai

# Or start Gemini server
yarn start:gemini

Ngrok Webhook を構成する

ローカル サーバーをインターネットに公開するには、ngrok を使用できます。ここの手順に従って、ngrok をセットアップし、Stream Chat アプリの Webhook URL を構成します。

https://getstream.io/chat/docs/react/debugging_with_ngrok/

フロントエンド

 cd react-chat
yarn ; yarn start

AIガイド

これらのガイドでは、SDK と製品全体で AI をどのように使用できるかを詳しく説明します。

• ストリーム チャットを使用した ChatGPT の実装
• Google の生成 AI を使用して AI チャット Android アプリを構築する
• ドキュメント用に LLM を利用したチャットボットを作成する
• Stream Chat、HuggingFace、DialogGPT を使用した会話型 AI

貢献していますか？

• サンプルアプリを提出するにはどうすればよいですか?
  • アプリの提出はいつでも大歓迎です! ?適切な説明が記載された PR を開いてください。できるだけ早く審査させていただきます。
• バグを見つけましたか? ?
  • アプリを改善したり、問題を修正したりするためのコード変更を歓迎します。 Github でプル リクエストを送信する前に、すべてのベスト プラクティスに従い、該当する場合はテストを追加してください。