Claude Next.js Skills — Instalar & Demo ao vivo

Name: Claude Next.js Skills (Claude Skill)
Author: wsimmonds

Demo ao vivo

Como fica na prática

claude-nextjs-skills-wsimmonds.replay ▶ pronto

0/0

Instalar

Escolha seu cliente

~/Library/Application Support/Claude/claude_desktop_config.json · Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "claude-nextjs-skills-wsimmonds": {
      "command": "npx",
      "args": [
        "-y",
        "claude-nextjs-skills-wsimmonds"
      ]
    }
  }
}

Abra Claude Desktop → Settings → Developer → Edit Config. Reinicie após salvar.

~/.cursor/mcp.json · .cursor/mcp.json

{
  "mcpServers": {
    "claude-nextjs-skills-wsimmonds": {
      "command": "npx",
      "args": [
        "-y",
        "claude-nextjs-skills-wsimmonds"
      ]
    }
  }
}

Cursor usa o mesmo esquema mcpServers que o Claude Desktop. Config de projeto vence a global.

VS Code → Cline → MCP Servers → Edit

{
  "mcpServers": {
    "claude-nextjs-skills-wsimmonds": {
      "command": "npx",
      "args": [
        "-y",
        "claude-nextjs-skills-wsimmonds"
      ]
    }
  }
}

Clique no ícone MCP Servers na barra lateral do Cline, depois "Edit Configuration".

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "claude-nextjs-skills-wsimmonds": {
      "command": "npx",
      "args": [
        "-y",
        "claude-nextjs-skills-wsimmonds"
      ]
    }
  }
}

Mesmo formato do Claude Desktop. Reinicie o Windsurf para aplicar.

~/.continue/config.json

{
  "mcpServers": [
    {
      "name": "claude-nextjs-skills-wsimmonds",
      "command": "npx",
      "args": [
        "-y",
        "claude-nextjs-skills-wsimmonds"
      ]
    }
  ]
}

O Continue usa um array de objetos de servidor em vez de um map.

~/.config/zed/settings.json

{
  "context_servers": {
    "claude-nextjs-skills-wsimmonds": {
      "command": {
        "path": "npx",
        "args": [
          "-y",
          "claude-nextjs-skills-wsimmonds"
        ]
      }
    }
  }
}

Adicione em context_servers. Zed recarrega automaticamente ao salvar.

claude mcp add claude-nextjs-skills-wsimmonds -- npx -y claude-nextjs-skills-wsimmonds

Uma linha só. Verifique com claude mcp list. Remova com claude mcp remove.

Casos de uso

Usos do mundo real: Claude Next.js Skills

Get started with Claude Next.js Skills

Quando usar: When you want to bring Claude Next.js Skills into your Claude workflow.

Fluxo

Install the skill in your client (see Install tab).
Authenticate or configure required tokens.
Ask Claude to use the new tools.

Use Claude Next.js Skills to help me with a task.✓ Copiado

Resultado: Claude can interact with Claude Next.js Skills directly from your IDE.

Mais

Recursos

📖 Leia o README oficial no GitHub

🐙 Ver issues abertas

🔍 Ver todos os 400+ servidores MCP e Skills