mcpField
M
mcp-client

mcp-client

github.com/copilotkitFrameworks & SDKs12Updated 79w ago
Repository

About mcp-client

mcp-client is an application framework built around a LangGraph agent and a CopilotKit frontend, for developing interactive agent applications. The agent connects to MCP servers and calls their tools, while the frontend handles the UI and state synchronization.

Key features

  1. 01LangGraph agent connects to MCP servers
  2. 02Calls tools from MCP servers
  3. 03CopilotKit frontend UI
  4. 04Runs frontend and agent separately

Use cases

  1. 01Building agents with a web UI
  2. 02Debugging frontend and agent services
  3. 03Having an agent call MCP tools

MCP support

The agent connects to MCP servers and calls their tools.

Details

From the project README

https://github.com/user-attachments/assets/364b6705-14d4-4e6d-bea7-fb9f12664fab

Getting Started

Set Up Environment Variables:

touch .env

Add the following inside .env at the root:

LANGSMITH_API_KEY=lsv2_...
OPENAI_API_KEY=sk-...

Next, create another .env file inside the agent folder:

cd agent
touch .env

Add the following inside agent/.env:

OPENAI_API_KEY=sk-...
LANGSMITH_API_KEY=lsv2_...

Set Up Poetry:

Poetry is used for dependency management in the agent service. To install Poetry, run:

pip install poetry

To verify the installation, run:

poetry --version

Development

We recommend running the frontend and agent separately in different terminals to debug errors and logs:

# Terminal 1 - Frontend
pnpm run dev-frontend

# Terminal 2 - Agent
pnpm run dev-agent

Alternatively, you can run both services together with:

pnpm run dev

Then, open http://localhost:3000 in your browser.

Architecture

The codebase is split into two main parts:

  1. /agent folder – A LangGraph agent that connects to MCP servers and calls their tools.
  2. /app folder – A frontend application using CopilotKit for UI and state synchronization.

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.