Agregar Agentation a proyectos Next.js
Los equipos necesitan comentarios visuales durante el desarrollo con Next.js. Esta habilidad instala Agentation y agrega una barra de herramientas solo para desarrollo a proyectos con App Router o Pages Router.
Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.
Review the Skillstore skill "agentation" from https://skillstore.io/skills/benjitaylor-agentation.md and its manifest at https://skillstore.io/api/skills/benjitaylor-agentation/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.
Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.
Usando "agentation". Agrega Agentation a mi proyecto con App Router.
Resultado esperado:
Agentation está instalado, importado en el layout raíz y se renderiza solo en desarrollo.
Usando "agentation". Comprueba si Agentation ya está configurado.
Resultado esperado:
El proyecto ya importa Agentation y renderiza la barra de herramientas, por lo que no se agregó una configuración duplicada.
Usando "agentation". Configura comentarios visuales en una aplicación con Pages Router.
Resultado esperado:
Agentation está instalado y agregado al componente de aplicación personalizado detrás de una protección solo para desarrollo.
Three findings confirm instructions to run fixed package or MCP commands, which introduce ordinary dependency and tool execution risk. The other detections are markdown syntax, file names, a documentation link, or a development-only NODE_ENV check. No prompt injection, credential access, or malicious intent was found.
Estas son capacidades locales reales que pueden esperarse para esta habilidad, por lo que requieren revisión, pero no se cuentan como comportamiento malicioso confirmado.
Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.
https://skillstore.io/skills/benjitaylor-agentation/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/benjitaylor-agentation?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/benjitaylor-agentation?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/benjitaylor-agentation/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/benjitaylor-agentation.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>benjitaylor. (2026). agentation security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/benjitaylor-agentation/audits/6@techreport{benjitaylor-benjitaylor-agentation-2026,
author = {benjitaylor},
title = {agentation security audit report (audit version 6)},
institution = {Skillstore},
year = {2026},
number = {6},
url = {https://skillstore.io/skills/benjitaylor-agentation/audits/6},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "agentation security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
- name: "benjitaylor"
date-released: "2026-07-23"
url: "https://skillstore.io/skills/benjitaylor-agentation/audits/6"
identifiers:
- type: other
value: "skillstore:benjitaylor-agentation:audit:6"
description: "Skillstore immutable audit report identifier"
Instala Agentation para que los diseñadores puedan anotar pantallas mientras los desarrolladores ejecutan la aplicación Next.js localmente.
Aplica la misma configuración de barra de herramientas en proyectos con App Router y Pages Router.
Agrega una capa de anotación solo para desarrollo antes de una sesión de revisión de diseño.
Agrega Agentation a este proyecto Next.js y mantenlo disponible solo durante el desarrollo.
Comprueba si Agentation ya está instalado y configurado. Si falta, agrega la configuración estándar.
Detecta si este proyecto usa App Router o Pages Router, luego agrega Agentation en el archivo de entrada correcto.
Revisa el proyecto para detectar una configuración existente de Agentation, instala el paquete si es necesario, intégralo y resume los pasos de verificación.
Autor
benjitaylorLicencia
MIT
Revisión de Skillstore
r2
Aviso de versión
El autor no declaró una versión.
Ref.
8c3e20bba512c392d9b02ee748b18e0b09d4982c
Actualidad del mantenimiento
29/7/2026
Uso
6 descargas · 159 vistas
Estructura de archivos
📄 SKILL.md
Crea aplicaciones fullstack con orientación sénior
por alirezarezvani
Los proyectos fullstack suelen necesitar una configuración coherente, decisiones de arquitectura y controles de calidad. Esta skill proporciona scripts y referencias para trabajos con React, Next.js, Node.js, GraphQL y PostgreSQL.
Implementar transiciones de vista en React
por vercel-labs
Las transiciones de vista en React son fáciles de colocar incorrectamente, lo que provoca animaciones silenciosas o ruidosas. Esta skill guía las decisiones de animación de rutas, Suspense, listas y elementos compartidos.
Desarrolla funcionalidades frontend listas para producción
por davila7
Los equipos de frontend necesitan directrices coherentes sobre React y Next.js en todos sus proyectos. Esta habilidad proporciona flujos de trabajo de referencia, prácticas de calidad y scripts auxiliares para el análisis del frontend.
Optimizar el rendimiento de Next.js
por Atman36
Las aplicaciones de Next.js pueden volverse lentas por bundles grandes, caché débil y medios sin optimizar. Esta habilidad guía a Claude, Codex y Claude Code a través de mejoras de rendimiento enfocadas para apps de producción.
Optimizar el rendimiento de React y Next.js
por vercel-labs
Las apps de React y Next.js a menudo pierden velocidad por waterfalls, bundles grandes y re-renderizados evitables. Esta skill ofrece a los agentes reglas concretas para realizar cambios más seguros centrados en el rendimiento.
Crear componentes React con seguridad de tipos
por softaworks
El trabajo con React TypeScript suele necesitar tipos precisos para eventos, hooks y rutas. Esta skill proporciona patrones enfocados para componentes tipados, APIs de React 19 y enrutamiento.