Uipack
FreeNot checkedFrontMCP UIpack - HTML shell builder, pluggable import resolver, and NPM component loader for MCP UI (React-free core)
About
FrontMCP UIpack - HTML shell builder, pluggable import resolver, and NPM component loader for MCP UI (React-free core)
README
The production-grade, TypeScript-first framework for building MCP servers — decorators, DI, auth, and Streamable HTTP, batteries included.
NPM - @frontmcp/sdk Node License Snyk
Docs • Quickstart • API Reference • Discord
FrontMCP turns the Model Context Protocol into a
typed, declarative framework. You write clean @Tool, @Resource, and @App
classes; FrontMCP handles the protocol, transport, dependency injection, sessions,
auth, and execution flow — and the same server runs locally and ships to
production unchanged.
import 'reflect-metadata';
import { FrontMcp, LogLevel } from '@frontmcp/sdk';
import HelloApp from './hello.app';
@FrontMcp({
info: { name: 'Demo', version: '0.1.0' },
apps: [HelloApp],
http: { port: 3000 },
logging: { level: LogLevel.Info },
})
export default class Server {}
Why FrontMCP
- Typed by default — decorators + Zod schemas give end-to-end types from input to output, with editor autocomplete and compile-time checks.
- Batteries included — auth (OAuth/JWKS/DCR), sessions, transport, discovery, and DI are built in, not bolted on.
- Ship anywhere — one codebase deploys to Node, Vercel, AWS Lambda, Cloudflare Workers, or a serverless bundle.
- Production-minded — stateful/stateless sessions, high-availability transport, structured observability, and a 95%+ tested core.
- Extensible — plugins, lifecycle hooks, OpenAPI adapters, and external MCP sub-apps when you outgrow the defaults.
Installation
Node.js 24+ required.
# New project (recommended)
npx frontmcp create my-app
# Existing project
npm i -D frontmcp @types/node@^24
npx frontmcp init
Full setup guide: Installation · Quickstart
Capabilities
Build — decorator-configured @FrontMcp server and @App domains; typed @Tool, @Resource, and @Prompt primitives; @Agent multi-step chains; and scoped Providers / DI.
Secure — Remote & Local OAuth, JWKS, DCR, per-app auth with stateful / stateless sessions (JWT or UUID transport IDs).
Connect & operate — Streamable HTTP + SSE transport,
capability discovery, elicitation,
hooks, HTTP-discoverable skills,
external MCP sub-apps, an in-process Direct Client
(connectOpenAI / connectClaude), and first-class deployment.
Extend & tooling — official plugins (Cache, Remember, CodeCall,
Dashboard), the OpenAPI adapter, a UI library (HTML/React
widgets, SSR, MCP Bridge), an E2E testing framework, and a
CLI (create, init, dev, build, inspect, doctor).
→ Full reference: docs.agentfront.dev/frontmcp
Packages
| Package | Description |
|---|---|
| @frontmcp/sdk | Core framework — decorators, DI, flows, transport |
| @frontmcp/cli | CLI tooling (frontmcp create, dev, build) |
| @frontmcp/auth | Authentication, OAuth, JWKS, credential vault |
| @frontmcp/adapters | OpenAPI adapter for auto-generating tools |
| @frontmcp/plugins | Official plugins: Cache, Remember, CodeCall, Dashboard |
| @frontmcp/testing | E2E test framework with fixtures and matchers |
| @frontmcp/ui | React components, hooks, SSR renderers |
| @frontmcp/uipack | React-free themes, build tools, platform adapters |
| @frontmcp/di | Dependency injection container (internal) |
| @frontmcp/utils | Shared utilities — naming, URI, crypto, FS (internal) |
Version Alignment
Keep all @frontmcp/* packages on the same version. A clear "version mismatch" error is thrown at boot if versions drift. (Production Build)
Contributing
PRs welcome! See CONTRIBUTING.md for workflow, coding standards, and the PR checklist.
License
Install Uipack in Claude Desktop, Claude Code & Cursor
unyly install uipackInstalls into Claude Desktop, Claude Code, Cursor & VS Code — handles npx, uvx and build-from-source repos for you.
First time? Get the CLI: curl -fsSL https://unyly.org/install | sh
Or configure manually
Run in your terminal:
claude mcp add uipack -- npx -y @frontmcp/uipackFAQ
Is Uipack MCP free?
Yes, Uipack MCP is free — one-click install via Unyly at no cost.
Does Uipack need an API key?
No, Uipack runs without API keys or environment variables.
Is Uipack hosted or self-hosted?
Self-hosted: the server runs locally on your machine via the install command above.
How do I install Uipack in Claude Desktop, Claude Code or Cursor?
Open Uipack on unyly.org, pick your client tab (Claude Desktop, Claude Code, Cursor) and press Install — the config is generated automatically, no JSON editing.
Related MCPs
GitHub
PRs, issues, code search, CI status
by GitHubFilesystem
Secure file operations with configurable access controls.
Memory
Knowledge graph-based persistent memory system.
Template MCP Server
A CLI tool to create a new Model Context Protocol server project with TypeScript support, dual transport options, and an extensible structure
by mcpdotdirectCompare Uipack with
Not sure what to pick?
Find your stack in 60 seconds
Author?
Embed badge for your README
Browse similar
All development MCPs
