ext-apps/examples/basic-server-react
Repository files (latest commit first)
Filename Latest commit message Latest commit date
Jonathan Hefner 8bb58f332a Update MIME type to text/html;profile=mcp-app
Apply MIME type change from commit 0af1532 to all examples and docs.
The profile parameter follows RFC 6838 recommendations for custom
media types, as MCP Apps is a profile of HTML rather than a new syntax.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-12-04 14:50:30 -06:00
..
src Add basic-host and basic-server-react examples 2025-12-04 14:28:27 -06:00
mcp-app.html Add basic-host and basic-server-react examples 2025-12-04 14:28:27 -06:00
package.json Add basic-host and basic-server-react examples 2025-12-04 14:28:27 -06:00
README.md Add basic-server-vanillajs example 2025-12-04 14:28:27 -06:00
server.ts Update MIME type to text/html;profile=mcp-app 2025-12-04 14:50:30 -06:00
tsconfig.json Add basic-host and basic-server-react examples 2025-12-04 14:28:27 -06:00
vite.config.ts Add basic-host and basic-server-react examples 2025-12-04 14:28:27 -06:00

Example: Basic Server (React)

An MCP App example with a React UI.

Tip

Looking for a vanilla JavaScript example? See basic-server-vanillajs!

Overview

Key Files

Getting Started

npm install
npm run dev

How It Works

  1. The server registers a get-time tool with metadata linking it to a UI HTML resource (ui://get-time/mcp-app.html).
  2. When the tool is invoked, the Host renders the UI from the resource.
  3. The UI uses the MCP App SDK API to communicate with the host and call server tools.