Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@My First MCPadd 15 and 27"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
my-first-mcp
My first MCP (Model Context Protocol) server implementation.
Based on the video tutorial https://frontendmasters.com/courses/mcp/
Description
This is a simple MCP server that provides an addition tool. It demonstrates how to create a basic MCP server using the @modelcontextprotocol/sdk.
Features
Addition Tool: Adds two numbers together and returns the result
Installation
npm installUsage
Running the server
npm run myFirstMcpTesting the server
List available tools
npm run myFirstMcp:listThis will return information about all available tools in the server.
Call the add tool
npm run myFirstMcp:callThis will call the add tool with example arguments (5 + 3) and return the result.
API
Tools
add
Adds two numbers together.
Parameters:
a(number): First numberb(number): Second number
Returns:
A text response with the sum of the two numbers
Example:
{
"jsonrpc": "2.0",
"id": 1,
"method": "tools/call",
"params": {
"name": "add",
"arguments": {
"a": 5,
"b": 3
}
}
}Dependencies
@modelcontextprotocol/sdk: MCP SDK for building serverszod: TypeScript-first schema validation