arrow_back Volver
Inicio keyboard_arrow_right Artículos keyboard_arrow_right Artículo

Deploy GitHub Pages

Luis Fernando Garcia Perez

Desarrollador de software.

av_timer 2 Min. de lectura

remove_red_eye 30843 visitas

calendar_today 25 Octubre 2019

En este nuevo tutorial aprenderemos a hacer deploy de nuestra página estatica con github pages.

Pasos iniciales

Para comenzar lo que necesitamos es crear un nuevo repositorio con el nombre de usuario de github_username + gitthub.io (fernando83d.github.io en mi caso).

Como siguiente paso tendremos que agregar el repositorio a nuestro proyecto.

git remote add origin https://github.com/fernando83d/fernando83d.github.io.git

Ahora tenemos que hacer un push a nuestra rama master (Recuerda que tu proyecto necesita de un index.html en la ruta raiz, caso contrario obtendrás un 404).

Si ahora accedemos a nuestro navegador a la dirección https://{github_username}.github.io, Veremos nuestra página(https://fernando83d.github.io en mi caso).

Dominio personalizado

Algo que probablemte sea necesario es agregar un dominio personal a nuestra página, bien para hacer esto necesitamos realizar ciertas acciones, la primera de ellas es agregar 4 records A en nuestro dominio (Esto varia dependiendo el proveedor).

Las ips que usaremos son.

185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153

Otro registro que agregaremos es un CNAME usando www y apuntando a nuestra url de github https://{github_username}.github.io

Ejemplo en namecheap.

Como siguiente paso tenemos que agregar el dominio a nuestro repositorio.

Esto lo vamos a realizar dentro de la configuración de nuestro repositorio.

Veremos una opción llamada Custom domain.

Agregamos el dominio y guardamos, esto nos creará un archivo llamado CNAME dentro de nuestro respositorio con el nombre de dominio que agregamos.

Y ahora ya podemos acceder usando un dominio personalizado.

Aumenta tu productividad con GitHub Copilot

  • done Curso GRATUITO
  • done Regístrate antes del 31 de Marzo
  • done Obtén una ventaja competitiva
  • done Aprovecha la IA a tu favor
Más información