¿Por qué quieres un sitio web en GitHub?
Porque es fácil y gratis. Antes de empezar, veamos algunas ventajas y desventajas, y comprobemos si se ajusta a tus necesidades.
Ventajas
Se encarga del nombre de dominio por ti, y no tienes que preocuparte por que te cobren por el almacenamiento ni por el tráfico elevado. Todo lo que necesitas es una cuenta gratuita de GitHub.
Desventajas
No puedes alojar un sitio dinámico en GitHub Pages, solo un sitio estático. Lo que significa que no puedes alojar un servidor que escuche el tráfico entrante, como con express.js o flask; solo puedes alojar un sitio que sea estático. Sin embargo, puede ser un sitio estático dinámico: aún puedes ejecutar scripts en él, solo que esos scripts tienen que estar precargados.
Otra desventaja es que, si ejecutas la página de GitHub con una cuenta gratuita, tu repositorio de GitHub (los archivos y directorios de tu sitio web) será público. Lo que significa que cualquiera puede ver y visitar tus archivos. Así que más vale que no incluyas nada confidencial en la carpeta de tu sitio web.
Dicho esto, sigue siendo bueno para alojar un sitio web sencillo cuyo código no te importe compartir. Digamos tu currículum personal, el sitio web sencillo de una empresa o un blog simple. O si simplemente quieres probar tu propia aplicación web estática dinámica.
Requisitos previos
- Un ordenador con internet.
- Conocimientos básicos de informática.
- Una cuenta gratuita de GitHub.
Guía paso a paso para crear una página de GitHub gratuita
- Crea una cuenta de GitHub.
Después de iniciar sesión, crea un nuevo repositorio. Asegúrate de seleccionar “Public”.
Una vez que hayas creado un repositorio vacío, pulsa “create new file”.
- Copia y pega el código de ejemplo de abajo, y nómbralo index.html para crear este archivo.
Debería verse así. Haz clic en commit changes.
Ve a la pestaña Settings > Pages en el lateral > Branches: selecciona main y haz clic en save.
Ahora vuelve a tu repositorio y espera unos minutos.
Actualiza la página y verás que se ha publicado correctamente una página de GitHub.
¡Buen trabajo! ¡Tu página de GitHub ya está lista a través de este enlace!
Código de ejemplo:
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>My Website</title> <link rel="stylesheet" href="./style.css"> <link rel="icon" href="./favicon.ico" type="image/x-icon"> </head> <body> <main> <h1>Welcome to My Website</h1> </main> <script src="index.js"></script>2 collapsed lines
</body></html>¿Y ahora qué?
Bueno, si eres principiante, te recomiendo encarecidamente que hagas los cursos gratuitos de freeCodeCamp.org; cubrirán casi todo lo que necesitas saber sobre desarrollo web para empezar.
Aunque una página de GitHub es fácil de configurar, tiene algunas limitaciones y podría restringir lo que puedes hacer a medida que avanzas en el desarrollo web. Conocer distintas tecnologías de desarrollo como React, Next, Flask, Express.js, etc. es crucial si te lo vas a tomar en serio. En ese sentido, GitHub Pages no es suficiente. Tendrás que buscar otra cosa, como Netlify, Digital Ocean y, con el tiempo, un VPS autoalojado con instancias de Docker para alojar tú mismo cada parte de un sitio web.
Cloudflare vs GitHub Pages
Aunque la página de GitHub es fácil de configurar y buena para principiantes, hoy en día tiendo a usar Cloudflare Pages; no solo es gratis con tráfico ilimitado, sino que también se encarga de configurar un dominio personalizado si has comprado el dominio a través de Cloudflare. Además, tu repositorio también puede ser privado. Así que, en gran medida, es una versión mejorada de la página de GitHub. Quizá quieras echarle un vistazo también.
Si la guía no te queda clara, puedes seguir la guía oficial de GitHub aquí.