MCP HubMCP Hub
mschwarzmueller

demo-mcp-server-client-implementation

by: mschwarzmueller

A demo implementation of a MCP server (consuming a dummy API) and basic client.

20created 18/03/2025
Visit
demo
client

đź“ŚOverview

Purpose: To demonstrate the implementation of an MCP (Model Context Protocol) server and client that utilizes a backend service via Node.js with TypeScript support.

Overview: This project features a backend API that interacts with an MCP server, which standardizes exposures to MCP clients. The example client is a simple AI chatbot that integrates with the server to facilitate information storage and retrieval.

Key Features:

  • MCP Server: Acts as an intermediary between the backend service and clients, ensuring a standardized communication protocol for data exchange.

  • AI Chatbot Client: A lightweight chatbot application that uses the MCP server to leverage OpenAI's capabilities while storing and accessing custom data seamlessly.

Example MCP Server + Client Implementation

I wrote an article and created a video about MCPs and why they're useful in my opinion.

This demo project contains a backend service / API that's consumed by a MCP server which exposes it in a standardized way to MCP clients—like the example MCP client (a very simple AI chatbot) that's also part of this project.

Important: All three parts (service, server, client) rely on Node.js being able to execute TypeScript without a compilation step. Make sure you have Node.js 23.x or higher installed!

Configuration

Add a .env file inside the client folder (next to the package.json file) and add the following content:

OPENAI_API_KEY=<your-open-ai-key>

In each folder (service, server, client) run npm install to install required dependencies.

Running Service, MCP Server & MCP Client

For each part, navigate into the respective folder (service, server, and client) and run:

npm run dev

(with Node.js 23+). Keep each process running.

The "client" process is a simple AI chatbot using OpenAI behind the scenes. This chatbot has the custom MCP server "installed"—therefore, this AI chat application is able to store and retrieve custom information via the backend service created in the "service" folder.

Bugs are possible—it's just a basic demo implementation.