what is Open-Mcp-Client?
Open-Mcp-Client is a development tool designed to facilitate the connection between LangGraph agents and MCP servers, providing a structured environment for building applications.
how to use Open-Mcp-Client?
To use Open-Mcp-Client, set up the necessary environment variables in two .env files, one at the root and another in the agent folder. Then, run the frontend and agent in separate terminals or together to start the application.
key features of Open-Mcp-Client?
- Supports development of applications using LangGraph agents.
- Provides a structured architecture with separate folders for agent and frontend.
- Easy setup with environment variable configuration.
use cases of Open-Mcp-Client?
- Developing applications that require interaction with MCP servers.
- Debugging and logging in a structured environment.
- Building user interfaces with CopilotKit for state synchronization.
FAQ from Open-Mcp-Client?
- What programming language is used in Open-Mcp-Client?
Open-Mcp-Client is developed using TypeScript.
- Is there a recommended way to run the application?
Yes, it is recommended to run the frontend and agent in separate terminals for better debugging.
- Where can I find the source code?
The source code is available on GitHub at Open-Mcp-Client.
https://github.com/user-attachments/assets/f72e1f7d-3c84-4429-a465-23dff3d3bd63
Getting Started
Set Up Environment Variables:
touch .env
Add the following inside .env at the root:
LANGSMITH_API_KEY=lsv2_...
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_...
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:
/agentfolder – A LangGraph agent that connects to MCP servers and calls their tools./appfolder – A frontend application using CopilotKit for UI and state synchronization.