Tech Mentor (Nodi)

トレーニングコース向けのテクノロジー教育用ミニエージェント。単一のツールのラボを満たします。Claude が consultar_conocimiento_tech をいつ呼び出すかを決定し、Node がローカルの Markdown コーパス (RAG) に対して実行します。チャットはテキストまたは音声で、アバターが短い要約を読み上げ、パネルに各リクエストへの応答方法が表示されます。

テクノロジーのトピックのみを扱います。それ以外は拒否され、トピックにリダイレクトされます。

オンラインデモ: https://tecno-chatbot-portal.vercel.app
ローカル: npm run dev → http://localhost:3000

アーキテクチャ

Navegador (Next.js)
  │  texto o Web Speech (STT, Chrome)
  │  POST /api/chat  { messages }  →  stream NDJSON
  ▼
API route (servidor, Node)
  │  ANTHROPIC_API_KEY (nunca llega al cliente)
  │  Claude Haiku: system prompt + tools
  │  loop de tool_use
  ▼
consultar_conocimiento_tech  (única tool)
  │  búsqueda léxica en knowledge/*.md
  ▼
stream de la respuesta  →  Markdown + infografía + temas
  │
  ▼
Web Speech TTS  →  avatar lee el resumen

MCP や別のバックエンドはありません。ラボでは1つの関数が要求されました。コーパスは knowledge/ にあります。

Related MCP server: docrag

コースの内容

インターフェース

• イラストの女性アバター (上部固定): まばたきをし、ジェスチャーをし、話すと口が動きます。

• Nodi の応答方法: 10 個のノードが点灯します (入力、API ルート、プロンプト、モデル、ツール、RAG、作成、ストリーミング、レンダリング、音声)。モバイルではパネルは折りたたまれます。

• Markdown での応答 (リスト、コード、太字)。

• トピックに応じて、手順、比較、概念のインフォグラフィック。

• 各応答の最後に、クリック可能な関連トピックが 3〜5 件。

• マイク (Chrome) とシステム TTS は追加料金なし。

要件

• Node.js 20+

• Anthropic / Claude のキー

実行方法

npm install
cp .env.example .env.local
# Edita .env.local y pega ANTHROPIC_API_KEY
npm run dev

http://localhost:3000 を開きます。

npm test
npm run build

推奨テスト

1. 「RAG とは何ですか?」→ ツールを使用してコーパスを引用します。

2. 「15分ありますが、Git で何を練習しますか?」→ 教材の演習。

3. 「ITIL とは何ですか?」→ ツールを呼び出します。RAG は 結果なし とマークでき、Claude は (インターネットを装わずに) 同様に応答します。

4. 「ラザニアのレシピを教えて」→ ツールなしで拒否。

5. 関連トピックのチップ → あなたの質問として送信されます。

6. Chrome のマイク → 文字起こしして送信します。

7. アバターが要約を読み上げます (ブラウザによっては事前のクリックが必要な場合があります)。

制限 (意図的)

• 小規模で厳選されたコーパス。

• Chrome での音声入力。 Edge、Brave、Firefox、Arc は (「network」で) 失敗することがよくあります。認識はこのアプリではなくベンダーのサービスであるためです。テキストは常に機能します。

• Web 検索はありません。存在しないソースをシミュレートしないように、インターネットノードは削除されました。

• インフォグラフィックは、有料サービスの画像ではなく、モデルからの構造化データで描画されます。

• イラストのアバターであり、フォトリアルなリップシンクではありません。

• ログインやサーバー上の履歴はありません。

Vercel に公開する (オプション)

Vercel は Next.js を作成している会社のホスティングです。リポジトリをアップロードすると、彼らがアプリをビルドし、誰でも開ける URL https://….vercel.app が発行されます。同じコードです。ノートパソコンの電源を入れておく必要はありません。

手順 (このリポジトリですでに完了): プロジェクトは ANTHROPIC_API_KEY を使用して Vercel にあります。URL: https://tecno-chatbot-portal.vercel.app。

手動で再公開するには: npx vercel --prod。git push のたびに自動デプロイするには、Vercel ダッシュボードで GitHub を接続する必要があります (GitHub とのログイン接続)。

無料のものと有料のもの