Skip to main content
Glama
9kubczas4

MCP Hello World Server

by 9kubczas4
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Remote

MCP Hello World App

A minimal MCP App boilerplate: a single Node/TypeScript MCP server that exposes one tool (say_hello) and serves a tiny Angular UI as an MCP App resource.

It mirrors the architecture of the parent invoice-preview-mcp-app project, stripped down to a "Hello World".

Architecture

MCP Host (e.g. Cursor)
  │  calls tool  say_hello
  ▼
Express server (:8080)
  ├─ POST/GET/DELETE /mcp   → MCP Streamable HTTP transport
  ├─ MCP resource           → ui://hello-world/app   (inlined Angular HTML)
  ├─ GET /ui/*              → HTTP fallback for assets
  └─ GET /healthz
        ▲
        │ build pipeline
  ng build → scripts/inline-bundle.mjs  (CSS + JS inlined into one HTML)

When the agent calls say_hello, the tool result carries _meta.ui.resourceUri = "ui://hello-world/app", which tells the host to open the Angular UI in an iframe. Inside the iframe the UI calls say_hello again through the MCP bridge (postMessage, with an HTTP fallback to /mcp).

Related MCP server: MCP Docker Demo

Project layout


├── package.json              # npm workspaces: server + ui
├── tsconfig.base.json
├── scripts/inline-bundle.mjs # inlines the Angular build for MCP iframes
├── .cursor/mcp.json          # points Cursor at http://127.0.0.1:8080/mcp
├── server/                   # MCP + Express server (TypeScript)
│   └── src/
│       ├── index.ts                      # entry point
│       ├── core/
│       │   ├── config/server-env.ts      # env parsing
│       │   ├── http/                     # Express app + CORS
│       │   ├── infrastructure/           # base-url / CSP helpers
│       │   └── mcp/                       # server factory, transport, tool registry
│       ├── tools/                        # one folder per MCP tool
│       │   └── say-hello/                 #   register-say-hello.ts + schemas
│       └── ui/                            # MCP App resource + HTTP fallback
└── ui/                       # Angular Hello World UI

Adding a new tool

  1. Create server/src/tools/<your-tool>/register-<your-tool>.ts (plus a *.schemas.ts if it takes input).

  2. Add its registrar to the array in server/src/core/mcp/tool-registry.ts.

Getting started

npm install
npm run build      # builds the server (tsc) and the UI (ng build + inline)
npm start          # node server/dist/index.js  → http://localhost:8080

Then add .cursor/mcp.json to your Cursor MCP config (or copy the hello-world-local entry), and ask the agent to run the say_hello tool.

Key conventions

Convention

Why

MIME text/html;profile=mcp-app

Required by the MCP Apps spec

outputHashing: "none" (Angular)

Stable asset filenames for resource serving

baseHref: "./"

Relative paths inside the iframe

inline-bundle script

MCP iframes often block external script fetches

_meta.ui.resourceUri on the tool

Tells the host which UI to open

CORS on /mcp

The iframe has a null/opaque origin

<meta name="mcp-server-url"> injection

Enables the HTTP tool-call fallback

This server cannot be installed

F
license - not found
-
quality - not tested
C
maintenance

How are these scores calculated?

Maintenance

–Maintainers
–Response time
–Release cycle
–Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

  • Hello World MCP FastAPI

    bankszach
    F
    license
    -
    quality
    D
    maintenance
    A minimal Model Context Protocol server built with FastAPI that provides a basic "Hello World" resource and tool. Serves as a starting point for building and validating MCP client integrations with richer resources and tools.
    Last updated

  • MCP Docker Demo

    rakeshsun
    F
    license
    -
    quality
    D
    maintenance
    A demonstration MCP server implementation with Docker support that provides a simple hello-world tool and includes a web-based inspector for interactive testing and exploration of MCP tools.
    Last updated

  • hello-world-mcp

    niellevince
    A
    license
    -
    quality
    D
    maintenance
    A simple Model Context Protocol server that provides a hello world greeting tool, serving as a boilerplate template for quickly creating new MCP servers.
    Last updated
    30
    MIT

View all related MCP servers

Related MCP Connectors

  • Backtest360

    MCP server exposing the Backtest360 engine API as tools for AI agents.

  • postman-mcp-server

    A basic MCP server to operate on the Postman API.

  • console-mcp-server

    The official MCP Server from Mia-Platform to interact with Mia-Platform Console

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/9kubczas4/mcp-app-angular-boilerplate'

If you have feedback or need assistance with the MCP directory API, please join our Discord server