what is mcp-client?
The mcp-client is an AI agent designed to connect to MCP servers and utilize their tools for various applications.
how to use mcp-client?
To use mcp-client, set up the 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 using the provided commands.
key features of mcp-client?
- Connects to MCP servers for tool utilization
- Supports separate or combined running of frontend and agent
- Built with TypeScript for robust development
use cases of mcp-client?
- Developing AI-driven applications that require server interactions.
- Debugging and testing AI agents in a controlled environment.
- Building user interfaces that synchronize state with backend services.
FAQ from mcp-client?
- What programming language is mcp-client built with?
mcp-client is built using TypeScript.
- How do I run the application?
You can run the application by executing the commands provided in the setup instructions for the frontend and agent.
- Is there any documentation available?
Yes, the documentation is available on the GitHub repository.
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.