scira-mcp-chat MCP — ユースケース, インストール & ライブデモ

なぜ使うのか

主な機能

Open-source Next.js chat UI — self-host anywhere
Multi-provider LLM via Vercel AI SDK (OpenAI, Anthropic, Google, etc.)
Add MCP servers via UI (HTTP / SSE transport)
Reasoning model support — renders thinking traces
Built with shadcn/ui + Tailwind — easy to theme / fork

ライブデモ

実際の動作

scira-mcp-chat.replay ▶ 準備完了

0/0

インストール

クライアントを選択

~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "scira-mcp-chat": {
      "command": "npx",
      "args": [
        "-y",
        "scira-mcp-chat"
      ],
      "_inferred": true
    }
  }
}

Claude Desktop → Settings → Developer → Edit Config を開く。保存後、アプリを再起動。

~/.cursor/mcp.json · .cursor/mcp.json

{
  "mcpServers": {
    "scira-mcp-chat": {
      "command": "npx",
      "args": [
        "-y",
        "scira-mcp-chat"
      ],
      "_inferred": true
    }
  }
}

Cursor は Claude Desktop と同じ mcpServers スキーマを使用。プロジェクト設定はグローバルより優先。

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "scira-mcp-chat": {
      "command": "npx",
      "args": [
        "-y",
        "scira-mcp-chat"
      ],
      "_inferred": true
    }
  }
}

Cline サイドバーの MCP Servers アイコンをクリックし、"Edit Configuration" を選択。

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "scira-mcp-chat": {
      "command": "npx",
      "args": [
        "-y",
        "scira-mcp-chat"
      ],
      "_inferred": true
    }
  }
}

Claude Desktop と同じ形式。Windsurf を再起動して反映。

~/.continue/config.json

{
  "mcpServers": [
    {
      "name": "scira-mcp-chat",
      "command": "npx",
      "args": [
        "-y",
        "scira-mcp-chat"
      ]
    }
  ]
}

Continue はマップではなくサーバーオブジェクトの配列を使用。

~/.config/zed/settings.json

{
  "context_servers": {
    "scira-mcp-chat": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "scira-mcp-chat"
        ]
      }
    }
  }
}

context_servers に追加。保存時に Zed がホットリロード。

claude mcp add scira-mcp-chat -- npx -y scira-mcp-chat

ワンライナー。claude mcp list で確認、claude mcp remove で削除。

ユースケース

実用的な使い方： scira-mcp-chat

Self-host an MCP-enabled chat UI for your team

👤 Small teams wanting ChatGPT-like UX with tools ⏱ ~60 min intermediate

使うタイミング： You want internal chat with MCP tools without paying per-seat for Claude Pro / ChatGPT Team.

前提条件

Node 20+ and Postgres — Vercel / Docker / self-hosted
LLM API keys — At least one of OpenAI / Anthropic / Google

フロー

Clone and deploy

Walk me through self-hosting scira-mcp-chat on Vercel with Postgres via Supabase.✓ コピーしました

→ Deployed URL + DB connected
Add MCP servers

In the settings UI, add Composio's HTTP endpoint for Slack + GitHub.✓ コピーしました

→ Tools visible in the chat
Share with team

How do I put this behind basic auth or SSO?✓ コピーしました

→ Next-Auth or proxy config suggestion

結果： A private chat UI with tools, way cheaper than per-seat SaaS.

注意点

Keys stored per-user or globally? Depends on fork — Review auth/settings flow before putting real credentials in

Experiment with many MCP servers without editing config files

👤 MCP tinkerers / reviewers ⏱ ~30 min beginner

使うタイミング： You want to evaluate 10 different MCP servers this weekend without modifying Claude Desktop config repeatedly.

フロー

Add servers one at a time

In the settings UI, paste the HTTP/SSE URL for each MCP server you want to try.✓ コピーしました

→ Tools list updates live
Test each

Use tool X with input Y. Report back.✓ コピーしました

→ Call + response visible

結果： Rapid MCP evaluation without restart cycles.

注意点

stdio-only MCPs can't be used directly — Wrap them via a stdio-to-HTTP bridge or run via Smithery which hosts them

組み合わせ

他のMCPと組み合わせて10倍の力を

scira-mcp-chat + filesystem + fetch + github

DIY Claude Desktop replacement

Add filesystem (via HTTP wrapper), fetch, and github MCPs in the settings. Use as daily driver.✓ コピーしました

ツール

このMCPが提供する機能

ツール	入力	呼び出すタイミング	コスト
(web UI)	Natural chat	This is the chat UI itself — not an MCP to be called from another client	LLM provider cost

コストと制限

運用コスト

APIクォータ: Your LLM provider's rate limits
呼び出しあたりのトークン: Pass-through to the model
金額: Self-hosting = just infra cost. LLM = pay-as-you-go. MCP providers (Composio etc.) have their own tiers.
ヒント: Use DeepSeek or Gemini Flash as the default model for team chat — 10-100x cheaper than GPT-4.

セキュリティ

権限、シークレット、影響範囲

認証情報の保管： API keys in env vars (self-host) or user settings (multi-user mode)

データ送信先： Your LLM provider + whichever MCP servers you add

絶対に付与しない： Unauthenticated public deployment — your LLM keys will get drained

This is a web app MCP *client*, not an MCP server. You can't add it to Claude Desktop.
Review auth before exposing on the internet — defaults may allow anyone to use your keys.

トラブルシューティング

よくあるエラーと対処法

Build fails on deploy

Next.js version mismatch — use the Node version in .nvmrc.

確認： node --version

Added MCP server, no tools appear

Transport mismatch. HTTP URL must return the MCP handshake; SSE URL must keep the stream open.

確認： curl the URL and inspect

DB connection errors

DATABASE_URL format: postgres://user:pass@host:5432/db?sslmode=require

確認： psql $DATABASE_URL

代替案

scira-mcp-chat 他との比較

代替案	代わりに使う場面	トレードオフ
LibreChat	You want a more mature, feature-rich chat UI	Heavier; MCP support via plugins
Open WebUI	You want native MCP 0.6.31+ support and Ollama integration	More complex but batteries-included
Claude Desktop / Claude Code	You only use Anthropic and want zero infra	Paid; single-user

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

🔍 400以上のMCPサーバーとSkillsを見る