This is a basic Angular application that exposes a component as an MCP-UI tool that can be embedded in chat responses, e.g. via ChatGPT apps.
The meat of the MCP integration is in src/server.ts. It uses the following packages:
@modelcontextprotocol/sdk: To expose an MCP endpoint on Angular's server.@mcp-ui/server: To provide MCP-UI tools & resources on the MCP endpoint.@mcp-ui/client: To test the app's MCP-UI widget.
To start a local development server, run:
ng serve
# If exposing the dev server for testing integrations:
BASE_URL=https://YOUR-PUBLIC-PROXY-DOMAIN ng serve --allowed-hostsThis is enough to test the MCP server using manual tool calls. To test integrations with deployed chats, the server must be available on the internet. For ChatGPT, follow these instructions: https://developers.openai.com/apps-sdk/deploy/connect-chatgpt/
To build the project run:
ng buildThis will compile your project and store the build artifacts in the dist/ directory. By default, the production build optimizes your application for performance and speed.
To execute unit tests with the Karma test runner, use the following command:
ng test