skills.rest
bilalmk
bilalmkCOMMUNITY
Explore all skills by this author →
GitHub

nextjs-devtools

Inspect Next.js routes, components, and build configuration via MCP tools.

1|Updated Dec 28, 2025
Search Tags:#debugging#next.js#mcp#devtools#routing inspection#component discovery#build info
One-click install
npx skills add https://github.com/bilalmk/todo_correct --skill nextjs-devtools-bilalmk
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nextjs-devtools
Source: https://github.com/bilalmk/todo_correct/tree/main/.claude/skills/mjs/nextjs-devtools
Command: npx skills add https://github.com/bilalmk/todo_correct --skill nextjs-devtools-bilalmk

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Streamline development and troubleshooting of Next.js apps by providing MCP-powered inspection and debugging tools that reveal routes, components, and build/config details.

Core Features & Use Cases

  • Inspect app routes and routing structure to quickly understand navigation.
  • Discover and inspect React components used by a Next.js project.
  • Retrieve build information and Next.js configuration to diagnose issues.

Quick Start

Install and run the MCP client to query Next.js routes and components from your project root.

Frequently Asked Questions about nextjs-devtools

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I inspect Next.js routing structure and components during development?▼

Inspect Next.js routing and components by initializing an MCP server via local client scripts. It queries your project to reveal app routes, component structures, and build details for streamlined debugging.

What is the best way to debug Next.js app configurations without manual file searching?▼

Debug Next.js configurations by using MCP-powered inspection tools to retrieve build information. This queries your local project directly, revealing config details and routing structures to quickly diagnose issues.

Can I use MCP devtools to discover React components in a local Next.js project?▼

Yes, you can use MCP devtools to discover React components in a local Next.js project. The included client scripts query the initialized MCP server to map out and inspect components used by your application.

How to retrieve build information for a Next.js application using MCP?▼

Retrieve Next.js build information by running the included MCP client scripts from your project root. The server queries your local project to provide build details and configuration data for troubleshooting.

Do I need a local Next.js project to use MCP routing inspection tools?▼

Yes, you need a local Next.js project to use MCP routing inspection tools. The scripts require a local project directory to initialize the MCP server and successfully query routes, components, and build configurations.

Related Skills

Explore More Software Engineering Skills→
MakisuoMakisuo
1.6k

clickhousectl-local-dev

Install and configure a local ClickHouse environment with clickhousectl.

Community
Intermediate
sipherxyzsipherxyz
1

ue-cpp-build

Compile Unreal Engine C++ code and diagnose build errors.

Official
Advanced
botPhUbotPhU

react-performance

Profile React applications with DevTools Profiler and apply memoization, code-splitting, and virtualization.

Community
Advanced
mjunaidcamjunaidca
27

nextjs-devtools

Inspect Next.js routes, components, build info, and next.config.js settings via MCP.

Community
Advanced