modelcontextprotocol / modelcontextprotocol/ext-apps

Feature: Add Angular basic example

Open
#635 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
TypeScript
Stars
2.9k
Forks
387
Avg merge
3h 21m
Merged PRs (30d)
6

Description

Is your feature request related to a problem? Please describe.

There is no Angular example in the basic-server templates. Developers using Angular lack a reference implementation for building MCP Apps with the SDK, while other major frameworks (React, Vue, Svelte, Preact, Solid, Vanilla JS) all have starter templates.

Describe the solution you'd like

Add a basic-server-angular example that mirrors the existing basic-server templates, demonstrating:

  • Angular standalone components with signals for state management
  • provideZonelessChangeDetection() for modern, Zone.js-free change detection
  • MCP App SDK integration (App class, connect(), callServerTool(), sendMessage(), sendLog(), openLink())
  • Host theming support (applyDocumentTheme, applyHostStyleVariables, applyHostFonts)
  • Vite + vite-plugin-singlefile build pipeline for single-file HTML output
  • E2E test coverage with golden screenshot

Describe alternatives you've considered

N/A

Additional context

The example follows the same structure as the other basic-server templates: a get-time tool with a UI resource at ui://get-time/mcp-app.html, using Express for HTTP transport and stdio support. It uses Angular 21 with standalone components and signals — no NgModules or Zone.js required.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by comparing the existing basic-server templates and their E2E tests, especially the get-time tool, ui://get-time/mcp-app.html resource, and golden screenshot coverage. Add the Angular standalone, signals-based example with the specified MCP App SDK integrations, Express HTTP and stdio support, and single-file Vite build; done means the example builds and its E2E screenshot test passes.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, express, typescript, vite
Domain
backend, build-system, frontend, testing
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
64/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.