https://a.storyblok.com/f/270183/1368x665/084e3140d0/code-hub_chatgpt.png

CodeHub + ChatGPTでコミュニケーションアプリを高速化しよう

最終更新日 May 28, 2024

所要時間:1 分

はじめに

コードハブは、一般的な通信ワークフローやブラウザベースのコーディング環境のための構築済みソリューションのホームです。これらの構築済みソリューションは、依存関係の設定やAPIキーの手動設定など、開発時間を大幅に短縮します。

Code Hubの直感的なインターフェイスでは、Vonageの次のようなユースケースを閲覧できます。 メッセージAPI, 音声API, ビデオAPI, ナンバーインサイトAPIなどがある。

ChatGPTは多くの企業が導入しているツールなので、そのプロセスをより簡単にするテンプレートをいくつか用意しています。

これには以下が含まれる:

  • WhatsApp ChatGPT ボット- Vonage Messages APIを使ってWhatsApp ChatGPTボットを作成。

  • 音声チャットGPTボット- Vonage Voice APIを使ってWhatsApp ChatGPTボットを作成。

  • 音声チャットGPTボット(Java) - Vonage Voice APIとJavaを使ってWhatsApp ChatGPTボットを作成します。

  • 画像チャットGPTボット-このプロジェクトでは、OpenAI API DALL-Eを使用して、SMSテキストプロンプトに基づいて画像を生成するSMSチャットボットを作成します。

  • SMS ChatGPTボット-このプロジェクトでは、ChatGPTとOpenAI APIを使ってメッセージを送受信するSMSチャットボットを作成します。

本日のブログ記事では メッセージングのユースケース.さっそく始めましょう!

はじめに

訪問 コード・ハブにアクセスし、ソリューション・リストをスクロールしてユーザー・インターフェースに慣れてください。特定のものが必要な場合は、ページ中央の検索機能をご利用ください。また、サインインやサインアップがお済みでなければ、今が絶好の機会です。

Code Hub Main MenuCode Hub Main Menu

「SMS ChatGPTボット」使用例ウォークスルー

ブラウザを SMSチャットテンプレートに向かってください。この一般的な使用例が最初の例となります。

SMS ChatGPT BotSMS ChatGPT Bot

各タブの機能をおさらいしよう:

  • 概要- このサンプルが何を目指しているのか、どのように始めるのかを簡単に説明します。

  • コードを取得- Visual Studio Codeのブラウザ版を使用して、コードを試し、変更を加え、即座にデプロイすることができます。

  • コードのデプロイ- アプリケーションをデプロイし、動作を確認することができます。

まず、サインインしたら コードのデプロイ]、[デプロイnew** **インスタンス。

以下の項目を入力してください:

  • 地域- お近くの地域をお選びください。

  • インスタンス名- ニックネームをつける

  • ボンテージ番号- プロジェクトに番号を割り当てる

  • OpenAI APIキー- OpenAI API から取得するキーです。

Project DeploymentProject Deployment

最後に をクリックします、をクリックすると、デプロイが開始されます。その後、ステータスが 実行中です、であることを確認し 起動ボタンを押してください。

Chatbot RunningChatbot Running

また、以下のオプションもある。 ログの表示オプションもあります。

アプリケーションの起動

をクリックしてください。 起動.新しいブラウザ・ウィンドウが表示され、以下の内容が表示されます:

Launch AppLaunch App

有効なOpenID APIを入力したと仮定して、質問と一緒に番号をテキスト入力すると、答えが返されます。例えば、"Vonage本社はどこですか?"などと入力してみてください。

サンプルを編集する(あなたのブラウザで!)

サンプルのデプロイに成功したので、コードを変更して即座にデプロイし、変更をライブで確認してみましょう。をクリックして コードを取得をクリックし 新しい開発環境を作成する.ワークスペースを設定する必要があるので、要求された情報を入力して をクリックします。.

これで、Visual Studio Codeのプロジェクトがブラウザの中に表示されます。

Edit in your BrowserEdit in your Browser

まず README.md,には、サンプルの実行方法に関する重要な情報が含まれています。

ソースファイル(index.jsなど)のひとつに移動すれば、コードを修正して試すことができる。

自由に弄って変更してください。例えば、index.jsの98行目では、ハードコードされた "ChatGPT: "文字列を削除し、ChatGPTが送り返したものだけを返信することができます。

まとめ

私たちは、お客様がこのツールをどのように使用されるかを楽しみにしています。お気軽に ドキュメントをご覧ください。また、ご質問やフィードバックがありましたら Vonage開発者向けSlackに参加するか ツイッターをお送りください。また次回もお楽しみに!

シェア:

https://a.storyblok.com/f/270183/400x400/7cdff37c0e/michael-crump.png
Michael Crumpデベロッパー・エクスペリエンス・マネージャー

マイケル・クランプはVonageのデベロッパーエクスペリエンスチームに所属し、コーダー、YouTuber、そして様々な.NETやクラウド/通信開発トピックについて頻繁に講演を行っています。彼は、開発者がそれぞれの利点を分かりやすく理解できるようにすることに情熱を注いでいます。