Despliega Aplicaciones Web con GitHub Pages

¿Cómo desplegar tu primera aplicación con GitHub Pages?

Desplegar una aplicación web puede parecer un reto, pero usando herramientas como GitHub Pages, se vuelve mucho más accesible. Aquí te guiaré paso a paso para que puedas lanzar tu propio sitio web de manera gratuita. Todo lo que necesitas es un repositorio en GitHub, y estarás listo para mostrar tu aplicación al mundo.

¿Cómo crear un nuevo repositorio en GitHub?

Primero, debes iniciar sesión en tu cuenta de GitHub y crear un nuevo repositorio. Sigue estos pasos:

1. Haz clic en el botón "New Repository" (Nuevo Repositorio), representado con un símbolo de más.
2. Asigna un nombre al repositorio con el formato nombreusuario.github.io. Por ejemplo, si tu usuario es juanperez, tu repositorio debe llamarse juanperez.github.io.
3. Añade una descripción si lo deseas, aunque este paso es opcional.
4. Selecciona la opción pública para hacer tu sitio accesible a todos.
5. Crea el repositorio.

¿Cómo preparar tu aplicación para GitHub Pages?

Supongamos que ya tienes un proyecto listo para publicar. El proceso es el siguiente:

1. Descarga el proyecto existente (puede ser un archivo .zip).
2. Descomprime el archivo en tu máquina local.

En este ejemplo, se usará una aplicación que consume la API de SpaceX para mostrar lanzamientos. Asegúrate de tener los archivos HTML, CSS y JavaScript necesarios para que funcione correctamente.

¿Cómo clonar y mover archivos al repositorio?

El siguiente paso es clonar el repositorio que has creado anteriormente. Para hacerlo:

1. Abre la aplicación de escritorio de GitHub o usa la terminal si prefieres trabajar con comandos.

2. Clona el repositorio en la carpeta de documentos o el directorio de tu elección con el siguiente comando:

   git clone https://github.com/nombreusuario/nombreusuario.github.io
   

3. Copia los archivos descomprimidos de tu aplicación al repositorio clonado. Usa la consola con el comando mv, o arrastra y suelta los archivos directamente en la carpeta.

   mv /ruta-de-tu-app/* /ruta-del-repositorio/
   

¿Cómo subir y publicar tu proyecto en GitHub Pages?

Con los archivos dentro de tu repositorio, es hora de prepararlos para subirlos a GitHub:

1. Navega a la carpeta del repositorio e ignora los archivos innecesarios como .DS_Store en macOS. Crea un archivo .gitignore con el siguiente contenido:

   .DS*
   

2. Usa los siguientes comandos para añadir y comitear los archivos:

   git add .
   git commit -m "Add application files"
   

3. Finalmente, sube tus archivos a GitHub con:

   git push origin master
   

   Ten en cuenta que GitHub ha cambiado el nombre de la rama principal de master a main.

¿Cómo verificar y acceder a tu aplicación en GitHub Pages?

Una vez realizado el push, accede a tu cuenta de GitHub y carga la página. Debes ver tu proyecto listado. Ahora, ve a la sección de ajustes del repositorio y busca el apartado de GitHub Pages; debería indicarte que tu sitio está publicado. La URL a la que debes acceder es similar a https://nombreusuario.github.io.

Este es un gran momento, ya que tu aplicación está en línea y accesible para todo el mundo.

Aclaraciones finales para desplegar tus aplicaciones

1. La rama principal de los repositorios en GitHub ahora se llama main y no master.
2. Si decides usar un subdominio personalizado, como js.org, para tu GitHub Pages, sigue las instrucciones adicionales para configurarlo.

¡Y ahí lo tienes! En unos simples pasos, has aprendido a desplegar tu primera aplicación con GitHub Pages. Sigue explorando y desarrollando tus habilidades. ¡El mundo del desarrollo web es vasto y emocionante!