Node.js/TypeScriptアプリでRivetを実行する方法
目次
- 導入
- rivetとは?
- rivetの特徴
- rivetを別のアプリケーションに統合する方法
- rivet例題リポジトリのクローン
- リポジトリのセットアップ
- rivetのデバッガーへの接続
- チャットボットの動作確認
- rivetプロジェクトの構造
- チャットボットの改善
rivetを別のアプリケーションに統合する方法
これはrivetを別のアプリケーションのローカル環境に統合する方法についてのチュートリアルです。rivetはオープンソースのビジュアルAIプログラミング環境であり、大規模な言語モデルを使用したAIエージェントのプログラミングを非常に楽しくするものです。しかし、実際にこれらのAIエージェントを作成する際に重要な部分は、通常は別のアプリケーションの環境に適合する必要があるということです。私たちは、rivetを別のアプリケーションに統合するための小さなおもちゃのチャット例を作成し、非常に基本的なステップから始めます。まず、このリポジトリをクローンしましょう。以下の手順に従ってください。
- リポジトリのクローン
$ git clone https://github.com/Ironclad/rivet-example.git
$ cd rivet-example
- npmのインストール
$ npm install
- OpenAI APIキーのエクスポート
$ export OPENAI_API_KEY=your_api_key
- アプリケーションの起動
$ npm start
これで、チャットアプリケーションが起動します。"hi there, how can I help you today?"というメッセージが表示されます。このチャットアプリケーションは、計算やゲームのプレイ、一般的なチャットなど、いくつかのことができるようになっています。さて、実際にこのチャットボットがどのように動作するかを見てみましょう。
チャットボットの動作確認
まず、rivetのプロジェクトを開きます。リポジトリのフォルダ内にあるchat.rivet
プロジェクトを開きます。そこには、メイングラフである初期のチャットグラフと、3つのノードがあります。また、メッセージが入力として流れ込み、左から右にフローしていく構造も確認できます。さあ、デバッガーを接続しましょう。チャットアプリケーションの上部にあるデバッガーのURLをコピーし、rivetで接続します。次に、"what's the weather like?"と入力してみましょう。rivetのプロジェクトを見ると、メッセージの入力と、スキルの選択が行われていることが分かります。さあ、チャットボットの応答を見てみましょう。
[チャットボットの応答例]
ユーザー: what's the weather like?
チャットボット: I apologize but I don't have the ability to provide real-time weather information.
このように、チャットボットはリクエストに応じて適切な応答を返すことができます。また、計算を行うこともできます。例えば、"1+5*6"と入力してみましょう。
ユーザー: 1+5*6
チャットボット: 31
計算結果が表示されます。これにより、チャットボットとの対話を通じて実行できるさまざまな操作が確認できます。さらに進んで、アプリケーションとの統合についての詳細を見てみましょう。
rivetプロジェクトの構造
rivetプロジェクトの構造を確認しましょう。リポジトリのルートフォルダには、クライアントサイドのアプリケーションがありますが、それについては詳細に触れません。rivetのインタラクションのほとんどは、サーバーサイドで行われます。まず、Package.json
ファイルに注目します。rivetノードに依存関係があることが分かります。また、Source/Services/rivetRunner
フォルダにも注目してください。ここがrivetとのほとんどのインタラクションを行う場所です。次に、chat.project
ファイルからプロジェクトをロードし、グラフを実行するためのコードが書かれていることに注目します。
さらに、外部関数を動的に定義する方法についても見てみましょう。calculate
関数は、llmが抽出した計算式を受け取り、数値として計算し、rivetのコンテキストに結果を返すものです。外部の関数呼び出しは、ローカルで実行されるアプリケーションの環境で定義されています。これにより、エージェントが直接アプリケーションと対話することができます。また、プロジェクトをファイルから動的にロードしているため、リアルタイムで変更を保存して反映させることも可能です。
チャットボットの改善
最後に、チャットボットの改善について見てみましょう。今回は、ゲームのプレイに少し改善を加えてみます。まず、Prompt
を変更して、ユーザーが操作プロセスを説明するようにしてみましょう。次に、実際の計算結果も表示してみます。これには、extract with regex
ノードを使って数式を抽出し、外部関数に渡すことが必要です。これらの変更を加えた後、プロジェクトを保存して実行しましょう。
以下の例では、GPT4を使用しているため、改善された結果が表示されるかどうか確認しています。計算結果が24になるように変更を加えましたが、まだ理想的な結果には至っていません。しかし、このようにプロジェクトを動的に変更することで、チャットボットの機能を向上させることができます。
[改善されたチャットボットの応答例]
ユーザー: play 24
チャットボット: 26 (正解ではありません)
以上で、rivetの別のアプリケーションへの統合についてのチュートリアルは終わりです。今回はリポジトリのダウンロードから始め、セットアップ、デバッガーへの接続、チャットボットの改善までをカバーしました。次回のチュートリアルでは、プロジェクトのさまざまな機能のセットアップ方法について取り上げます。rivetの可能性を最大限に活用してください!