Newsletter para devsEntra
Masterclass

Flujos de IA y código con MCP para developers que quieren ir más allá del prompt

Model Context Protocol: El puente entre prompts y el código real

Duración total: 01:22:11

Código descargable

Acceso 100% online

¿Qué aprenderás en este vídeo?

Descripción de la masterclass

Model Context Protocol (MCP) está revolucionando la forma en que la inteligencia artificial interactúa con nuestros sistemas y herramientas. En esta masterclass completa, exploraremos cómo implementar MCPs desde cero y crear conexiones poderosas entre LLMs y el mundo real.

¿Qué es Model Context Protocol?

MCP es un protocolo abierto que permite conectar modelos de lenguaje con herramientas externas, APIs y sistemas. A diferencia de los LLMs tradicionales que luchan con tareas básicas como contar caracteres o hacer cálculos matemáticos, MCP les proporciona acceso al “mundo real digital”.

El problema de los LLMs sin herramientas

Los modelos de lenguaje tienen limitaciones evidentes:

  • No pueden contar caracteres de forma consistente
  • Fallan en cálculos matemáticos básicos
  • No tienen acceso a datos en tiempo real
  • Inventan resultados cuando no saben la respuesta

MCP soluciona estos problemas proporcionando un puente entre la IA y las herramientas que sí pueden realizar estas tareas.

Arquitectura de MCP: Cliente y servidor

Componentes principales

MCP se basa en una arquitectura cliente-servidor:

Cliente (Frontend)

  • Claude Desktop
  • Visual Studio Code con Copilot
  • Cursor
  • Continue.dev
  • N8n

Servidor (Backend)

  • Mundo real digital
  • Bases de datos
  • APIs externas
  • Lógica matemática
  • Sistemas de archivos
  • Reglas de negocio

Tipos de transporters

Existen dos formas de conexión:

  1. STDIO: Comandos de terminal (más común)
  2. Streamable HTTP: Servicios web (más prometedor pero complejo)

Elementos del servidor MCP

Tools: La magia de la automatización

Las tools son herramientas que el servidor expone al cliente:

  • El modelo decide si las ejecuta o no
  • Requieren descripción clara para que la IA las entienda
  • Permiten conexión con APIs y sistemas externos
server.tool({
  name: "count_characters",
  description: "Cuenta caracteres de un texto",
  inputSchema: z.object({
    text: z.string().describe("Texto a contar")
  })
})

Prompts: Plantillas predefinidas

Los prompts ofrecen plantillas reutilizables:

  • Controlados por el usuario
  • No compatibles con todos los clientes
  • Útiles para workflows repetitivos

Resources: Listado de contenido

Los resources proporcionan listas de elementos disponibles:

  • Similar al autocomplete de archivos
  • Controlado por la aplicación
  • Compatibilidad limitada entre clientes

Sampling: Preguntas inteligentes

El sampling permite que el servidor sugiera preguntas:

  • Controlado por el cliente
  • Funcionalidad avanzada
  • Poco soporte actual

Implementación práctica con JavaScript

Configuración básica del servidor

import { McpServer } from '@modelcontextprotocol/sdk/server/index.js';
import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
import { z } from 'zod';

const server = new McpServer({
  name: "character-counter",
  version: "1.0.0"
}, {
  capabilities: {
    logging: {},
    tools: {}
  }
});

Creando una tool para contar caracteres

server.tool({
  name: "count_characters",
  description: "Cuenta los caracteres de un texto",
  inputSchema: z.object({
    text: z.string().describe("El texto del cual contar caracteres")
  })
}, async (request) => {
  const text = request.params.arguments.text;
  const count = text.length;
  
  // Debug logging
  await server.sendLoggingMessage({
    level: "info",
    data: `Contando caracteres: ${text}`
  });
  
  return {
    content: [{
      type: "text",
      text: `El texto tiene ${count} caracteres.`
    }]
  };
});

Configuración en Visual Studio Code

Pasos para la instalación

  1. Activar modo agente en Copilot
  2. Agregar servidor MCP desde la paleta de comandos
  3. Configurar comando de ejecución
  4. Iniciar servidor desde el panel de herramientas

Archivo de configuración

El archivo mcp.json en .vscode/ contiene:

{
  "mcpServers": {
    "counter-simple": {
      "command": "node",
      "args": ["path/to/server.js"]
    }
  }
}

Ejemplos avanzados:

Pronóstico del tiempo

La magia de MCP se evidencia cuando:

  • Le pides el tiempo en “Valladolid”
  • El modelo infiere automáticamente las coordenadas
  • Pasa los parámetros correctos a la API
  • Interpreta y presenta los resultados de forma comprensible

Configuración del servidor GitHub

Para usar el MCP oficial de GitHub necesitas:

  • Docker instalado
  • Personal Access Token de GitHub
  • Permisos específicos (issues, pull requests)

Workflow automatizado completo

Creación de issue:

Crear una issue para añadir un contador de votos de la comunidad frente a votos de la IA.

Desarrollo automático:

Resuelve la issue. Quiero que el contador esté en la home.

Gestión de branches:

Añade estos cambios en una rama que tenga el ID de la issue.

Pull request y review:

Crea una pull request explicando los cambios en inglés.
Añade una code review comentando que el mensaje de error es muy pobre.

Herramientas de desarrollo y debugging

MCP Inspector: El Postman de los MCPs

El Inspector oficial permite:

  • Probar tools sin conexión con LLM
  • Ver logs de depuración en tiempo real
  • Validar configuración del servidor
  • Inspeccionar llamadas del protocolo
npx @modelcontextprotocol/inspector

Configuración del Inspector

  • Seleccionar transporte STDIO
  • Especificar comando de ejecución
  • Probar tools individualmente
  • Revisar logs detallados

Servicios externos: Conectando con documentación

GitMCP para repositorios públicos

GitMCP permite conectar con documentación online:

{
  "mcpServers": {
    "astro-docs": {
      "transport": "sse",
      "url": "https://mcp.run/astro/docs"
    }
  }
}

Búsquedas inteligentes en documentación

Busca en la documentación de Astro cómo se hace una colección de contenido.

El sistema puede:

  • Buscar automáticamente en la documentación
  • Extraer información relevante
  • Proporcionar ejemplos específicos

SDKs disponibles y ecosistema

Lenguajes soportados

  • TypeScript/JavaScript (más maduro)
  • Python (muy popular)
  • Kotlin (para JVM)
  • C# (recién lanzado)

Clientes compatibles

  • Claude Desktop (creadores del protocolo)
  • Visual Studio Code con Copilot
  • Cursor (desarrollo)
  • Continue.dev (gratuito)

Consideraciones de seguridad y buenas prácticas

Gestión de API keys

  • Nunca exponer claves en el código
  • Usar variables de entorno
  • Configurar permisos mínimos necesarios
  • Restringir por repositorio cuando sea posible

Limitaciones y precauciones

  • Los MCPs ejecutan localmente por seguridad
  • Los proveedores no se responsabilizan de errores
  • Siempre pide confirmación para acciones destructivas
  • Revisa siempre el código generado automáticamente

El futuro de MCP

Potencial y oportunidades

  • Democratización del acceso a herramientas IA
  • Integración nativa con más plataformas
  • Transporte HTTP más desarrollado
  • Ecosistema creciente de servidores especializados

Casos de uso prometedores

  • Automatización de workflows de desarrollo
  • Integración con CRMs y sistemas empresariales
  • Análisis de datos en tiempo real
  • Gestión de infraestructura y DevOps

Model Context Protocol representa un cambio fundamental en cómo la IA interactúa con nuestros sistemas. Al proporcionar un puente estándar entre LLMs y herramientas reales, abre posibilidades infinitas para la automatización inteligente y la productividad.

¿Estás listo para conectar tu IA con el mundo real? Comienza experimentando con los ejemplos básicos y gradualmente construye integraciones más complejas. El futuro de la IA práctica está aquí, y MCP es la clave para desbloquearlo.

Recursos

🔓 Solo para suscriptores

Explora los capítulos

1. Introducción y demo inicial con limitaciones de LLMs [09:25]

Introducción y demo inicial con limitaciones de LLMs

[05:05]

Configuración de Cloud Desktop

[04:20]

2. ¿Qué es el Model Context Protocol? [12:38]

¿Qué es el Model Context Protocol?

[02:10]

Arquitectura cliente-servidor de MCP 🔥

[02:48]

Las tools: herramientas controladas por el modelo 🔥

[01:39]

Resources y sampling

[01:25]

Transporters: stdio vs streamable-http

[04:36]

3. Configuración práctica en Visual Studio Code [10:06]

Configuración práctica en Visual Studio Code

[04:02]

Configuración del fichero mcp.json

[02:03]

Ejemplo práctico: contador de caracteres funcionando 🔥

[04:01]

4. Revisión del código del MCP Server [05:52]

Revisión del código del MCP Server

[01:32]

Definición de tools con Zod 🔥

[04:20]

5. Inspector de MCPs: el Postman de los MCPs [08:49]

Inspector de MCPs: el Postman de los MCPs

[02:22]

Conexión y uso del Inspector

[06:27]

6. Ejemplo avanzado: pronóstico del tiempo [11:10]

Ejemplo avanzado: pronóstico del tiempo

[02:39]

Interpretación inteligente de ubicaciones 🔥

[02:36]

Prompts predefinidos en el servidor

[05:55]

7. Demo completa con MCP de GitHub [20:31]

Demo completa con MCP de GitHub

[07:50]

Flujo completo: crear issue desde descripción

[06:10]

Creación de rama y cambios en local

[02:46]

Code review automático 🔥

[03:45]

8. Ejemplo con documentación externa de Astro [03:40]

Ejemplo con documentación externa de Astro

[03:40]

Descubre todo lo que puedes conseguir sucribiéndote a Web Reactiva

Contenido nuevo todas las semanas

Una comunidad de developers colegas en telegram

Desafíos y retos de programación para que mejores tus habilidades

400 horas de contenido en audio y vídeo

Entrevistas y masterclass en directo con los/las mejores profesionales

Precio

24€Matrículaplus15€Al mes

  • Contenido disponible 24/7
  • Audios y videos
  • Retos y desafíos
  • Todo el código descargable
  • Comunidad de developers
  • Acceso premium completo