Menú de la documentación

Biblioteca de prompts
Copia, pega, revisa.

Estos son prompts listos para copiar con los que crear y mantener un sitio web de vagejs con un agente de programación con IA, desde escribir la primera página hasta traducir una o publicar con seguridad.

¿Empiezas un sitio nuevo? El creador de prompts te escribe el primer prompt a partir de unas pocas respuestas. Estos prompts funcionan con cualquier agente de programación que pueda leer tu proyecto, ya sea Claude Code, Codex, Cursor, Copilot o Gemini CLI. Cada uno remite al agente a AGENTS.md, deja los datos en tus manos y termina con una revisión, así que obtienes un sitio que funciona en lugar de una suposición dicha con seguridad. Sustituye las partes en mayúsculas.

Empieza un sitio nuevo

Lee AGENTS.md. Este sitio es para MI NEGOCIO, que HACE QUÉ para QUIÉN. Escribe una página de inicio con un titular claro de una frase, tres secciones cortas y un enlace de contacto. Pregúntame cualquier cosa que, si no, tendrías que inventarte. Luego ejecuta npm run check hasta que informe de 0 errores.
Crea este diseño de Figma como una página de este sitio vagejs: ENLACE DE FIGMA. Lee AGENTS.md primero. Usa las herramientas MCP de Figma y pide HTML y CSS simples, no React ni Tailwind. Pon el aspecto en un layout y en public/styles.css, y todo el texto en la página Markdown, exactamente como en el diseño. Guarda las imágenes en public/images/ con texto alternativo. Nada de JavaScript en el navegador. Ejecuta npx vage check y npx vage audit, corrige lo que indiquen y enumera lo que no pudiste reproducir.

Consulta cómo convertir un diseño de Figma en un sitio web (en inglés) para la configuración y el prompt de seguimiento.

Sugiere las páginas que necesita este sitio, a partir de las notas de abajo. Para cada página dame un título, una descripción de menos de 160 caracteres y la URL. No crees nada hasta que apruebe la lista.

NOTAS

Añade y edita contenido

Añade una página en /SLUG-DE-LA-PÁGINA/ a partir del texto de abajo. Mantén mis palabras, corrige solo la ortografía y escribe una descripción de menos de 160 caracteres. Ejecuta npm run check.

TEXTO
Escribe una entrada de blog titulada "TÍTULO" a partir de estas notas. Usa type: article, y pon author y datePublished solo con lo que te doy aquí: AUTOR, FECHA. Ejecuta npm run check cuando termines.
Cambia /SLUG-ANTIGUO/ a /SLUG-NUEVO/. Mueve el archivo, añade una redirección en vage.config.ts y actualiza todos los enlaces que apuntaban a la dirección antigua. Compruébalo con npm run check.

Idiomas y componentes

Traduce /SLUG-DE-LA-PÁGINA/ a IDIOMA. Si el sitio aún no tiene ajuste i18n, añade primero i18n: { locales: ["CÓDIGO-IDIOMA"] } a vage.config.ts. Guarda la traducción en src/pages/CÓDIGO-IDIOMA/ con el mismo nombre de archivo, traduce también el título y la descripción, y no añadas datos que no estén en el original. Ejecuta npm run check y enumera las páginas que aún hay que traducir.
Haz interactivo el componente NOMBRE-DEL-COMPONENTE de /SLUG-DE-LA-PÁGINA/, para que DESCRIBE LO QUE DEBE HACER. Mantenlo en src/components/, pásale solo datos sencillos (texto, números, listas) y usa client:visible salvo que esté en la parte superior de la página. Si la página es un archivo .md, conviértela primero en .mdx. Después ejecuta npm run audit, dime cuánto JavaScript carga ahora la página y dime si el HTML plano podría hacer lo mismo.

Corrige problemas

Ejecuta npx vage check --json. Corrige todos los errores, archivo por archivo. Luego enumera los avisos que no hayas podido corregir y explica por qué.
Ejecuta npm run audit y explica los resultados en un lenguaje sencillo. Corrige lo que puedas sin cambiar el aspecto de las páginas, y dime qué necesita una decisión mía.
La página /SLUG-DE-LA-PÁGINA/ se ve mal: DESCRIBE LO QUE VES. Encuentra la causa, corrígela y ejecuta npm run check.

Búsqueda y visibilidad en IA

Revisa el título y la descripción de cada página. Señala los títulos de más de 60 caracteres, las descripciones de más de 160 y cualquier par de páginas que traten el mismo tema. Sugiere correcciones, pero no cambies nada todavía.
Los datos de nuestro negocio son: NOMBRE, SITIO WEB, RUTA DEL LOGO. Añádelos como datos estructurados de Organization en vage.config.ts, usando solo estos datos. Ejecuta npm run check.
Queremos permitir los rastreadores de búsqueda con IA, pero no los de entrenamiento de IA. Actualiza los ajustes de robots en vage.config.ts y luego enséñame el robots.txt generado.

Analítica

Añade Google Analytics 4 con el ID de medición G-XXXXXXX. Léelo de una variable de entorno en lugar de escribirlo en el código, y empieza con el consentimiento en denied. Ejecuta npm run check.
Registra los clics en el botón "Reservar una llamada" como un evento llamado book_call. Declara el evento en vage.config.ts y usa data-vage-event en el enlace, sin JavaScript propio.

Publica con seguridad

Ejecuta npx vage deploy:github --dry-run y enséñame exactamente qué archivos se incluirían en el commit. No hagas push de nada.
Prepara el sitio para publicarlo: ejecuta check, build y audit, y resume lo que debería corregir primero. Detente antes de publicar. El deploy lo ejecutaré yo.

Consejos para obtener mejores resultados

  • Dale los datos. Pega tus notas, tus precios o tu horario. Un agente que tiene que adivinar, adivinará.
  • Pide primero un plan en los cambios grandes: "Enséñame el plan antes de editar nada".
  • Una tarea por prompt. Los pasos pequeños y revisados son más fáciles de comprobar que un gran cambio.
  • Termina siempre con una revisión. npm run check es como sabes que el sitio sigue funcionando.

Empieza con un solo comando.
Tendrás un sitio funcionando en un minuto.

npm create vagejs@latest my-site

Leer la documentaciónÚsalo con tu asistente de IA