Google の OSS で Gemini API を使った自作 deep research：「gemini-fullstack-langgraph-quickstart」を動かしてみる

## はじめに

Googleさんが OSS で公開した、Gemini API を使って自作 deep research ができる「gemini-fullstack-langgraph-quickstart」を試した流れのメモです。
数日前に以下のポストで見かけて、そこから試しはじめたものです。

https://x.com/OfficialLoganK/status/1930091068130783336

https://x.com/youtoy/status/1930279046895808771



### gemini-fullstack-langgraph-quickstart

上記のポストに書かれていたのは、↓こちらのページです。

●google-gemini/gemini-fullstack-langgraph-quickstart: Get started with building Fullstack Agents using Gemini 2.5 and LangGraph
　https://github.com/google-gemini/gemini-fullstack-langgraph-quickstart
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/3c23e734-4183-455f-9a73-dcd19377ac86.png)

#### 特徴

ページ内を見ていくと、以下の特徴があると書かれていました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/1d038650-ae1b-4434-adfc-af5204fea526.png)

個人的には、特にこのあたりが気になったところでした。

- 🔍 Dynamic search query generation using Google Gemini models.
- 🌐 Integrated web research via Google Search API.
- 🤔 Reflective reasoning to identify knowledge gaps and refine searches.
- 📄 Generates answers with citations from gathered sources.


#### 要件

試すための要件は、以下になるようです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/0cfa75e9-c814-4ed0-9ae0-1010d0ddf6c2.png)

この後の手順で、Gemini の APIキーを設定するところと、npmコマンド・pipコマンドを使うところが出てきます。


## さっそく試す

### 下準備

上で書かれていた、APIキーの準備をします。

上記では .envファイルでキーを設定する方法が書かれていましたが、自分はコマンドを使うやり方で、一時的に APIキーを設定した環境変数 GEMINI_API_KEY を使えるようにしました。


### バックエンド・フロントエンドのそれぞれの準備

さっそく試していきます。まずはリポジトリのファイルをローカルにもってきます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/4b93080b-5723-4701-99ae-d0f25cd8b928.png)


そして、バックエンド・フロントエンド用のフォルダへ移動して、それぞれ pip コマンド・npmコマンドを実行していきます。そして、 `make dev` を実行します。


フォルダ移動とコマンド実行を連続して進めていくと、以下のような感じです。


```zsh
cd backend
pip install .

cd ../frontend
npm i

cd ..
make dev
```


上記の最後のコマンドを実行した後の状態は、以下のとおりです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/7313937d-1386-416b-9e8a-b072d682f4fc.png)

`127.0.0.1` 、 `localhost` といったアドレスが表示されており、ローカルでサーバーが立ち上がったことが分かります。以下ｈ、上記のキャプチャ画像で表示されている内容のテキスト版です。

```txt
% make dev

Starting both frontend and backend development servers...
Starting backend development server...
Starting frontend development server...

> frontend@0.0.0 dev
> vite


  VITE v6.3.4  ready in 954 ms

  ➜  Local:   http://localhost:5173/app/
  ➜  Network: use --host to expose
INFO:langgraph_api.cli:

        Welcome to

╦  ┌─┐┌┐┌┌─┐╔═╗┬─┐┌─┐┌─┐┬ ┬
║  ├─┤││││ ┬║ ╦├┬┘├─┤├─┘├─┤
╩═╝┴ ┴┘└┘└─┘╚═╝┴└─┴ ┴┴  ┴ ┴

- 🚀 API: http://127.0.0.1:2024
- 🎨 Studio UI: https://smith.langchain.com/studio/?baseUrl=http://127.0.0.1:2024
- 📚 API Docs: http://127.0.0.1:2024/docs

This in-memory server is designed for development and testing.
For production use, please use LangGraph Cloud.
```


### 用意された Webサイト： 自動で開く Webサイト

上記の画面が出た後、ブラウザで以下のページが開きました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/c0931ba8-ae9d-4e85-9f91-e45d72b85d51.png)

画面上部には、以下の表示も出ています。

> Not seeing LangSmith runs?
It looks like your LangSmith API key is missing. Please make sure to add LANGSMITH_API_KEY to your local server's .env file.

以下の [LangSmith](https://smith.langchain.com/)の APIキーに関する内容ですが、今回 deep research的なことを試すのには必須ではなさそうだったので、ひとまずここはスキップします。

●Create an account and API key | 🦜️🛠️ LangSmith
　https://docs.smith.langchain.com/administration/how_to_guides/organization_management/create_account_api_key



### 用意された Webサイト： 検索をするための Webサイト

上で make dev を実行した後の表示に出てきていた「 http://localhost:5173/app/ 」というアドレスにブラウザでアクセスします。

そうすると、以下のページが開きました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/18178f8d-9150-4aca-aedd-33c6b3264aa9.png)

あとは検索を試すだけ、だったはずだったのですが・・・

#### コードの修正

上記の画面から検索を試してみても、処理が途中で止まったような感じになっていました。

ここまで試してみていた数日後、[X での @currypurin さんのポスト](https://x.com/currypurin/status/1932196244480487776)で以下の内容を見かけて、このコードの修正を試してみました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/1404f9d0-86c7-47f1-9116-6f2f3aebbf21.png" width=75%>



上記で「修正後」として書かれている部分を、以下にテキストで掲載します。

```typescript
: `Need more information, searching for ${
event.reflection.follow_up_queries?.join(", ") || "additional queries"
}`,
```

その結果、無事にこの後に掲載している結果を得ることができました。


#### 出力結果の冒頭・末尾の部分

上記のコードの修正をした後、make dev を実行してから「 http://localhost:5173/app/ 」に再度アクセスしました。

そして検索を試して得られた結果は、以下のとおりです（こちらは、出力結果の冒頭・末尾の部分のみです）。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/2497b72d-9fa2-4e4c-be17-f045832fb2b5.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/1570691a-78bf-4365-875a-02062e4108de.png)


以下に出力されたテキスト全体を掲載してみます（そのまま出力を貼り付けています）。Appleさんのイベントで発表されたばかりの内容を取得してくれているようです。


#### 出力結果のテキスト全体

AppleのWorldwide Developers Conference (WWDC) 2025は、2025年6月9日に開催され、以下の主要な発表がありました。

*   **新しいデザイン言語「Liquid Glass」**
    *   iOS、iPadOS、macOS、watchOS、tvOS、CarPlayを含むAppleのオペレーティングシステム全体に「Liquid Glass」と呼ばれる新しいデザイン言語が導入されます [youtube] [acs] [economictimes]。これは2013年のiOS 7以来の主要なデザイン変更です [acs]。
    *   Liquid Glassは、Apple Vision ProのvisionOSにインスパイアされた、洗練された半透明性とガラスのような光沢を特徴としています [economictimes]。ライトモードとダークモードに適応し、リアルタイムレンダリングを使用して動きに動的に反応します [economictimes]。
    *   ボタン、スライダー、メディアコントロール、タブバー、サイドバー、ツールバー、ナビゲーション要素に実装されます [economictimes]。
    *   開発者向けには、SwiftUI、UIKit、AppKitの標準コンポーネントが自動的にLiquid Glassを採用します [apple] [patentlyapple] [appleinsider] [youtube] [gizmologi]。最新のXcodeとSDKでビルドすることで変更を確認できます [apple] [patentlyapple] [appleinsider] [youtube] [gizmologi]。Icon Composerを使用してLiquid Glassアイコンを作成できます [apple] [patentlyapple] [appleinsider] [youtube] [gizmologi]。

*   **OSの統一名称**
    *   オペレーティングシステムに年ベースの統一命名基準が採用されます [engadget]。新しいバージョンは、iOS 26、iPadOS 26、macOS Tahoe、watchOS 26、visionOS 26となります。

*   **Apple Intelligenceの強化**
    *   新しいApple Intelligence機能がiPhone、iPad、Mac、Apple Watch、Apple Vision Proに搭載されます [apple]。
    *   **ライブ翻訳:** Messages、FaceTime、電話通話で、ライブ翻訳されたキャプションを使用して言語を超えたコミュニケーションが可能になります [thehindu]。この機能はサードパーティ開発者も通信アプリで使用できるAPIとして提供されます [apple]。
    *   **ビジュアルインテリジェンス:** 画面上の情報でより多くのことができるように強化されます [youtube] [apple] [economictimes]。視覚的に類似した画像や製品をアプリ全体で検索できます [economictimes]。iOS 26は検出されたイベントをカレンダーに追加することを提案します [economictimes]。開発者はApp Intentsを使用して、アプリの検索機能をビジュアルインテリジェンス体験に統合できます [apple] [youtube] [ibm]。
    *   **ショートカット連携:** ショートカットがApple Intelligenceに直接アクセスできるようになります [apple]。
    *   **開発者向けアクセス:** Apple Intelligenceの中核にあるオンデバイス大規模言語モデルに開発者がアクセスできるようになります [apple] [youtube]。Foundation Models frameworkを通じて提供され、プライバシーを保護し、オフラインでも動作するAI機能の開発を可能にします [apple] [macstadium] [macrumors] [pcmag] [pureai] [ibm] [youtube] [beebom] [hindustantimes]。モデルサイズは30億パラメータで、2ビットに量子化されています [reddit] [apple] [youtube]。Swiftでのネイティブサポートがあり、数行のコードでモデルにアクセスできます [pcmag] [apple] [pureai]。ツールコーリングもサポートされます [reddit] [macrumors] [pureai] [youtube]。

*   **iOS 26**
    *   **電話アプリ:** レイアウトオプションの統一、コールスクリーニング機能（通話前に発信者がメッセージを残す）、ホールドアシスト（保留音を検知して応答を待つ）が追加されます。
    *   **メッセージ:** 会話ごとのカスタム背景、スパムフィルタリング、グループメッセージのテキストバブルインジケーター、投票、グループチャットでのApple Cashサポートが追加されます [youtube]。
    *   **ゲームアプリ:** 新しい専用の「Games」アプリが追加されます [cnet]。
    *   **写真アプリ:** 新しいLibraryタブとCollectionsタブが追加されます [youtube] [cnet] [macrumors]。
    *   **ロック画面:** 時間表示が利用可能なスペースに流動的に適応します [youtube]。

*   **iPadOS 26** [apple] [acs]
    *   **新しいウィンドウシステム:** マルチタスクを改善する新しいウィンドウシステムが導入されます [cnet]。フルスクリーンアプリをウィンドウにリサイズするためのグラブハンドルや、タイル表示にするためのフリックジェスチャーが追加されます [cnet]。Stage Managerと統合されます [cnet] [thetechportal]。
    *   **メニューバー:** デスクトップOSのように、画面上部に永続的なメニューバーが表示されます [cnet]。開発者はこのメニューバーをカスタマイズできます [gsmarena]。
    *   **ファイルアプリ:** 改良されます。リストビューの更新、列のリサイズ、フォルダの折りたたみ、フォルダのカスタマイズオプションが追加されます [apple]。フォルダをDockにドラッグして素早くアクセスすることもできます [tomsguide] [gsmarena]。
    *   **Previewアプリ:** macOSで人気のPreviewアプリがiPadOSに登場します [cnet]。
    *   **Background Tasks API:** 長時間実行タスクを可能にするAPIが更新され、Live Activitiesで実行中のタスクを明確に表示できます [gsmarena] [apple] [9to5mac] [gadgets360]。
    *   **Exposé:** macOSから取り入れられた機能で、開いている全てのウィンドウを一覧表示して簡単に切り替えられます [gsmarena] [xda-developers]。

*   **macOS Tahoe** [engadget]
    *   **Liquid Glassデザイン:** より多くのカスタマイズオプションを備えた更新された外観になります [youtube] [ign] [economictimes] [thehindu]。メニューバーは完全に透明になります [youtube] [engadget] [thehindu]。
    *   **電話アプリ:** 電話アプリがMacに登場し、履歴の共有や新しいAI機能が利用できます [cnet]。
    *   **Live Activities:** ContinuityにLive Activitiesが追加されます [cnet]。
    *   **ショートカット:** テキストの要約や比較などのインテリジェントなアクションが可能になります [cnet]。
    *   **Spotlight:** 結果を様々なタイプで混ぜて表示するなどの機能が追加されます [cnet]。
    *   macOS Tahoeは、Appleが将来的にセルラー接続を備えたMacを販売する可能性を示す新しい証拠を提供します [engadget]。

*   **watchOS 26**
    *   **Workout Buddy:** AIを使用してトレーニング負荷とワークアウト履歴を認識し、身体活動を奨励する新機能です [ign]。励ましのためのダイナミックな音声が含まれます。
    *   **Smart Stacks:** よりスマートなSmart Stacksになります。
    *   **通知:** 周囲の騒音に基づいて音量を調整する、よりスマートな通知になります [cnet]。
    *   **Wrist Flickジェスチャー:** 通知を閉じるためのWrist Flickジェスチャーが追加されます [cnet]。

*   **tvOS**
    *   Apple TV PlusとtvOSのデザインが刷新されます [cnet]。
    *   **カラオケ:** iPhoneをマイクとして使用できる統合カラオケ機能が追加されます [cnet]。
    *   **FaceTimeアプリ:** FaceTimeアプリのデザインが刷新されます。

*   **CarPlay** [apple] [engadget]
    *   **ウィジェットとLive Activities:** iPhoneのウィジェットとLive ActivitiesがCarPlayで動作します [youtube] [youtube]。
    *   **CarPlay Ultra:** 重要な情報のレイアウトとデザインを選択でき、車両コントロールが追加されます [youtube] [youtube]。

*   **Vision Pro** [youtube]
    *   visionOS 26にPSVR 2コントローラーサポート、ウィジェットなどが追加されます [ign] [youtube]。

*   **その他の重要な点**
    *   新しいオペレーティングシステムの開発者向けベータ版は現在利用可能で、パブリックベータ版は7月に提供開始予定です [ign] [cnet] [macrumors]。一般向けリリースは秋に予定されています [ign] [youtube] [youtube]。
    *   Appleは、開発者がアプリで利用できるよう、オンデバイスの基盤モデルへのアクセスをFoundation Models frameworkを通じて開放しています [economictimes] [apple] [macrumors] [youtube]。
    *   Appleは、新しいAI機能においてプライバシーとオンデバイス処理を重視しています [apple] [youtube] [economictimes]。
    *   前年から主要なApple Intelligence機能の展開が遅れていることに対する顧客の不満が報告されています [thehindu]。
    *   Apple Intelligence機能は、この秋に、対応デバイスでサポートされている言語に設定されているユーザーが利用できるようになります [apple] [youtube] [ibm] [hindustantimes]。対応デバイスには、全てのiPhone 16モデル、iPhone 15 Pro、iPhone 15 Pro Max、iPad mini (A17 Pro)、M1以降を搭載したiPadおよびMacモデルが含まれます [apple] [youtube] [ibm]。対応言語には、英語、フランス語、ドイツ語、イタリア語、ポルトガル語（ブラジル）、スペイン語、日本語、韓国語、中国語（簡体字）が含まれ、年末までにさらに多くの言語が追加される予定です [apple]。
    *   Xcode 26にはChatGPTが組み込まれており、開発者はフローを離れることなくコードの記述、修正、デバッグが可能です [ibm] [pureai]。


## おわりに

Googleさんが OSS で公開した、自作 deep research ができる「gemini-fullstack-langgraph-quickstart」を動かしてみました。

とりあえず軽く試した感じでは、無料枠の Gemini API で上記のような出力をサクッと得ることができ、さらに試していきたくなりました。

他の内容での検索や、得られた検索結果を活用した処理なども、別途試していければと思います。