Gemini Fullstack LangGraph: GeminiとLangGraphをベースとした知的研究用フルスタックアプリケーション

gemini-fullstack-langgraph-quickstart Googleによるオープンソースのサンプルプロジェクトで、GoogleのGeminiモデルとLangGraphフレームワークを使用して、フルスタックのインテリジェントな研究アプリケーションを構築する方法を示しています。フロントエンドはReactを使ってユーザインタフェースを提供し、バックエンドはLangGraphを利用したインテリジェントエージェントによって複雑なリサーチタスクを実行します。このプロジェクトは、ユーザ入力に基づいて検索クエリを生成し、Google検索APIを通じてウェブページ情報を取得し、情報のギャップを分析し、繰り返し最適化し、最後に引用を含む詳細な回答を出力します。このプロジェクトは、大規模な言語モデルとオープンソースのフレームワークを組み合わせて、動的な調査と対話をサポートするAIアプリケーションを構築する方法を学ぶ開発者に適している。透明性の高いリサーチ・プロセスを重視しており、詳細なリサーチや情報の検証を必要とするシナリオに適している。

機能一覧

• 動的クエリ生成ジェミニのモデルは、ユーザーの入力に基づいて、関連性のある検索クエリを生成する。
• ウェブ情報検索Google Search APIでリアルタイムのウェブデータを取得。
• 反射と最適化エージェントは検索結果を分析し、情報のギャップを特定し、クエリを繰り返し最適化します。
• 回答の総合と引用収集した情報を統合し、ウェブ引用による詳細な回答を作成する。
• フルスタックアーキテクチャReactフロントエンドがインタラクティブなインターフェースを提供し、FastAPIバックエンドが複雑なロジックを処理します。
• コマンドライン研究コマンドラインから単一のリサーチタスクを素早く実行できるようになりました。
• リアルタイム・ストリーミング出力Redisを使ったバックグラウンド・タスクのためのリアルタイム・データ・ストリーミング。
• 状態の持続性Postgresデータベースはエージェントの状態、スレッド、長期メモリを保存します。

ヘルプの使用

設置プロセス

使用方法gemini-fullstack-langgraph-quickstartこのため、以下のインストール手順を完了し、環境が正しく設定されていることを確認する必要がある。以下は、詳細なインストールとランタイムのガイドです：

1. プロジェクト・ウェアハウスのクローン
   ターミナルで以下のコマンドを実行し、プロジェクトをローカルにクローンする：

   git clone https://github.com/google-gemini/gemini-fullstack-langgraph-quickstart.git
   cd gemini-fullstack-langgraph-quickstart
   

2. APIキーの取得
   • ジェミニAPIキーアクセスグーグルAIスタジオをクリックし、Gemini APIキーを登録して生成します。
   • ラングスミスAPIキー(オプション）：アクセスラングスミス公式サイトデバッグや観測のためにキーを登録し、生成する。
3. 環境変数の設定
   入るbackendディレクトリを作成します。.envファイルを開き、APIキーを追加する：

   cd backend
   echo 'GEMINI_API_KEY="YOUR_ACTUAL_API_KEY"' > .env
   echo 'LANGSMITH_API_KEY="YOUR_ACTUAL_LANGSMITH_API_KEY"' >> .env
   

   そうしれいかんYOUR_ACTUAL_API_KEYを実際のGemini APIキーに置き換える。YOUR_ACTUAL_LANGSMITH_API_KEYLangSmithキー（使用されている場合）と交換する。

4. バックエンドの依存関係のインストール
   あるbackendディレクトリに、Pythonの依存関係をインストールする：

   pip install .
   

   Pythonのバージョンが3.8以上であること、およびpip正しいバージョンを指す。

5. フロントエンドの依存関係をインストールする
   プロジェクトのルート・ディレクトリに戻りfrontendディレクトリで、Node.jsの依存関係をインストールする：

   cd ../frontend
   npm install
   

6. 開発サーバーの実行
   • フロントエンドとバックエンドを同時に走らせるプロジェクトのルート・ディレクトリで以下のコマンドを実行して、フロントエンドとバックエンドの開発サーバーを起動します：

     npm run dev
     

     フロントエンドはデフォルトでhttp://localhost:5173/appバックエンドAPIはhttp://127.0.0.1:2024.

   • 独立したバックエンドの実行でbackendディレクトリで実行する：

     langgraph dev
     

     これでバックエンド・サービスが起動し、LangGraph UIが開きます。

   • フロントエンドの単独走行でfrontendディレクトリで実行する：

     npm run dev
     

7. Dockerによるデプロイメント（オプション）
   Docker経由で実行したい場合は、まずDockerとDocker Composeをインストールする必要がある：

   docker build -t gemini-fullstack-langgraph -f Dockerfile .
   GEMINI_API_KEY=<your_gemini_api_key> LANGSMITH_API_KEY=<your_langsmith_api_key> docker-compose up
   

   アプリケーションが起動したらhttp://localhost:8123/appインターフェイスを見る。

機能 操作の流れ

1.ウェブ・インターフェイスによる調査

• フロントエンドへのアクセスブラウザを開き、次のサイトにアクセスする。http://localhost:5173/app.
• クエリーを入力する例：「2025年における再生可能エネルギーの最新動向」。
• 研究プロセスを見る送信後、インターフェイスは、クエリの生成、ウェブページの検索、結果の分析を含むエージェントの操作のすべてのステップを表示します。
• 回答を見る最終的な回答は、引用ページへのリンクを含むテキスト形式で表示されます。

2.コマンドラインによるクイックリサーチ

• あるbackendディレクトリで実行する：

  python examples/cli_research.py "你的研究问题"
  

• このエージェントは、試験結果と引用文献をエンドポイントで直接出力するので、迅速な検証に適している。

3.リアルタイム・ストリーミング出力

• このプロジェクトでは、バックグラウンド・タスクのリアルタイム出力を保証するために、Redisをパブリッシュ・サブスクライブ・ブローカーとして使用している。Redisをローカルにインストールし、実行されていることを確認する必要がある。
• Redisの設定.envファイルにRedisの接続情報を追加します（デフォルトはredis://localhost:6379).
• ストリーミング出力は、研究の進捗状況をウェブインターフェースや端末にリアルタイムで表示する。

4.データの永続性

• このプロジェクトでは、エージェントの状態とスレッド情報を保存するために Postgres を使用します。ローカルに Postgres をインストールし、接続を設定する必要があります：

  echo 'DATABASE_URL="postgresql://user:password@localhost:5432/dbname"' >> .env
  

• データベースは、長期的な記憶とステータス管理のために、各研究のコンテクストを記録する。

ほら

• エージェントはGoogle Search API経由でリアルタイムのデータを取得する必要があるため、インターネット接続が安定していることを確認してください。
• APIキーエラーが発生した場合は.envファイルが適切に設定されていることを確認する。
• このプロジェクトは多くのコンピューティングリソースを必要とするので、より性能の良いデバイスで実行することをお勧めします。

アプリケーションシナリオ

1. 学術研究
   研究者はこのアプリを使って、特定の分野の最新情報を素早く収集することができる。例えば、"recent advances in quantum computing "と入力すると、エージェントは関連するクエリーを生成し、学術リソースを検索し、信頼できる情報源へのリンクとともに回答を照合する。
2. ビジネスインテリジェンス分析
   ビジネスアナリストは、このツールを使って市場動向や競合他社の動向を調査することができます。例えば、「電気自動車市場の動向2025」と入力すると、詳細なレポートとデータソースが提供されます。
3. 教材
   生徒や教師は、このツールを使って情報をすばやく確認したり、授業で使う教材を準備したりすることができる。例えば、「気候変動の影響」と入力すると、教室での議論に適した引用を含む包括的な回答が表示されます。
4. 技術開発リファレンス
   開発者は、GeminiモデルとLangGraphフレームワークを組み合わせて同様の研究エージェントを構築する方法を学び、AI主導のアプリケーション開発を探求することができる。

品質保証

1. プロジェクトの実行に必要なAPIキーは何ですか？
   Gemini APIキーが必要で、Google AI Studioから入手できます。LangSmith APIキーはオプションで、デバッグと観察に使用されます。
2. エージェントの調査プロセスはどのように見ることができますか？
   ウェブインタフェースでは、クエリを送信した後、クエリ生成、ウェブ検索、リフレクションプロセスを含むエージェントの操作のすべてのステップがリアルタイムで表示される。
3. プロジェクトがサポートしているプログラミング言語は何ですか？
   バックエンドはPython（LangGraphとFastAPI）、フロントエンドはJavaScript（React）。
4. オフラインでの操作に対応していますか？
   エージェントはGoogle Search APIを通してライブウェブデータを取得する必要があるため、完全なオフライン操作はサポートされていません。