Publica tu sitio web en internet · Programa con Martin

El gran final: tu sitio web tendrá una dirección real que puedes enviar a cualquiera del mundo.

Qué va a pasar

Hasta ahora, tu sitio web solo vive en tu propio ordenador. Ahora lo subiremos a un servidor – un ordenador siempre conectado a internet – y tendrá una dirección que cualquiera puede abrir. Usaremos GitHub Pages: es gratis, y millones de programadores lo usan.

⚠️

Haz este paso con un adulto. Crear una cuenta de GitHub necesita una dirección de email, y según las reglas de GitHub, una cuenta para un menor de 13 años debe ser creada y gestionada por un adulto. Además, es un buen momento para compartir – ¡déjale ver lo que has construido!

Paso a paso

Crea una cuenta de GitHub. Ve a github.com y haz clic en Sign up. Rellena un email (de un adulto), una contraseña y un nombre de usuario. Cuidado con el nombre de usuario – ¡formará parte de la dirección de tu sitio web! Algo como jake-builds es mejor que xxjake123xx.
Crea un repositorio nuevo. Un repositorio es un cajón para un proyecto. Haz clic en el botón verde New (o el signo más arriba a la derecha → New repository). Escribe my-website en Repository name, deja Public marcado y haz clic en Create repository.
Sube los archivos de tu sitio web. En la página del repositorio, haz clic en el enlace uploading an existing file. Arrastra todo de tu carpeta my-website: index.html, tus otros archivos .html, style.css y toda la carpeta images. Haz clic en el botón verde Commit changes abajo.
Activa GitHub Pages. Haz clic en la pestaña Settings arriba, luego Pages en el menú izquierdo. En Branch, elige main, deja / (root) y haz clic en Save.
Espera un minuto y abre tu dirección. Tu sitio web ahora vive en:
```
https://your-username.github.io/my-website/
```
(sustituye your-username por tu nombre de usuario de GitHub). Si no funciona enseguida, espera dos minutos y actualiza la página.

🎉 ¡Enhorabuena, Constructor!

Tienes un sitio web en internet. Uno de verdad, con una dirección real. Envíasela a tu abuela, a tus amigos, a tu profesor. Y tómate un momento para recordar dónde empezaste: un archivo vacío y <h1>It works!</h1>.

Lo que aprendiste en estas 12 lecciones:

cómo funcionan internet, navegadores y servidores,
HTML: el esqueleto de una página, títulos, párrafos, listas, imágenes, enlaces, estructura,
CSS: colores, fuentes, clases, el modelo de cajas, flexbox, tarjetas, animaciones,
y por fin, poner un sitio web en internet – lo que los profesionales llaman deployment.

Cómo seguir cambiando tu sitio web

¡Un sitio web nunca está del todo terminado! Cada vez que cambies algo en tus archivos en el ordenador:

abre tu repositorio en GitHub,
haz clic en Add file → Upload files,
arrastra los archivos cambiados y haz clic en Commit changes.

En un minuto, el cambio está en vivo. (En el Nivel 3, aprenderás a hacerlo con más elegancia – usando comandos desde la terminal, como un profesional de verdad.)

💡

¿Qué sigue? Tu sitio web está construido, pero todavía no puede reaccionar. En el Nivel 2 – Mago le enseñarás hechizos: modo oscuro, una galería de fotos navegable y un quiz para visitantes. Lo estamos construyendo ahora – y tu sitio web estará perfectamente preparado.

Lo que te llevas de esta lección

GitHub Pages publica un sitio web gratis: repositorio → subir archivos → Settings → Pages.
Tu dirección: https://your-username.github.io/my-website/.
Cambiar tu sitio web = subir otra vez los archivos cambiados. Vive y crece contigo.