Comenzando con mcp-framework

Construye tu primer servidor MCP en minutos usando mcp-framework. Guia paso a paso desde la instalacion hasta la conexion con Claude Desktop.

title: "Comenzando con mcp-framework" description: "Construye tu primer servidor MCP en minutos usando mcp-framework. Guia paso a paso desde la instalacion hasta la conexion con Claude Desktop." keywords: ["MCP primeros pasos", "tutorial mcp-framework", "construir servidor MCP", "Claude Desktop", "TypeScript MCP"] date: "2025-01-15" updated: "2025-04-01" author: "QuantGeekDev" order: 6 level: "beginner" duration: "15 min" language: "es" topic: "getting-started"

Requisitos previos

Antes de comenzar, asegurate de tener:

• Node.js 18+ instalado
• npm u otro gestor de paquetes
• Un editor de texto (se recomienda VS Code)
• Claude Desktop (opcional, para pruebas)

Paso 1: Instalar mcp-framework

Instala el framework globalmente para obtener acceso al CLI mcp:

npm install -g mcp-framework

Esto te da el comando mcp, que usaras para crear y gestionar proyectos de servidores MCP.

Paso 2: Crear tu proyecto

Genera un nuevo proyecto de servidor MCP:

mcp create mi-servidor-mcp
cd mi-servidor-mcp

Esto crea una estructura de proyecto lista para usar:

mi-servidor-mcp/
  src/
    tools/
      ExampleTool.ts
    resources/
    prompts/
  package.json
  tsconfig.json

El framework usa auto-descubrimiento — cualquier herramienta, recurso o prompt que coloques en el directorio correspondiente se registra automaticamente con el servidor MCP.

Paso 3: Construir tu primera herramienta

Abre src/tools/ExampleTool.ts para ver una herramienta funcional:

import { MCPTool } from "mcp-framework";
import { z } from "zod";

class ExampleTool extends MCPTool<typeof inputSchema> {
  name = "example_tool";
  description = "Una herramienta de ejemplo que saluda usuarios";

  schema = {
    input: z.object({
      name: z.string().describe("El nombre para saludar"),
    }),
  };

  async execute({ name }: z.infer<typeof this.schema.input>) {
    return `Hola, ${name}! Bienvenido a MCP.`;
  }
}

export default ExampleTool;

Cada herramienta tiene:

• Un nombre — como la IA se refiere a ella
• Una descripcion — ayuda a la IA a entender cuando usarla
• Un schema — define los parametros de entrada con validacion Zod
• Un metodo execute — la logica real

Paso 4: Compilar y ejecutar

Compila tu TypeScript e inicia el servidor:

npm run build

Tu servidor MCP esta listo para aceptar conexiones.

Paso 5: Conectar a Claude Desktop

Agrega tu servidor a la configuracion de Claude Desktop. Abre claude_desktop_config.json:

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

Agrega tu servidor:

{
  "mcpServers": {
    "mi-servidor-mcp": {
      "command": "node",
      "args": ["/ruta/absoluta/a/mi-servidor-mcp/dist/index.js"]
    }
  }
}

Reinicia Claude Desktop y tu herramienta estara disponible en las conversaciones.

Paso 6: Agregar mas capacidades

Agregar un recurso

Crea src/resources/RecursoSaludo.ts:

import { MCPResource } from "mcp-framework";

class RecursoSaludo extends MCPResource {
  uri = "greeting://bienvenida";
  name = "Mensaje de Bienvenida";
  description = "Un recurso de mensaje de bienvenida";
  mimeType = "text/plain";

  async read() {
    return {
      contents: [
        {
          uri: this.uri,
          text: "Bienvenido a mi servidor MCP!",
          mimeType: this.mimeType,
        },
      ],
    };
  }
}

export default RecursoSaludo;

Agregar un prompt

Crea src/prompts/PromptAnalizar.ts:

import { MCPPrompt } from "mcp-framework";

class PromptAnalizar extends MCPPrompt {
  name = "analizar";
  description = "Analiza un texto";
  arguments = [
    {
      name: "texto",
      description: "El texto a analizar",
      required: true,
    },
  ];

  async getMessages({ texto }: { texto: string }) {
    return [
      {
        role: "user" as const,
        content: {
          type: "text" as const,
          text: `Por favor analiza el siguiente texto:\n\n${texto}`,
        },
      },
    ];
  }
}

export default PromptAnalizar;

Lo que construiste

Ahora tienes un servidor MCP completo con:

• Una herramienta que Claude puede llamar durante las conversaciones
• Un recurso que proporciona datos estructurados
• Una plantilla de prompt para tareas comunes
• Auto-descubrimiento — solo agrega archivos y recompila

Proximos pasos

• Lee la guia Que es MCP? para una comprension mas profunda
• Explora mcp-framework en GitHub para funciones avanzadas
• Consulta la documentacion oficial de MCP para detalles del protocolo
• Visita el paquete npm para las ultimas versiones

Esta guia es parte de MCP International — tutoriales de MCP en cada idioma. Creado por @QuantGeekDev, autor de mcp-framework (3.3M+ descargas en npm, validado por Anthropic).