Creadores de sitios web basados en IA: cómo integrar el código generado en un CMS

Creadores de sitios web basados en IA: cómo integrar el código generado en un CMS

La última milla que nadie tiene en cuenta

Describe una página de destino a Claude Code, Lovable, v0 o bolt.new y tendrás algo en pantalla en menos de un minuto. Tiene buen aspecto. Es adaptativa. Es, de verdad, una interfaz que funciona. Y entonces el proyecto se detiene, porque una interfaz que funciona no es una página web que tu equipo de marketing pueda poner en marcha.

La brecha entre esas dos cosas es donde la mayoría de las creaciones generadas por IA mueren en silencio. No porque el código sea malo, sino porque todas estas herramientas producen React, y ni WordPress ni HubSpot ejecutan React como capa de contenido. Alguien tiene que hacer la conversión —y ese alguien suele ser un desarrollador con dos semanas libres.

Lo que estas herramientas te ofrecen realmente

Los ocho generadores sobre los que más nos preguntan resuelven todos el mismo problema inicial —pasar de una idea a una interfaz renderizada— y difieren considerablemente en lo que te queda en las manos después.

Herramienta Dónde trabajas Qué se obtiene
Lovable Navegador, basado en comandos React con Vite, sincronizado con GitHub
v0 Navegador, interfaz de usuario basada en comandos de Vercel Next.js, con un uso intensivo de Tailwind y shadcn/ui
bolt.new Navegador, StackBlitz WebContainers Un proyecto completo que se ejecuta en un entorno aislado
Replit Espacio de trabajo en la nube Una aplicación desplegada en el propio alojamiento de Replit
Claude Code Tu terminal Archivos en tu repositorio, ya en Git
Builder.io Editor visual o Visual Copilot Componentes conectados al SDK de Builder
Figma Make Dentro de tu archivo de Figma Componentes de React que contienen tus tokens de diseño
Rocket Navegador, en rocket.new Una aplicación full-stack generada

Vuelve a leer esa tercera columna. Cada fila es una aplicación de JavaScript. Ninguna de ellas es un tema de CMS.

Por qué falla el traspaso

1. Los modelos de renderizado no son compatibles

WordPress renderiza plantillas PHP. HubSpot renderiza módulos HubL del lado del servidor. React renderiza en el navegador o en un servidor Node. No se trata de preferencias de estilo, sino de modelos de ejecución diferentes, y ningún botón de exportación puede conciliarlos. Por eso, «basta con exportar el código» nunca zanja la cuestión.

2. Desaparece la capacidad de edición

La ventaja de un CMS es que alguien que no sabe programar puede cambiar un titular un viernes por la tarde. Un componente de React no tiene campos editables, ni espacios para arrastrar y soltar, ni nada que el editor de páginas pueda ver. Si lo integras como una aplicación incrustada, técnicamente habrás lanzado un sitio web, pero habrás eliminado la única razón por la que la empresa quería un CMS.

3. Falta todo lo que rodea a las páginas

Una navegación que conozca la estructura del sitio. Un blog con categorías y paginación. Formularios que se conecten con el CRM. Enrutamiento multilingüe. Redireccionamientos. Tu aplicación de IA tiene una página de inicio; un sitio web tiene todo lo anterior, y nada de ello se genera automáticamente por ti.

Qué debe significar «listo para producción»

Antes de considerar que una aplicación generada por IA está lista para su lanzamiento, vale la pena compararla con lo que el CMS realmente espera:

  • Plantillas nativas: PHP auténtico para WordPress, HubL auténtico para HubSpot, no un iframe, una aplicación de página única montada ni código JavaScript.
  • Campos editables definidos: cada titular, imagen y llamada a la acción (CTA) visible en el editor, con valores predeterminados razonables.
  • Módulos reutilizables: secciones que tu equipo puede recombinar en páginas que nunca hayas diseñado.
  • HTML renderizado por el servidor: para que los motores de búsqueda indexen el contenido en lugar de una estructura vacía.
  • Infraestructura funcional del sitio: menús, blog, formularios, variantes de idioma y URL canónicas.

La mayoría de las soluciones basadas en IA no cumplen ninguno de estos requisitos desde el primer día. Esto no es una crítica a las herramientas: se crearon para generar interfaces, no para proporcionar un sistema de gestión de contenidos.

Dos destinos, una decisión

El CMS al que te pases importa menos de lo que la gente cree, y el factor decisivo rara vez es técnico.

Elige WordPress si quieres ser el propietario del alojamiento, acceder al ecosistema de plugins y ofrecer a tu equipo un editor con el que ya estén familiarizados. Obtendrás archivos de temas que te pertenecen y nada que deje de funcionar porque un proveedor haya cambiado sus precios.

Elige HubSpot cuando la web tenga que integrarse con el CRM: cuando las páginas deban personalizarse en función de los datos de contacto y el equipo de marketing quiera crear campañas sin tener que abrir un ticket.

La estructura que ya hayas creado no determina esta elección. El mismo repositorio se puede convertir de cualquier manera.

Cerrar la brecha automáticamente

Este paso de conversión —componentes en módulos, estilos en un tema, diseño en plantillas— es exactamente lo que automatiza transjt. Indícale el repositorio de GitHub con el que tu herramienta de IA ya se está sincronizando y generará un tema nativo: módulos HubL con campos editables para HubSpot, plantillas PHP para WordPress, conservando la estructura de tu compilación en lugar de aproximarla.

Lo que cambia en la práctica es la forma del proyecto. Las dos semanas de trabajo de traspaso dejan de ser una fase. La compilación que generaste el martes puede convertirse en un sitio web que tu equipo esté editando el miércoles y, lo que es más importante, que siga editando seis meses después sin necesidad de recurrir a un desarrollador.

Por dónde empezar

Si ya sabes con qué herramienta has creado el proyecto, los detalles difieren lo suficiente como para que merezca la pena leerlos: la v0 utiliza Next.js por defecto y requiere un paso que Lovable no necesita; Builder.io tiene una dependencia de SDK que hay que eliminar; y el código generado por Claude ya está en Git, sin necesidad de exportar nada. Cada proceso se describe por separado en la sección «De IA a sitio web».

Y si aún no has creado nada: genera el frontend con la herramienta que más te guste. La conversión ya no depende de esa elección.