Cómo mejoré Claude Code con Vercel Agent Skills

BBetter Stack
Computing/SoftwareSmall Business/StartupsInternet Technology

Transcript

00:00:00Esto es Skills By The Cell, un directorio de habilidades para agentes que puedes añadir a cualquier agente
00:00:04para ampliar sus capacidades, como hacerlo increíble en React, convertirlo en un diseñador front-end,
00:00:10o incluso transformarlo en un editor de motion graphics. Todo funciona clonando y escaneando un repositorio
00:00:15para ver si tiene un archivo skills.md antes de instalar la habilidad. ¿Pero hará la nueva propuesta de Cloudflare
00:00:22que este increíble recurso quede obsoleto? Suscríbete y vamos a verlo.
00:00:27Anthropic introdujo las habilidades de agente el año pasado para mejorar las capacidades de Claude en tareas
00:00:32específicas; funcionan añadiendo un directorio de habilidades al directorio .claude y luego añadiendo otra
00:00:37carpeta con el nombre de la habilidad, seguida de un archivo skills.md.
00:00:42Ahora, este archivo debe contener algunos elementos clave. Primero, la sección superior,
00:00:47que es el front matter en YAML, que debe incluir al menos el nombre de la habilidad y la descripción.
00:00:52Luego, debajo de eso, fuera del front matter, es donde deben ir las instrucciones de la habilidad.
00:00:58Las instrucciones se cargan en el contexto del modelo para que pueda usarse en esa tarea específica.
00:01:03Y la belleza de las habilidades reside en una técnica llamada divulgación progresiva, donde al principio
00:01:08solo se muestra la información esencial, y el modelo puede profundizar para encontrar más si es necesario.
00:01:13Así, cuando un agente se carga, solo la información del front matter de cada habilidad se añade al
00:01:19contexto. Tras leer un prompt, revisa la descripción de cada habilidad para ver si alguna
00:01:24puede mejorarlo, y si encuentra una, añade todo lo que está fuera del front matter al contexto activo.
00:01:31Incluso puedes enlazar otros archivos a las habilidades, como referencias, para que el modelo
00:01:36pueda tomarlos si considera que es necesario.
00:01:40Desde entonces, otras compañías como Microsoft, OpenAI y OpenCode han adoptado estas habilidades.
00:01:46Pero no existía una forma fácil de instalar una habilidad para varios agentes sin entrar manualmente
00:01:52al directorio correspondiente y clonar el repositorio. Esto fue evidente cuando Vercel quiso
00:01:58compartir habilidades para sus herramientas y que la gente las pusiera en sus agentes. Así que crearon
00:02:03un proyecto llamado Add Skill, que facilita añadir habilidades a 16 agentes distintos. Basta con un NPX Add Skill,
00:02:11seguido del nombre de la habilidad o la ubicación del repositorio.
00:02:14Seguro te preguntas: ¿qué impide que la gente use Add Skill para añadir cualquier repositorio?
00:02:19Bueno, tras ejecutar el comando, clona el repositorio y busca el archivo skills.md.
00:02:25Si no lo encuentra, limpia todo eliminando el repositorio. Pero si lo encuentra,
00:02:32detecta automáticamente los agentes instalados por el usuario revisando sus configuraciones y crea un
00:02:37enlace simbólico desde .agents/skills hacia donde ese agente necesite las habilidades. Como .cursor para
00:02:44Cursor y .claude para Claude Code. También tiene telemetría de seguimiento, de la que hablaré
00:02:49más adelante. En este punto, Vercel ya tenía una forma de instalar habilidades fácilmente en cualquier agente.
00:02:55¿Pero qué hay de descubrir nuevas habilidades? Aquí entra skills.sh, que muestra una larga lista
00:03:01de habilidades sin categorizar ni paginar. Esta lista se rellena, creo, cuando alguien
00:03:08instala una habilidad usando Add Skill, lo que activa la telemetría del paquete
00:03:14para añadir el nombre, los agentes y otros datos. La telemetría es totalmente anónima
00:03:20y sirve para poblar la lista, contar las descargas de cada habilidad y ver qué agente se usó,
00:03:26lo que también permite rastrear las habilidades que son tendencia en las últimas 24 horas.
00:03:32Además, si te preocupa el rastreo, puedes desactivar la telemetría por completo.
00:03:37Es increíble el trabajo que Vercel Labs ha puesto en el descubrimiento de habilidades; mucha gente
00:03:42la usa para hallar cosas como habilidades de React Native para sus agentes,
00:03:48mejores prácticas para Better Auth e incluso la popular habilidad de ReMotion, que permite
00:03:53crear vídeos increíbles con un solo prompt. ¿Pero ha dejado todo esto en nada la propuesta de Cloudflare?
00:03:59Porque introduce una forma alternativa para que los agentes descubran habilidades,
00:04:05obteniendo primero un ligero archivo JSON de una ubicación conocida que lista todas las habilidades.
00:04:12Así, podrías escribir un prompt como “Crea un proyecto de Cloudflare usando Wrangler”
00:04:18y el agente primero leería el prompt y luego revisaría la ubicación conocida,
00:04:24como [cloudflare.com/well-known](https://www.google.com/search?q=https://cloudflare.com/well-known) (que en realidad será algo como /skills) y recuperaría
00:04:30el archivo index.json que incluye información obligatoria por habilidad: nombre, descripción y archivos.
00:04:38Después, pasa esta información al agente y, basándose en el prompt, el agente se dará cuenta
00:04:44de que necesita la habilidad de Wrangler de esa ubicación conocida basándose en el archivo index.json.
00:04:49Entonces hará una llamada a esa ubicación para obtener todos los archivos de esa habilidad
00:04:55y los guardará en caché por si se usan en el futuro, empleándola para la respuesta al usuario.
00:05:01Aunque la propuesta de Cloudflare suena genial, añade pasos extra para hacer una habilidad
00:05:08descubrible, como añadir ese archivo index.json con la información pertinente
00:05:14y alojarlo en una URL específica. Comparado con poner una habilidad en GitHub
00:05:20y que Vercel la encuentre, creo que el enfoque de Cloudflare perjudica a los desarrolladores
00:05:27más pequeños por estos pasos extra. Si esto se acepta (y no estoy seguro de quién lo revisa
00:05:33o debe aceptarlo), significaría el fin del proyecto skills.sh de Vercel.
00:05:40Sin embargo, seguro que hay una forma en la que podrían coexistir, ya que podrías usar skills.sh
00:05:46para encontrar habilidades de desarrolladores independientes y menos conocidos,
00:05:52y usar el enfoque de Cloudflare para que un agente las descubra automáticamente de grandes empresas.
00:05:57De cualquier manera, con los desarrolladores creando proyectos increíbles con estas habilidades,
00:06:03necesitarás rastreo de errores por si algo explota sin que te des cuenta. Aquí entra Better Stack,
00:06:07porque no solo ingiere registros de tu back-end, sino que también puede rastrear errores de front-end
00:06:12usando su seguimiento de errores nativo de IA. Y para rematar, Better Stack también puede crear
00:06:18páginas de estado preciosas; así que echa un vistazo a Better Stack hoy mismo.
00:06:23beautiful status pages so go ahead and check out better stack today.

Key Takeaway

La evolución de las habilidades para agentes de IA se debate entre el ecosistema abierto de repositorios de Vercel y la propuesta de descubrimiento automático mediante archivos de índice estandarizados de Cloudflare.

Highlights

Vercel presenta 'Add Skill' para facilitar la instalación de habilidades en 16 agentes de IA diferentes.

Las habilidades funcionan mediante un archivo 'skills.md' que utiliza front matter en YAML para el nombre y descripción.

La técnica de 'divulgación progresiva' optimiza el contexto del modelo cargando solo información esencial inicialmente.

Cloudflare propone un estándar alternativo basado en un archivo 'index.json' alojado en URLs conocidas.

Existe un debate sobre si el enfoque de Cloudflare podría perjudicar a desarrolladores pequeños frente al modelo de GitHub de Vercel.

Vercel utiliza telemetría anónima en 'skills.sh' para crear un ranking de tendencias y facilitar el descubrimiento.

Timeline

Introducción a Skills y Vercel Agent Skills

El video comienza presentando el directorio de habilidades de Vercel, diseñado para ampliar las capacidades de agentes en áreas como React o diseño front-end. Se explica que el sistema funciona clonando y escaneando repositorios en busca de un archivo específico denominado skills.md. Anthropic fue pionero en este concepto al introducir directorios de habilidades dentro de la carpeta oculta .claude el año pasado. El autor detalla que el archivo debe contener front matter en formato YAML con el nombre y la descripción técnica. Estas instrucciones se cargan directamente en el contexto del modelo para guiarlo en tareas específicas de programación o edición.

Divulgación Progresiva y Adopción del Estándar

Se analiza la técnica de divulgación progresiva, la cual permite que el modelo gestione el contexto de forma eficiente mostrando solo lo esencial al inicio. El agente revisa la descripción de cada habilidad y solo añade las instrucciones completas si detecta que son necesarias para el prompt del usuario. Este enfoque ha sido adoptado por gigantes tecnológicos como Microsoft y OpenAI para mejorar sus propios flujos de trabajo. Vercel identificó la dificultad de instalar estas habilidades manualmente y lanzó el proyecto 'Add Skill'. Mediante un simple comando NPX, los usuarios pueden ahora inyectar funcionalidades en múltiples agentes de manera automatizada.

Funcionamiento de Add Skill y Telemetría

El proceso técnico de Add Skill incluye la clonación del repositorio y la verificación obligatoria del archivo de habilidades para evitar instalaciones fallidas. El sistema crea enlaces simbólicos automáticamente hacia los directorios de configuración de herramientas populares como Cursor o Claude Code. Se menciona la importancia de la telemetría anónima, que permite a Vercel rastrear qué habilidades son tendencia y cuáles son los agentes más utilizados. El portal skills.sh sirve como un mercado visual para descubrir nuevas herramientas, desde React Native hasta ReMotion para video. Los usuarios preocupados por la privacidad tienen la opción de desactivar este rastreo de datos en cualquier momento.

La Propuesta de Cloudflare y el Futuro del Descubrimiento

Cloudflare ha introducido una propuesta alternativa que utiliza un archivo JSON ligero en una ubicación conocida del servidor, como /skills. En este modelo, el agente consulta primero un índice para decidir qué archivos descargar y guardar en caché para futuras interacciones. El autor argumenta que este método añade pasos burocráticos adicionales que podrían dificultar la visibilidad de los desarrolladores independientes. Aunque el sistema de Cloudflare parece más estructurado para grandes empresas, requiere alojar archivos en URLs específicas en lugar de usar simplemente GitHub. Se plantea la duda sobre quién tiene la autoridad para estandarizar estos protocolos en la industria de la IA.

Coexistencia de Estándares y Conclusión

El video concluye sugiriendo que ambos enfoques, el de Vercel y el de Cloudflare, podrían coexistir para diferentes casos de uso. El portal de Vercel seguiría siendo ideal para el software de código abierto y desarrolladores pequeños, mientras que Cloudflare serviría para integraciones corporativas oficiales. Se destaca que, independientemente del estándar, el crecimiento de estas habilidades aumenta la complejidad y la posibilidad de errores en el código. Por ello, se recomienda el uso de herramientas como Better Stack para el rastreo de errores asistido por IA y la gestión de registros. Finalmente, se invita a los espectadores a explorar estas nuevas capacidades para optimizar sus agentes de desarrollo.

Community Posts

View all posts