{"id":27629968,"url":"https://github.com/cgoinglove/mcp-client-chatbot","last_synced_at":"2025-04-23T16:16:53.747Z","repository":{"id":287739715,"uuid":"965636860","full_name":"cgoinglove/mcp-client-chatbot","owner":"cgoinglove","description":"🚀 Multi-provider AI chatbot client powered by MCP","archived":false,"fork":false,"pushed_at":"2025-04-22T15:57:13.000Z","size":7971,"stargazers_count":42,"open_issues_count":2,"forks_count":10,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-04-23T16:16:46.422Z","etag":null,"topics":["ai","chatbot","mcp","mcp-client","mcp-server","nextjs","ollama","vercel"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cgoinglove.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":"ROADMAP.md","authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-04-13T15:44:51.000Z","updated_at":"2025-04-23T06:15:53.000Z","dependencies_parsed_at":"2025-04-13T17:25:26.783Z","dependency_job_id":"ad1d2a8f-169b-467a-aeed-23cd94db49b2","html_url":"https://github.com/cgoinglove/mcp-client-chatbot","commit_stats":null,"previous_names":["cgoinglove/mcp-client-chatbot"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cgoinglove%2Fmcp-client-chatbot","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cgoinglove%2Fmcp-client-chatbot/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cgoinglove%2Fmcp-client-chatbot/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cgoinglove%2Fmcp-client-chatbot/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cgoinglove","download_url":"https://codeload.github.com/cgoinglove/mcp-client-chatbot/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250468276,"owners_count":21435453,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai","chatbot","mcp","mcp-client","mcp-server","nextjs","ollama","vercel"],"created_at":"2025-04-23T16:16:53.146Z","updated_at":"2025-04-23T16:16:53.739Z","avatar_url":"https://github.com/cgoinglove.png","language":"TypeScript","funding_links":[],"categories":["MCP Frameworks and libraries"],"sub_categories":["TypeScript"],"readme":"# MCP Client Chatbot: Local-First AI Assistant App\n\n**English** | [한국어](./docs/ko.md)\n\n[![Local First](https://img.shields.io/badge/Local-First-blueviolet)](#)\n[![MCP Supported](https://img.shields.io/badge/MCP-Supported-00c853)](https://modelcontextprotocol.io/introduction)\n\n**MCP Client Chatbot** is a versatile chat interface that supports various AI model providers like [OpenAI](https://openai.com/), [Anthropic](https://www.anthropic.com/), [Google](https://ai.google.dev/), and [Ollama](https://ollama.com/). **It is designed for instant execution in 100% local environments without complex configuration**, enabling users to fully control computing resources on their personal computer or server.\n\n\u003e Built with [Vercel AI SDK](https://sdk.vercel.ai) and [Next.js](https://nextjs.org/), this app adopts modern patterns for building AI chat interfaces. Leverage the power of [Model Context Protocol (MCP)](https://modelcontextprotocol.io/introduction) to seamlessly integrate external tools into your chat experience.\n\n\u003e **Our goal:** Build an AI chatbot app that is optimized for personal use and easy for anyone to run.\n\n## Table of Contents\n\n- [MCP Client Chatbot: Local-First AI Assistant App](#mcp-client-chatbot-local-first-ai-assistant-app)\n  - [Table of Contents](#table-of-contents)\n  - [Demo](#demo)\n  - [✨ Key Features](#-key-features)\n  - [🚀 Getting Started](#-getting-started)\n    - [Environment Variables](#environment-variables)\n    - [MCP Server Setup](#mcp-server-setup)\n  - [💡 Use Cases](#-use-cases)\n  - [🗺️ Roadmap: Upcoming Features](#️-roadmap-upcoming-features)\n  - [🙌 Contributing](#-contributing)\n\n-----\n\n## Demo\n\n![playwright-demo](./docs/images/preview.gif)\n\n**Tool Integration Example:** Demonstrates browser control using Microsoft's [playwright-mcp](https://github.com/microsoft/playwright-mcp).\n\n*Prompt Example:* \"Go to Reddit, open r/mcp, check the latest post and tell me what it's about — then close Reddit.\"\n\n\u003eThis project comes pre-configured with microsoft/playwright-mcp as a default MCP server.\n\u003eTry running the prompt above to see it in action!\n\n---\n\n![mention](./docs/images/preview-2.gif)\n\n**Quick Tool Access:** Use the `@` symbol in the message input to quickly select and call available MCP tools.\n\n\n---\n\n![tool-test](./docs/images/tool-test.gif)\n\n**Standalone Tool Testing:** Test MCP tools independently of the chat flow for easier development and debugging.\n\n---\n\n![prompt-input](./docs/images/provider.gif)\n\n**Model \u0026 Tool Selection UI:** Easily switch LLM providers and view tool status directly within the prompt input panel.\n\n-----\n\n## ✨ Key Features\n\n* **💻 100% Local Execution:** Run directly on your PC or server without complex deployment, fully utilizing and controlling your computing resources.\n* **🤖 Multiple AI Model Support:** Flexibly switch between providers like OpenAI, Anthropic, Google AI, and Ollama.\n* **🛠️ Powerful MCP Integration:** Seamlessly connect external tools (browser automation, database operations, etc.) into chat via Model Context Protocol.\n* **🚀 Standalone Tool Tester:** Test and debug MCP tools separately from the main chat interface.\n* **💬 Intuitive Mentions:** Trigger available tools with `@` in the input field.\n* **⚙️ Easy Server Setup:** Configure MCP connections via UI or `.mcp-config.json` file.\n* **📄 Markdown UI:** Communicate in a clean, readable markdown-based interface.\n* **💾 Zero-Setup Local DB:** Uses SQLite by default for local storage (PostgreSQL also supported).\n* **🧩 Custom MCP Server Support:** Modify the built-in MCP server logic or create your own.\n\n## 🚀 Getting Started\n\nThis project uses [pnpm](https://pnpm.io/) as the recommended package manager.\n\n```bash\n# 1. Install dependencies\npnpm i\n\n# 2. Initialize project (creates .env, sets up DB)\npnpm initial\n\n# 3. Start dev server\npnpm dev\n```\n\nVisit [http://localhost:3000](http://localhost:3000) after starting the server.\n\n-----\n\n### Environment Variables\n\nThe `pnpm initial` command generates a `.env` file. Add your API keys there:\n\n```dotenv\nGOOGLE_GENERATIVE_AI_API_KEY=****\nOPENAI_API_KEY=****\n# ANTHROPIC_API_KEY=****\n```\n\nSQLite is the default DB (`db.sqlite`). To use PostgreSQL, set `USE_FILE_SYSTEM_DB=false` and define `DATABASE_URL` in `.env`.\n\n-----\n\n### MCP Server Setup\n\nYou can connect MCP tools via:\n\n1. **UI Setup:** Go to http://localhost:3000/mcp and configure through the interface.\n2. **Direct File Edit:** Modify `.mcp-config.json` in project root.\n3. **Custom Logic:** Edit `./custom-mcp-server/index.ts` to implement your own logic.\n\n![mcp-config](./docs/images/mcp-config.gif)\n\n-----\n\n## 💡 Use Cases\n\n* [Supabase Integration](./docs/use-cases/supabase.md): Use MCP to manage Supabase DB, auth, and real-time features.\n\n-----\n\n## 🗺️ Roadmap: Upcoming Features\n\nWe're making MCP Client Chatbot even more powerful with these planned features:\n\n* **🎨 Canvas Mode:** Real-time editing interface for LLM + user collaboration (e.g. code, blogs).\n* **🧩 LLM UI Generation:** Let LLMs render charts, tables, forms dynamically.\n* **📜 Rule Engine:** Persistent system prompt/rules across the session.\n* **🖼️ Image \u0026 File Uploads:** Multimodal interaction via uploads and image generation.\n* **🐙 GitHub Mounting:** Mount local GitHub repos to ask questions and work on code.\n* **📚 RAG Agent:** Retrieval-Augmented Generation using your own documents.\n* **🧠 Planning Agent:** Smarter agent that plans and executes complex tasks.\n* **🧑‍💻 Agent Builder:** Tool to create custom AI agents for specific goals.\n\n👉 See full roadmap in [ROADMAP.md](./docs/ROADMAP.md)\n\n-----\n\n## 🙌 Contributing\n\nWe welcome all contributions! Bug reports, feature ideas, code improvements — everything helps us build the best local AI assistant.\n\nLet’s build it together 🚀\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcgoinglove%2Fmcp-client-chatbot","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcgoinglove%2Fmcp-client-chatbot","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcgoinglove%2Fmcp-client-chatbot/lists"}