Skip to main content

​
Why another MCP framework?

If you’ve tried wiring up the Model Context Protocol (MCP) by hand, you already know the drill:
  • Define JSON schemas manually
  • Hand-roll HTTP endpoints
  • Keep auth, sessions, logging and transports consistent across tools
  • Copy-paste boilerplate just to expose “one more” operation ([GitHub][1])
That’s fine for a weekend experiment, but painful for a real agentic backend. FrontMCP exists to make this boring part disappear. FrontMCP is a TypeScript-first framework for MCP: you describe servers, apps, tools, resources and prompts with decorators, and the framework handles protocol details, transport, dependency injection, sessions/auth, and execution flow for you. ([FrontMCP][2])
If you’re new to MCP: it’s an open specification for how LLM clients talk to tools and data sources in a consistent way. FrontMCP gives you a batteries-included way to implement those servers in TypeScript.

​
FrontMCP in one sentence

FrontMCP is the TypeScript way to build MCP servers with decorators, DI, and Streamable HTTP. ([FrontMCP][2])
You write clean, typed code; FrontMCP takes care of:
  • Protocol & transport (MCP Streamable HTTP)
  • Sessions & streaming
  • Auth & security (remote and local OAuth)
  • Logging, hooks, and extensibility via adapters and plugins ([FrontMCP][2])
Already sold? You can skip ahead to the Quickstart docs and have a server running in a few minutes.

​
The pillars of FrontMCP

TypeScript-native DX

Use decorators and zod schemas to describe tools and apps, with strong typing from inputs to responses. FrontMCP stays out of your way and lets the TypeScript type system do the heavy lifting.

Spec-aligned transport

FrontMCP speaks MCP Streamable HTTP out of the box, including sessions and streaming responses, so you can plug it into any MCP-capable client without custom plumbing.

Security & auth built-in

Configure remote OAuth with your existing IdP, or use built-in local OAuth. Combine that with scoped execution and hooks for logging, rate limits, and policy checks.

Adapters & plugins

Generate tools from OpenAPI, enable transparent caching, wire custom logging transports, and more—without turning your codebase into a tangle of middleware.

​
Core concepts (in 5 steps)

At the heart of FrontMCP there are a few concepts you’ll see everywhere in the docs.

Server

A Server is your decorated entry point, defined with @FrontMcp. It describes server info (name, version), which apps are available, HTTP settings, logging, session configuration, and optional auth & providers.

App

An App is a logical bundle of tools and related pieces, declared with @App. You group tools, resources, prompts, adapters and plugins into apps so you can split behavior cleanly—per product, per tenant, or per domain.

Tool

A Tool is an active unit of work. You describe it with @Tool (class tools) or tool()(handler) (function tools), and attach typed input/output schemas using zod.

Hooks & Providers

Hooks give you cross-cutting behavior—auth checks, logging, rate limiting, request transforms—while providers are dependency-injected singletons for things like config, DB, Redis, or KMS. You control scopes per app, per session, or per request.

Adapters & Plugins

Adapters generate tools/resources/prompts from external definitions (like OpenAPI), and plugins layer on cross-cutting behavior such as caching or tracing—without polluting your business logic.

​
A tiny FrontMCP server

Let’s look at a small, but realistic, FrontMCP server. It exposes a single tool that greets a user by name, grouped into a simple app.
src/main.ts
import 'reflect-metadata';
import { App, FrontMcp, Tool } from '@frontmcp/sdk';
import { z } from 'zod';

@Tool({
name: 'greet',
    description: 'Greets a user by name',
    inputSchema: z.object({name: z.string()}),
})
class GreetTool {
async execute({name}: {
    name: string
}) {
    return `Hello, ${name}!`;
}
}

@App({
id: 'hello',
    name: 'Hello App',
    tools: [GreetTool],
})
class HelloApp {}

@FrontMcp({
info: {
    name: 'Hello MCP', version
:
    '0.1.0'
},
apps: [HelloApp],
})
export default class HelloServer {}
With less than a screenful of code you’ve just:
  • Defined a strongly typed tool
  • Grouped it into an app
  • Exposed a fully MCP-compatible server entrypoint with a clean contract ([FrontMCP][2])

​
Installation in under a minute

You can either scaffold a new project or add FrontMCP to an existing TypeScript codebase.

​
Option A — Create a new project

Create a new FrontMCP project
npx frontmcp create my-app
This will:
  • Scaffold a new project under ./my-app
  • Configure tsconfig.json correctly for decorators and modern ESM
  • Generate a package.json with useful scripts
  • Install dev dependencies like TypeScript, tsx, zod, and reflect-metadata for you ([FrontMCP][3])

​
Option B — Add to an existing project

Install the CLI and Node types
npm i -D frontmcp @types/node@^20
Then initialize FrontMCP in your project root:
Initialize FrontMCP
npx frontmcp init
The init step updates your scripts, checks your tsconfig.json, and validates that your layout fits FrontMCP’s expectations. ([FrontMCP][3])

​
Scripts you’ll see

After using create or init, your package.json will include scripts like:
package.json (scripts)
{
"scripts": {
    "dev"
:
    "frontmcp dev",
        "build"
:
    "frontmcp build",
        "inspect"
:
    "frontmcp inspector",
        "doctor"
:
    "frontmcp doctor"
}
}
  • frontmcp dev – run your server in watch mode
  • frontmcp build – compile your entry to dist
  • frontmcp inspector – launch the MCP Inspector to explore tools live
  • frontmcp doctor – validate Node/npm versions, tsconfig, and project setup ([FrontMCP][3])
Once things look healthy, run npm run dev and connect any MCP-capable client to start calling your tools.

​
From “Hello MCP” to production

FrontMCP is designed so that the same primitives you use for a toy project scale all the way to hardened, production workloads. Some of the features you get out of the box:
  • Sessions & Transport Choose between stateful and stateless session modes and configure how transport IDs are issued (uuid or jwt), depending on whether you run a single node or a distributed cluster. ([GitHub][1])
  • Authentication Use remote OAuth to integrate with an external IdP (like your B2B identity provider), or local OAuth for projects that want to keep everything inside the MCP server. Either way, you can scope auth per server or per app. ([GitHub][1])
  • Logging transports Ship logs to console, JSONL, or custom HTTP sinks by defining @LogTransport providers and wiring them into your server config. ([GitHub][1])
  • Adapters & plugins Use the OpenAPI adapter to turn existing REST APIs into MCP tools, and plug in caching, tracing, or policy engines as plugins—no need to wrap every tool manually. ([FrontMCP][4])
All of this is accessible from TypeScript, with type inference helping you stay honest as your server grows.

​
FrontMCP in the AgentFront ecosystem

This is the first post in the AgentFront blog, and FrontMCP is a big part of why. We’re betting on a future where:
  • MCP is the default protocol for LLM tools and data access
  • TypeScript is the default language for web-scale infrastructure
  • Agentic systems are composed of many small, well-typed servers, not one giant monolith
FrontMCP is our open-source foundation for that world: We’ll be using this blog to share patterns, real-world architectures, and deep dives into features like adapters, auth, and deployment.

​
Where to go next

Read the Welcome doc

Get the high-level overview of FrontMCP’s concepts and how it fits into MCP.

Follow the Quickstart

Go step-by-step from empty folder to a running MCP server with a real tool.

Check out the examples

Explore example apps and tools that showcase patterns you can reuse in your own servers.

Star the repo & contribute

FrontMCP is open source (Apache-2.0). Issues, PRs, and feedback are very welcome.
This is just the beginning. In upcoming posts, we’ll dig into:
  • Designing tool interfaces your LLMs actually use
  • Using adapters to wrap existing APIs
  • Building secure multi-tenant MCP servers with remote OAuth
  • Observability patterns with custom logging transports and hooks
If you build something cool with FrontMCP, we’d love to hear about it—and maybe feature it here. [1] https://github.com/agentfront/frontmcp “GitHub - agentfront/frontmcp: FrontMCP Framework” [2] /docs/getting-started/welcome “Welcome to FrontMCP - FrontMCP” [3] /docs/getting-started/installation “Installation - FrontMCP” [4] /docs/getting-started/quickstart “Quickstart - FrontMCP”