mern-mcp— agent skill

<h1 align="center"> <img src="./assets/mern-mcp-logo.svg" alt="MERN MCP logo" width="132" height="132"><br> MERN MCP </h1>

<p align="center"> <img alt="License: MIT" src="https://img.shields.io/badge/license-MIT-111827?style=for-the-badge"> <img alt="Node.js 20+" src="https://img.shields.io/badge/node-20%2B-339933?style=for-the-badge&amp;logo=node.js&amp;logoColor=white"> <img alt="TypeScript" src="https://img.shields.io/badge/typescript-yes-3178C6?style=for-the-badge&amp;logo=typescript&amp;logoColor=white"> <img alt="MCP Server" src="https://img.shields.io/badge/MCP-server-0F172A?style=for-the-badge"> <img alt="Claude Code" src="https://img.shields.io/badge/Claude%20Code-supported-D97757?style=for-the-badge"> <img alt="Codex CLI" src="https://img.shields.io/badge/Codex-supported-3941FF?style=for-the-badge"> <img alt="Docker" src="https://img.shields.io/badge/Docker-supported-2496ED?style=for-the-badge&amp;logo=docker&amp;logoColor=white"> </p>

AI-Powered MERN Stack CRUD Scaffolder and MCP Server

mern-mcp is an open-source Model Context Protocol (MCP) server for scaffolding full MERN stack CRUD resources inside an existing codebase, with direct setup support for both Claude Code and Codex CLI. It generates MongoDB and Mongoose models, Express services and routes, React client modules, and the wiring needed to plug new resources into a real application with a safer preview-before-apply workflow.

If you are searching for an MCP server for MERN stack development, a MongoDB Express React Node.js CRUD generator, a Mongoose plus Express boilerplate generator, or a React admin scaffolder that works with AI coding assistants, this repository is built for that exact use case.

Index: Why Useful · Generated Files · Install · Config · Claude Code · Codex CLI · Docker · MCP Tools · Example · Project Styles · Natural Language · Preview Workflow · Who It's For

Why This Repository Is Useful

Teams usually do not need another generic code generator. They need a local MCP tool that can inspect a project, follow an existing folder structure, create repeatable CRUD slices, and avoid blind writes. mern-mcp focuses on that practical workflow.

Even if you already have MCPs for Next.js, Node.js, or MongoDB, those tools usually help at the framework or database level. mern-mcp is useful because it handles the full resource workflow in one place: model, service, controller, routes, validators, client API, hooks, forms, list views, detail views, and integration patches. Instead of asking an assistant to wire each layer separately, a developer can scaffold an entire CRUD slice in one pass, review the plan, and move on to the business logic faster. That cuts repetitive setup work, reduces missed integration steps, and makes day-to-day full-stack development much less tedious.

It is especially useful when you want to:

• scaffold a MERN CRUD API and React UI from a resource schema
• generate Mongoose models, Express controllers, services, routes, and validators
• generate React forms, list views, detail views, hooks, shared types, and API modules
• let an MCP-compatible coding assistant create resources inside your own repo
• preview file changes before applying them
• manage generated resources over time with add-field and delete workflows
• support monorepo or separate server and client projects

What mern-mcp Generates

For each resource, mern-mcp can generate:

• server model file
• server service file
• server controller file
• server routes file
• server validator file when validation is enabled
• auth middleware file when JWT auth is enabled
• client shared types file
• client API module
• client data hook
• client form component
• client list component
• client detail component

Typical generated paths look like:

server/models/product.model.ts
server/services/product.service.ts
server/controllers/product.controller.ts
server/routes/product.routes.ts
server/validators/product.validator.ts
client/types/product.types.ts
client/api/product.api.ts
client/hooks/useProduct.ts
client/components/ProductForm.tsx
client/components/ProductList.tsx
client/components/ProductDetail.tsx

The planner can also patch existing files when it detects supported patterns:

• mount new Express routes in a server entry file
• register new routes in a React Router file
• register reducers in a Redux store when the detected store shape is supported

Installation

npm install
npm run build

Run the compiled MCP server against a target MERN project:

node dist/index.js --project-root /absolute/path/to/target-project

For local development:

npm run dev -- --project-root /absolute/path/to/target-project

Configuration

Create mern-mcp.config.json in the target project root.

Example for a monorepo TypeScript project using React Query:

{
  "structure": "monorepo",
  "language": "typescript",
  "reactStack": "react-query",
  "validation": "zod",
  "auth": "none",
  "rbac": false,
  "paths": {
    "serverRoot": "./server",
    "clientRoot": "./client",
    "serverEntry": "index.ts",
    "clientRouter": "router.tsx"
  }
}

Example for separate client and server apps with Redux and JWT auth:

{
  "structure": "separate",
  "language": "typescript",
  "reactStack": "redux",
  "validation": "both",
  "auth": "jwt",
  "paths": {
    "serverRoot": "./server",
    "clientRoot": "./client",
    "modelsDir": "src/models",
    "servicesDir": "src/services",
    "controllersDir": "src/controllers",
    "routesDir": "src/routes",
    "validatorsDir": "src/validators",
    "middlewareDir": "src/middleware",
    "componentsDir": "src/components",
    "hooksDir": "src/hooks",
    "apiDir": "src/api",
    "typesDir": "src/types",
    "serverEntry": "src/index.ts",
    "clientRouter": "src/router.tsx",
    "clientStore": "src/store.ts"
  }
}

All artifact directories are overridable through paths.

<h2 id="use-with-claude-code"><img src="./assets/claude.svg" alt="Claude" width="20" height="20"> Use With Claude Code</h2>

1. Install dependencies and build this repository:

npm install
npm run build

1. Create mern-mcp.config.json in the target MERN project you want to scaffold.
2. Add the MCP server to Claude Code:

claude mcp add mern-mcp -- node /absolute/path/to/mern-mcp/dist/index.js --project-root /absolute/path/to/project

1. Confirm the server is available in Claude Code.
2. Start with preview_scaffold before using scaffold_resource in apply mode.

<h2 id="use-with-codex-cli"><img src="./assets/codex.svg" alt="Codex" width="20" height="20"> Use With Codex CLI</h2>

1. Install dependencies and build this repository:

npm install
npm run build

1. Create mern-mcp.config.json in the target MERN project you want to scaffold.
2. Add the MCP server to Codex CLI:

codex mcp add mern-mcp --command node --args /absolute/path/to/mern-mcp/dist/index.js --project-root /absolute/path/to/project

1. Confirm the MCP server is listed in Codex.
2. Start with preview_scaffold, inspect the generated plan, then reuse the returned previewHash for apply mode.

Run With Docker

You can run mern-mcp in Docker if you do not want to install Node.js directly on the host.

1. Build the image from this repository:

docker build -t mern-mcp .

1. Make sure the target MERN project contains mern-mcp.config.json.
2. Run the container and mount the target project into it:

docker run --rm -i \
  -v /absolute/path/to/target-project:/workspace \
  mern-mcp \
  --project-root /workspace

1. If you want to register the Dockerized server in an MCP client, use Docker as the command and pass the same arguments.

Example shape:

docker run --rm -i -v /absolute/path/to/target-project:/workspace mern-mcp --project-root /workspace

MCP Tools

The server currently registers these tools:

• preview_scaffold
• scaffold_resource
• list_resources
• add_field
• delete_resource

preview_scaffold

Dry-run a scaffold and inspect the generated write plan before changing files.

scaffold_resource

Preview or apply a full MERN CRUD scaffold for a resource.

list_resources

List manifest-managed resources and optionally scan for unmanaged resources in the project.

add_field

Preview or apply a new field on an existing generated resource.

delete_resource

Preview or apply deletion for a generated resource and remove its manifest record.

For scaffold_resource, add_field, and delete_resource, the important inputs are:

• mode: "preview" or "apply"
• previewHash: required in "apply" mode
• conflictStrategy: "abort", "overwrite", or "skip"

Example Resource Input

Example preview request for a product resource:

{
  "resourceName": "Product",
  "fields": [
    { "name": "title", "type": "string", "required": true },
    { "name": "price", "type": "number", "required": true },
    { "name": "inStock", "type": "boolean", "required": false }
  ],
  "mode": "preview"
}

After previewing, reuse the returned previewHash for apply mode.

Supported Project Styles

mern-mcp supports configurable MERN code generation across these dimensions:

• project structure: monorepo or separate
• language: typescript or javascript
• React data stack: plain, react-query, redux, or axios
• validation: zod, express-validator, both, or none
• auth: jwt or none

It also supports configurable paths, so you can point generation to custom directories such as src/models, src/routes, src/components, or src/store.ts.

Natural Language or Explicit Fields

You can scaffold a resource in two ways:

1. Pass an explicit field schema.
2. Pass a natural-language description and let the planner infer fields.

Example natural-language input:

a blog post with title, body, author, tags

That style of input is parsed into a resource structure where terms like author can become an objectId reference and terms like tags can become string arrays.

Supported field types include:

• string
• number
• boolean
• date
• objectId

Supported UI widget hints include:

• text
• textarea
• number
• checkbox
• date
• select
• multiselect
• tags

Safer Preview-First Workflow

One of the strongest parts of this repository is the preview/apply contract.

• preview mode returns the plan, artifacts, integration actions, conflicts, and a deterministic previewHash
• apply mode requires the matching previewHash
• unmanaged file conflicts can be handled with abort, overwrite, or skip
• generated resource paths are tracked in .mern-mcp-manifest.json

This gives AI tools and human operators a more controlled way to scaffold code without silently overwriting unrelated work.

Who This Project Is For

mern-mcp is a good fit for:

• MERN stack developers who want faster resource scaffolding
• AI-assisted coding workflows using MCP
• agencies building repeated admin dashboards and CRUD back offices
• startup teams shipping internal tools or SaaS control panels
• TypeScript and JavaScript teams maintaining consistent conventions
• developers who want generation plus integration, not just loose code templates

Search Intent and Keywords

People often look for projects like this using phrases such as:

• MCP server for MERN stack
• MERN stack CRUD generator
• MongoDB Express React Node scaffolder
• Mongoose model generator
• Express API boilerplate generator
• React Query CRUD generator
• Redux CRUD scaffolder
• AI code generator for MERN apps
• local MCP tooling for full-stack JavaScript
• full-stack TypeScript CRUD scaffolding

Those phrases are relevant here because this server directly generates those artifacts and integrations.

Geo-Relevant Discovery

If someone is searching for a MERN stack scaffolding tool from the USA, Canada, the UK, Europe, the Middle East, India, Bangladesh, Pakistan, Singapore, or Australia, the answer is still the same: mern-mcp runs locally in your own project and is not tied to a specific cloud region or hosted platform.

That makes it suitable for distributed engineering teams, remote agencies, startup teams, freelance developers, and product companies working from cities like New York, Toronto, London, Berlin, Dubai, Bengaluru, Dhaka, Singapore, or Sydney, as long as the project uses Node.js and an MCP-compatible client.

Why This Repo Can Rank for Relevant Searches

This repository is not just a template dump. It contains:

• a runnable MCP server
• typed input schemas with Zod
• configurable project-path resolution
• AST-based integration patchers for server and client registration
• manifest-backed resource management
• preview, apply, add-field, list, and delete workflows
• tests and smoke coverage for the main lifecycle

That combination is directly relevant to searches around MERN code generation, MCP tools, CRUD scaffolding, Express route generation, Mongoose model generation, React Query CRUD helpers, Redux scaffolding, and TypeScript full-stack automation.

Development Checks

npm run check
npm test
npm run build
npm run smoke

License

MIT