# TypeScript MCP server examples

> Complete MCP servers in TypeScript, built with FrontMCP, that you can run in your browser, each with its tests and a walkthrough of how it's built.

Source: https://frontmcp.dev/examples

Each example here is a whole server: several files, the tools, resources, jobs or agents it needs, and tests that check it works. It runs in the Playground, like every example on this site, so you can open it, call its tools, change the code and run the tests without installing anything.

Every example page starts with the server, then walks through it file by file, with links to the lessons that explain each part. To learn FrontMCP from the beginning, start with the [Quick Start](https://frontmcp.dev/learn) instead.

### Example: [Nightly Ticket Report](https://frontmcp.dev/examples/nightly-ticket-report)
*[Illustration: The Nightly Ticket Report: a tool starts a workflow whose steps collect tickets, find SLA breaches, write the report and notify the lead; another tool reads the saved report.]*
A workflow that collects yesterday's tickets, works out which ones broke their SLA, and writes a report, with a [job](https://frontmcp.dev/learn/your-first-job) per step, started [in the background](https://frontmcp.dev/learn/running-jobs-in-the-background) by a tool.

### Example: [Triage Agent](https://frontmcp.dev/examples/triage-agent)
*[Illustration: The Triage Agent: the client calls invoke_triage; the agent refuses bad tickets, then takes four model turns with its private tools and returns a checked answer.]*
An [agent](https://frontmcp.dev/learn/your-first-agent) that reads a new ticket and its customer, looks for related tickets, then sets the priority and the team with its own private tools. A [skill](https://frontmcp.dev/learn/teaching-the-model-skills) tells the client's model how to triage the whole queue.

### Example: [Research Assistant](https://frontmcp.dev/examples/research-assistant)
*[Illustration: The Research Assistant: the client calls invoke_research; the research agent hands the searching to find_sources, drops ids that don't exist, and returns claims that each cite the articles or tickets they came from.]*
An [agent](https://frontmcp.dev/learn/your-first-agent) that answers a hard support question from knowledge-base articles and closed tickets, with every claim citing the ids it came from. It [hands the searching to another agent](https://frontmcp.dev/learn/agents-that-call-agents), drops ids that don't exist, and refuses a claim that cites a source it wasn't given. The articles and tickets are also [resources](https://frontmcp.dev/learn/exposing-data-with-resources), so a client can open whatever an answer cites.

### Example: [Order Tracker Widget](https://frontmcp.dev/examples/order-tracker-widget)
*[Illustration: The Order Tracker: track_order answers with data for the model and a page for the host; the widget's buttons ask the host to call more tools, and their answers update the page.]*
A help desk tool that answers a support agent's "where's my order?" with the order and its shipping timeline as data, and as a [widget](https://frontmcp.dev/learn/your-first-widget) with buttons that call more tools through the host. Their answers update the page, refusals included.

### Example: [Expense Dashboard](https://frontmcp.dev/examples/expense-dashboard)
*[Illustration: The Expense Dashboard: the server renders one page at startup; the host reads it once, hands it each expense_report result, and the widget's filters ask the host to call the tool again.]*
A dashboard of what support spent in a month on refunds, credits and goodwill, as a [static widget](https://frontmcp.dev/learn/choosing-how-a-widget-is-served#static-one-page-the-data-from-the-host): one page, served once, that draws each result. Its month and team filters call the tool again, and `outputSchema` keeps the internal notes out.

### Example: [CRM with CodeCall](https://frontmcp.dev/examples/crm-with-codecall)
*[Illustration: The CRM with CodeCall: the model is listed six tools, searches for the ones it needs, reads their schemas, and runs one script on the server that combines several calls.]*
A help desk CRM with 47 tools, put behind the [CodeCall plugin](https://frontmcp.dev/learn/letting-the-model-write-code-with-codecall). A model searches for the tools it needs, reads their schemas, and answers "which enterprise customers have a stale high-priority ticket, and who manages them" with one script on the server. Destructive tools stay out of the script's reach.

### Example: [Pet Store from OpenAPI](https://frontmcp.dev/examples/pet-store-from-openapi)
*[Illustration: The Pet Store: the server turns four read operations of the Petstore API into tools, sends the API's credentials itself, adds a hint to an error, and has a search tool of its own.]*
A help desk server that wraps the classic Swagger Petstore with the [OpenAPI adapter](https://frontmcp.dev/learn/wrapping-an-openapi-service), then makes it fit for a model: clear tool names and descriptions, the API's keys sent by the server, writes left out, errors with a next step, and a search tool of its own.