Cómo publicar un sitio web hecho con ChatGPT o Claude

Para publicar un sitio web que te escribió ChatGPT o Claude, guarda el código en un archivo llamado index.html, sube ese archivo a GitHub, selecciona después el repositorio en el panel Coolify de tu servidor y publícalo. Tu sitio queda en una dirección HTTPS pública, y puedes conectar tu propio dominio si tienes uno. Esta guía da por hecho que es tu primera vez y recorre cada etapa desde el principio.

Primero, comprueba lo que tienes. Un sitio escrito en un chat suele ser un único archivo HTML sin nada que compilar, y eso es lo que cubre esta guía. Si la respuesta menciona npm install, package.json o Next.js, lo que tienes es una aplicación, y nuestra guía de herramientas de programación es mejor sitio al que ir.

1. Pide un solo archivo

Envía esto en el chat para no tener que manejar varios archivos:

Give me this site as one index.html file. Keep the CSS and JavaScript inside that file. If you use images, tell me their file names.

2. Guarda el archivo en tu ordenador

• ChatGPT: El código suele llegar en un bloque de código en el chat, así que copia el bloque. Si ves un botón de descarga, también puedes usarlo.
• Claude: El sitio suele abrirse como un artefacto junto al chat. La documentación de Anthropic describe controles en la parte superior del artefacto para ver, copiar o descargar el código. Los diseños hechos a partir de una plantilla tienen Export, que te da HTML independiente o un .zip.

Si copiaste el código, pégalo en un editor de texto y guárdalo como index.html. En el Bloc de notas de Windows, pon el tipo de archivo en Todos los archivos, o el nombre acabará en .txt. En TextEdit de Mac, cambia primero a texto sin formato. Haz doble clic en el archivo y tu sitio debería abrirse en el navegador. Pon las imágenes en la misma carpeta.

3. Sube los archivos a GitHub

El servidor recoge tu sitio de un repositorio de GitHub, que funciona como una carpeta para tus archivos.

1. Crea una cuenta de GitHub. Arriba a la derecha, elige New repository.
2. Ponle un nombre corto, establece la visibilidad en Public, activa Add README y pulsa Create repository.
3. Encima de la lista de archivos, abre el menú Add file, elige Upload files, arrastra index.html y tus imágenes, y pulsa Commit changes.

Cualquiera puede ver un repositorio público, y una página HTML la ve de todos modos cada visitante. Así que nunca pongas en ella una contraseña ni una clave de API.

4. Pide el servidor

Haz el pedido desde la página de VPS para Next.js o la página de VPS para Coolify. Ambas incluyen el panel de despliegue Coolify. Un sitio HTML simple no tiene paso de compilación, así que no necesita la memoria que necesita Next.js, y puedes elegir un tamaño menor en la página de Coolify. Tras el pago, abre tu servidor desde Mis servidores en tu panel de Seturack y espera a que la fila Aplicación de la pestaña Resumen indique que está listo.

5. Publica desde el panel

1. En la pestaña Resumen, abre el enlace de Dirección del panel e inicia sesión en Coolify con las filas Correo electrónico y Contraseña.
2. En la página Projects, abre My first project y production, y pulsa New resource.
3. Elige Public Git Repository, introduce la dirección de tu repositorio de GitHub y pulsa Check repository.
4. En Build pack, elige Static, deja Base Directory en / y pulsa Continue. Esta opción publica los archivos tal cual, sin compilar.
5. Pulsa Deploy. Cuando termine, abre la dirección HTTPS de la página Domains.

Eso es todo, tu sitio está en línea. Tienes acceso root y, si lo prefieres, puedes gestionarlo todo desde el panel.

Una herramienta de programación puede hacerlo por ti

Si piensas cambiar el sitio a menudo, una herramienta de programación como Claude Code o Cursor te lo pone más fácil. Abre en la herramienta la carpeta que contiene index.html, copia la fila Pégalo en tu herramienta de IA de tu panel de Seturack y pégala. La herramienta crea el repositorio, publica el sitio y te da la dirección. Nuestra guía de herramientas de programación tiene los detalles. Las ventanas de chat de ChatGPT y Claude no pueden enviar comandos a un servidor, así que no pegues ese texto allí.

Cuatro cosas que conviene saber

• Formularios: Un formulario de contacto en HTML simple no puede enviar correo por sí solo. Para recibir mensajes, tiene que conectarse a un servicio de formularios o a código de servidor.
• Cuentas y pagos: El inicio de sesión, los registros guardados y los pagos necesitan código de servidor y una base de datos. En ese punto, tu sitio es una aplicación.
• Nombres de archivo: El servidor trata las mayúsculas y las minúsculas como distintas. Si el código dice logo.png y el archivo es Logo.PNG, la imagen no se mostrará.
• Copias de seguridad: La copia de seguridad diaria está incluida en el precio, y la copia principal de tu sitio permanece en GitHub.

Preguntas frecuentes

¿Cuánta RAM necesita un sitio HTML sencillo?

Sin compilación, el propio sitio pide muy poco, así que el mínimo lo marca Coolify. Su documentación pide al menos 2 núcleos y 2 GB de RAM. La opción Next.js recomienda más por sus compilaciones: al menos 4 GB de RAM, 2 vCores y 40 GB de disco.

¿Cuánto cuesta al mes?

El mínimo recomendado para la opción Next.js cuesta unos $6 al mes (IVA incluido), y fuera de Turquía pagas en dólares estadounidenses. Encontrarás tamaños más pequeños en la página de precios. La copia de seguridad diaria está incluida en el precio y el tráfico es ilimitado. El dominio se paga aparte y lo compras en otro sitio.

¿Cómo conecto mi propio dominio?

Apunta un registro A a la dirección IP del servidor con tu proveedor de dominio. En Coolify, pulsa Add domain en la página Domains, introduce tu dominio con https, guarda y pulsa Redeploy. El certificado se emite automáticamente. Nuestro artículo sobre dominios explica el registro A.

¿Cómo actualizo el sitio más adelante?

Pide el cambio a ChatGPT o a Claude, sube el nuevo index.html a GitHub con el mismo nombre y pulsa Redeploy en Coolify. Para publicar en cada subida, añade en GitHub la dirección de la página Webhooks de la aplicación, como explica nuestra guía de Next.js.

¿Necesito una base de datos?

No para un sitio HTML simple. Para guardar datos de los visitantes, puedes crear PostgreSQL en Coolify en el mismo servidor, pero también necesitarás código de servidor para usarla. En esa etapa, pasa a nuestra guía de publicación de aplicaciones.

Listo para usar en Seturack: Next.js, Coolify.