llamacppMCPClientDemo

MCP.Pizza Chef: brucepro

llamacppMCPClientDemo is a standalone React MCP client demonstrating real-time streaming using Server-Sent Events (SSE). It connects to MCP servers via SSE transport, enabling live context flow and tool invocation in a modular LLM environment. This demo client showcases integration patterns for MCP clients with React, supporting multiple MCP servers and tool calls with configurable settings.

Use This MCP client To

Connect React apps to MCP servers using SSE transport Stream real-time LLM completions and tool responses Demonstrate multi-server MCP client orchestration Test and develop MCP client features in React Configure and manage tool calls from a React interface

README

A Demo of the MCP Client using React and SSE

Still in progress but seems to work.

Instructions

Load the SSE servers: npx -y supergateway --cors --port 8002 --stdio "npx -y @modelcontextprotocol/server-everything"

cd servers/python/simple-tool-prompt-resource Load it with uv.

uv run mcp-simple-tool-prompt-resource --transport sse --port 8000

cd servers/python/simple-tool-prompt-resource2 Load it with uv.

uv run mcp-simple-tool-prompt-resource2 --transport sse --port 8001

The script assumes these are running at localhost. But you can edit the config and change it to any SSE server.

Run the script.

npm start

Issues to consider:

two tool names that match but are different servers, can prolly modify the tools_available to do mcpserver.name.toolname to the list tools.

Haven't tested multiple tools being called, prolly should set max tool calls.

Text completion streaming needs to be off to call tools.

llamacppMCPClientDemo FAQ

How do I start the llamacppMCPClientDemo?

Run the required MCP SSE servers first, then execute 'npm start' in the client directory.

Can this client handle multiple MCP servers simultaneously?

Yes, it supports connecting to multiple SSE MCP servers with configurable endpoints.

What transport protocol does this client use?

It uses Server-Sent Events (SSE) for streaming data from MCP servers.

Is this client production-ready?

No, it is a demo and still in progress, intended for testing and development purposes.

How do I configure tool calls in this client?

Tool calls can be managed and limited via client configuration, including max tool calls settings.

Can I modify the client to support different MCP servers?

Yes, the client config allows changing server URLs and tool naming conventions.

Does the client support text completion streaming with tool calls?

Currently, text completion streaming needs to be disabled to call tools.

What frameworks or libraries does this client use?

It is built with React and uses SSE for real-time communication.