# El generador de sitios estáticos Hecho para crear webs con IA

> vagejs es un generador de sitios estáticos gratuito para crear webs con IA. Escribe páginas como archivos de texto y obtén un sitio rápido y revisado.

[Novedad: empieza tu sitio con tu asistente de IA](https://vagejs.com/changelog/)

Escribe páginas como archivos de texto plano, o deja que las escriba tu asistente de programación con IA: Claude Code, Cursor, Codex, Copilot o Gemini CLI. vagejs es un generador de sitios estáticos gratuito y de código abierto que las convierte en un sitio web rápido y seguro que los buscadores y los asistentes de IA entienden.

`npm create vagejs@latest my-site`

Copia el comando · necesitas Node.js 22.12 o una versión más reciente

Licencia MIT · v0.16.2 · [Código abierto en GitHub](https://github.com/agevenkat/vagejs) · [Informe de Lighthouse](https://vagejs.com/reports/lighthouse-starter/)

[Primeros pasos](https://vagejs.com/es/docs/getting-started/)[Úsalo con Claude Code](https://vagejs.com/agents/claude-code/)[Pide a tu asistente de IA que cree tu sitio](https://vagejs.com/prompts/builder/)

-   Saca 100 en Lighthouse desde el primer momento
-   Archivos de SEO y de búsqueda con IA incluidos
-   React, Vue y MDX, sin JavaScript por defecto
-   Sitios en varios idiomas

~/projects

1.  $ npm create vagejs@latest my-site
2.  Created ~/projects/my-site
3.  Install and start the site now? (Y/n) y
4.  added 80 packages in 9s
5.  Build your site with: 1. Claude Code 2. Codex 3. The browser editor 4. Just open the site
6.  Choose a number (Enter for 1): 1
7.  vagejs dev server running at http://localhost:5173/
8.  same server: http://\[::1\]:5173/
9.  editor: http://\[::1\]:5174/ (edit pages in your browser; only on this computer)
10.  Starting Claude Code in my-site.

Tu asistente de IA

-   Claude Code
-   Cursor
-   GitHub Copilot
-   OpenAI Codex
-   Gemini CLI

[Guías para cada asistente](https://vagejs.com/es/agents/)

Tu hosting

-   Cloudflare
-   Netlify
-   GitHub Pages
-   Vercel
-   Cualquier hosting estático

[Todas las opciones de publicación](https://vagejs.com/docs/deployment/)

## ¿No eres desarrollador? Crea tu sitio web con un asistente de IA.

### Deja que tu asistente de IA lo configure

Pega uno de nuestros prompts listos para usar en Claude Code, Cursor u otro asistente de programación con IA. Crea el sitio, añade tus páginas y las revisa, y tú apruebas cada paso.

[Crea tu prompt](https://vagejs.com/prompts/builder/) [Herramientas web gratis](https://vagejs.com/tools/)

### O encárgaselo a una agencia

Estas agencias crean y mantienen sitios de vagejs para sus clientes.

-   [![GetGTM](https://vagejs.com/partners/getgtm.svg)](https://getgtmos.com)
-   [Añade tu agencia](https://vagejs.com/partners/)

[Sobre el programa de partners](https://vagejs.com/partners/)

## Tú pides. Tu asistente de IA construye. vagejs revisa cada página antes de publicarla.

Cuando creas un sitio, eliges tu asistente y este empieza con un primer prompt que configura el sitio contigo. Cada sitio nuevo incluye un archivo de instrucciones, AGENTS.md, que le dice a tu asistente los comandos y las reglas. Así crea las páginas como debe, corrige lo que encuentra la revisión y te pregunta antes de publicar nada.

1.  **Tu petición**Añade una página de precios
2.  **Asistente de IA**Sigue AGENTS.md
3.  **Archivos de página**src/pages/pricing.md
4.  **vage check**Enlaces, títulos, accesibilidad
5.  **Tú apruebas**Primero ves el plan
6.  **Sitio en línea**Termina solo cuando responde

1.  ### Tú pides
    
    Describe la página que quieres, con tus propias palabras.
    
2.  ### Escribe la página
    
    La página es un archivo de texto plano que puedes leer y editar tú mismo.
    
3.  ### vagejs la revisa
    
    La revisión indica el archivo y el problema exactos, y el asistente lo corrige antes de que lo veas.
    
4.  ### Tú apruebas la publicación
    
    Primero ves el plan. Se publica solo cuando dices que sí, y solo dice que ha terminado cuando tu sitio responde.
    

[Configúralo con tu asistente de IA](https://vagejs.com/es/agents/)

## Edita en tu navegador. Ve la página mientras escribes.

npm run dev también abre un editor local: los siguientes pasos para un sitio nuevo, todas las páginas, un formulario para sus datos, el texto con una vista previa en directo con el diseño de tu sitio, subida de imágenes y los resultados de la revisión. Edita los mismos archivos que tu asistente de IA, y nunca forma parte de tu sitio publicado.

![El editor de vagejs: el título, la descripción, la fecha y el autor de una entrada de blog en un formulario a la izquierda, y una vista previa en directo de la página con el diseño del sitio a la derecha.](https://vagejs.com/images/editor-1440.webp)

[Cómo funciona el editor](https://vagejs.com/docs/content-authoring/#edit-in-your-browser)

## Sitios reales, hechos con vagejs. Ejemplos de sitios estáticos, con el código para copiar.

[Ver los ejemplos](https://vagejs.com/showcase/)

-   [![La página de inicio del ejemplo de portafolio: un título grande, "I design calm software for complicated services", sobre un dibujo de una app de móvil.](https://vagejs.com/images/showcase/portfolio.webp)](https://portfolio.vagejs.com/)
    
    ### [Portafolio](https://portfolio.vagejs.com/)
    
    El portafolio de una diseñadora, con casos de estudio y una sección de artículos.
    
    [Visitar el sitio](https://portfolio.vagejs.com/)[Código fuente](https://github.com/agevenkat/vagejs-examples/tree/main/portfolio)
    
-   [![Una página del ejemplo de documentación: una barra lateral oscura con la lista de páginas, junto a la página Configuration.](https://vagejs.com/images/showcase/docs.webp)](https://docs-demo.vagejs.com/)
    
    ### [Sitio de documentación](https://docs-demo.vagejs.com/)
    
    Documentación de una herramienta de línea de comandos, con una barra lateral creada a partir de las propias páginas.
    
    [Visitar el sitio](https://docs-demo.vagejs.com/)[Código fuente](https://github.com/agevenkat/vagejs-examples/tree/main/docs-site)
    
-   [![La página de inicio del ejemplo de panadería: el título "Fresh bread on Example Street" junto a una pizarra con lo que sale del horno cada día.](https://vagejs.com/images/showcase/bakery.webp)](https://bakery.vagejs.com/)
    
    ### [Negocio local](https://bakery.vagejs.com/)
    
    Una panadería con su carta, su horario y sus novedades, lista para las búsquedas locales.
    
    [Visitar el sitio](https://bakery.vagejs.com/)[Código fuente](https://github.com/agevenkat/vagejs-examples/tree/main/bakery)
    

## Todo lo que necesita un sitio de contenido. SEO, sitemaps y llms.txt, incluidos.

-   ### Escribir
    
    Las páginas son archivos de texto o MDX. Las plantillas, en TypeScript, React o Vue.
    
    -   #### [Páginas a partir de archivos](https://vagejs.com/docs/content-authoring/)
        
        Pon un archivo de texto en una carpeta y ya es una página. Etiqueta las páginas por tema, mantén ocultos los borradores o pon fecha a una entrada para publicarla más tarde.
        
        `Cómo se usa: src/pages/pricing.md → /pricing/`
    -   #### [Edita en tu navegador](https://vagejs.com/docs/content-authoring/#edit-in-your-browser)
        
        Un formulario para cada página, una vista previa en directo con tu diseño y los siguientes pasos para un sitio nuevo, en tu propio ordenador. O edita los archivos directamente.
        
        `Cómo se usa: npm run dev`
    -   #### [React, Vue y MDX](https://vagejs.com/es/features/react-vue-mdx/)
        
        Escribe las plantillas como componentes y las páginas como MDX. Se convierten en HTML plano, y solo los componentes que marques como interactivos se ejecutan en el navegador.
        
        `Cómo se usa: <Counter client:load />`
    -   #### [Imágenes más ligeras](https://vagejs.com/docs/content-authoring/)
        
        Las fotos reciben copias redimensionadas en WebP y AVIF, y cada navegador elige el tamaño que necesita.
        
        `Cómo se usa: images: { optimize: true }`
-   ### Que te encuentren
    
    Los buscadores y los asistentes de IA reciben una imagen precisa de cada página.
    
    -   #### [Sitemap, robots.txt y llms.txt](https://vagejs.com/docs/seo/)
        
        Hechos a partir de las páginas que existen de verdad, además de feeds RSS y copias en Markdown de las páginas para herramientas de IA.
        
        `Cómo se usa: npm run build`
    -   #### [Vistas previas en buscadores y redes](https://vagejs.com/docs/seo/)
        
        Resúmenes de página, una imagen para compartir en cada página, migas de pan y datos estructurados que ayudan a Google y a los asistentes de IA a entender cada página.
        
        `Cómo se usa: defaultImage: "/images/og.png"`
    -   #### [Sitios en varios idiomas](https://vagejs.com/es/features/multi-language-sites/)
        
        Una carpeta para cada idioma, las etiquetas de idioma correctas en cada página y una revisión de las traducciones que faltan.
        
        `Cómo se usa: i18n: { locales: ["fr"] }`
    -   #### [Tú eliges los rastreadores de IA](https://vagejs.com/docs/seo/)
        
        Permite o bloquea por separado los rastreadores de entrenamiento de IA y los de búsqueda con IA.
        
        `Cómo se usa: robots: { aiTraining: "disallow" }`
-   ### Revisar y proteger
    
    Los problemas aparecen en tu ordenador, antes de que los vean tus visitantes.
    
    -   #### [Revisión del sitio incluida](https://vagejs.com/docs/checks/)
        
        Detecta enlaces rotos, datos que faltan y fallos de accesibilidad, y te señala el archivo.
        
        `Cómo se usa: npx vage check`
    -   #### [Auditorías de velocidad y accesibilidad](https://vagejs.com/docs/checks/)
        
        Límites de tamaño para cada página, reglas de accesibilidad y Lighthouse cuando lo quieras.
        
        `Cómo se usa: npx vage audit`
    -   #### [Protegido contra la inyección de spam](https://vagejs.com/docs/security/)
        
        Los scripts ocultos y los enlaces a sitios web no aprobados nunca llegan a tus páginas.
        
        `Cómo se usa: npx vage links`
    -   #### [Sin secretos filtrados](https://vagejs.com/docs/security/)
        
        Las contraseñas, las claves de API y los archivos .env nunca se publican, y nunca se sobrescribe el trabajo de nadie.
        
        `Cómo se usa: npx vage deploy`
-   ### Publicar y crecer
    
    Publica con un solo comando y luego mira cómo te encuentra la gente.
    
    -   #### [Publicación con un solo comando](https://vagejs.com/docs/deployment/)
        
        Cloudflare, Netlify o GitHub Pages. Primero apruebas un plan, y tu sitio sigue en línea mientras se publica.
        
        `Cómo se usa: npx vage deploy`
    -   #### [Formularios de contacto](https://vagejs.com/docs/deployment/#contact-form)
        
        Un formulario que te envía un correo, con protección contra spam y sin JavaScript, en Cloudflare.
        
        `Cómo se usa: contact: { to, from }`
    -   #### [Analítica que respeta la privacidad](https://vagejs.com/docs/configuration/)
        
        Google Analytics, Tag Manager, Plausible o Clarity. Desactivada hasta que la actives, y espera al consentimiento.
        
        `Cómo se usa: ga4: { measurementId: "G-…" }`
    -   #### [Informes de búsqueda e IndexNow](https://vagejs.com/docs/deployment/)
        
        Las cifras de Search Console en la terminal, y un aviso a los buscadores cuando cambian las páginas.
        
        `Cómo se usa: npx vage report search`

[Ver todas las funciones](https://vagejs.com/es/features/) [Cómo se compara vagejs](https://vagejs.com/compare/)

## Rápido desde el primer momento. 100 en Lighthouse, 0 KB de JavaScript.

Probamos un sitio de vagejs recién creado con Lighthouse, la herramienta de Google. Sacó un 100 perfecto en todas las categorías, y la página cargó en menos de un segundo con una conexión de móvil simulada.

-   **100**Puntuación en Lighthouse
    
    En rendimiento, accesibilidad, prácticas recomendadas y SEO, en un sitio recién creado.
    
-   **0.8 s**Contenido principal visible
    
    Con una conexión de móvil lenta simulada (Largest Contentful Paint).
    
-   **0 KB**JavaScript enviado
    
    Las páginas son HTML plano. Solo se añade JavaScript donde tú lo añades, como en un componente interactivo.
    
-   **0.5 s**Para generar el sitio
    
    Para el sitio inicial de cuatro páginas, listo para publicar.
    

100Rendimiento

100Accesibilidad

100Prácticas recomendadas

100SEO

3/3Navegación con agentes

Ver todas las cifras y cómo las medimos

| Métrica | Plantilla de vagejs | Bueno es |
| --- | --- | --- |
| Aparece el contenido principal (LCP) | 0.8 s | menos de 2.5 s |
| Saltos del diseño (CLS) | 0 | menos de 0.1 |
| Tiempo que la página está bloqueada (TBT) | 0 ms | cuanto menos, mejor |
| Aparece el primer texto (FCP) | 0.6 s | cuanto menos, mejor |
| JavaScript enviado a los visitantes | 0 KB | cuanto menos, más rápido |
| Datos descargados | 1.7 KB en 2 solicitudes | cuanto menos, más rápido |
| Tiempo para generar el sitio | 0.5 s para 4 páginas | cuanto más rápido, mejor |

Cómo lo medimos: un sitio nuevo creado con npm create vagejs@latest (vagejs 0.16.1), probado con Lighthouse 13.5.0 con la configuración para móvil y una red lenta simulada el 28 de octubre de 2026. Lo ejecutamos dos veces y obtuvimos las mismas cifras las dos veces. Son resultados de laboratorio. Google también tiene en cuenta datos de visitantes reales, y tus propias cifras dependerán de tus imágenes, tu contenido y tu hosting.

## Lo que la gente pregunta. Respuestas claras.

### ¿Qué tipo de sitios web puedo crear con vagejs?

Sitios web de contenido, como sitios de empresa, blogs, documentación, portafolios y sitios para una tienda, una cafetería o una clínica. Nuestra sección de ejemplos tiene un portafolio, un sitio de documentación y una panadería en línea que puedes copiar. Para aplicaciones con inicio de sesión y datos en directo, encaja mejor un framework de aplicaciones.

### ¿Qué velocidad tiene un sitio de vagejs?

Un sitio de vagejs recién creado obtuvo 100 en todas las categorías de Lighthouse, mostró su contenido principal en 0.8 s con una conexión móvil lenta simulada y envió 0 KB de JavaScript. Son resultados de laboratorio del 28 de octubre de 2026, y tus propias cifras dependerán de tus imágenes, tu contenido y tu hosting.

### ¿Cómo creo un sitio web con Claude Code, Codex o Cursor?

Ejecuta npm create vagejs@latest my-site y elige tu asistente cuando te lo pregunte. Empieza con un primer prompt que configura el sitio contigo. O pide a tu asistente que cree un sitio con vagejs: cada sitio nuevo incluye un archivo AGENTS.md que le dice los comandos y las reglas.

### ¿Cómo evita vagejs que los asistentes de IA publiquen errores?

vage check lee cada página antes de publicarla y nombra el archivo responsable de cada enlace roto, título que falta o dato estructurado no válido, para que tu asistente lo corrija primero. Los enlaces a sitios web que no has aprobado hacen fallar la revisión, y no se publica nada hasta que dices que sí.

### ¿Dónde están mis páginas?

En archivos Markdown sencillos en la carpeta src/pages de tu proyecto, y el lugar de cada archivo decide su dirección: src/pages/pricing.md se convierte en /pricing/. Tu asistente de IA y el editor del navegador cambian los mismos archivos, así que todo tu contenido se queda en archivos que te pertenecen.

### ¿Cómo publico mi sitio?

Ejecuta npx vage deploy. Revisa el sitio, te muestra un plan y publica en GitHub Pages, Cloudflare o Netlify solo después de que digas que sí, y solo dice que ha terminado cuando tu sitio responde. Cualquier otro hosting estático, como Vercel, puede servir la carpeta dist generada.

[Ver todas las preguntas](https://vagejs.com/es/faq/)[Guías paso a paso](https://vagejs.com/guides/)
