Get the FREE Ultimate OpenClaw Setup Guide →

next-js -example

MCP server from MervinPraison/next-js-mcp-server-example

Installation
Run this command in your terminal to add the MCP server to Claude Code.
Run in terminal:
Command
claude mcp add --transport http mervinpraison-next-js-mcp-server-example http://localhost:3000/api/mcp

How to use

This MCP server is a Next.js 16 dashboard that exposes internal application insights through the Model Context Protocol (MCP). The server integrates an AI-powered assistant that can query routes, errors, cache status, and performance metrics, and it can analyze specific routes or provide optimization suggestions. Tools available to AI agents include: get_routes to enumerate all routes with their metadata, get_errors to fetch error logs, get_cache_status for caching details, get_performance_metrics to inspect build times and Core Web Vitals, analyze_route for in-depth route analysis, and suggest_optimization for AI-driven improvements. You can enable MCP in the Next.js config, then launch the app and point MCP agents at the provided endpoints to begin introspection and interaction with your running Next.js application.

How to install

Prerequisites:

  • Node.js 16+ and npm or pnpm
  • Git

Installation steps:

  1. Clone the repository: git clone <repository-url>\n cd <project-directory>

  2. Install dependencies: npm install

  3. Optional: copy environment variables example if provided: cp .env.local.example .env.local

  4. Start the development server: npm run dev

  5. Open the app in your browser: http://localhost:3000

If you plan to use MCP tooling in development, ensure the MCP configuration is enabled (as shown in the README) and that the MCP endpoints are reachable from your agent tooling.

Additional notes

Tips and considerations:

  • MCP is enabled for development by default. Do not expose MCP endpoints in production without proper authentication.
  • The MCP client configuration allows using a local transport at http://localhost:3000/api/mcp or launching helper tools via npx, such as next-devtools-mcp@latest.
  • Ensure environment variables (in .env.local) are set for any external services you rely on (AI backends, analytics, error trackers).
  • When running Next.js with MCP, monitor the console for any MCP-related warnings and verify that the MCP endpoints respond as expected.
  • If you modify next.config.ts to enable MCP, restart the dev server to apply changes.

Related MCP Servers

Sponsor this space

Reach thousands of developers