Ejercicio 2: GitHub Actions - Comprobación de HTML5 válido y despliegue en surge.sh (test y deploy)
Introducción a surge.sh
surge.sh es un servicio muy sencillo para publicar sitios web estáticos.
Instalación de surge:
apt update
apt install -y nodejs npm
npm install -g surge
Para crear una cuenta en surge.sh:
surge
La primera vez:
- Te pedirá un email
- Te pedirá una contraseña
- Se crea la cuenta automáticamente
El token sirve para:
- Autenticación sin interacción
- Automatizar despliegues (CI/CD)
- Jenkins, GitHub Actions, etc.
Es una clave privada, como una contraseña. Para obtenerla:
surge token
Guárdalo, no se vuelve a mostrar igual.
Para publicar una web estática (manual), desde dentro de un directorio donde tenemos una página web estática:
surge . mi-web.surge.sh
La web queda accesible en https://mi-web.surge.sh
Para publicar usando token (modo CI/CD):
surge ./public mi-web.surge.sh --token TU_TOKEN
Esto es lo que se usa en el sistema de IC/DC.
Ejercicio
En este ejercicio queremos desplegar una página HTML5 en el servicio surge.sh, además queremos comprobar si el código HTML5 es válido. Estas dos operaciones: comprobar si el HTML5 es válido (test) y el despliegue en surge.sh (deploy) lo vamos a hacer con GitHub Actions de forma automática (IC y DC).
Vamos a añadir la funcionalidad de IC y DC con GitHub Actions, para ello:
-
Realiza un fork del repositorio de GitHub: https://github.com/josedom24/ic-html5.
-
Comprueba la prueba y el despliegue que vamos a realizar estudiando el fichero
.github/workflows/ic.yaml. -
Modifica el fichero
.github/workflows/ic.yamlpara poner el nombre de dominio que vas a utilizar. -
Crea una variable de entorno en Settings->Secrets->Actions:
SURGE_TOKEN: Indica el TOKEN que has obtenido en el paso anterior.
-
Realiza cambios en el fichero
index.htmldel directorio_buildy comprueba, que si el código HTML5 es válido se despliega y puedes acceder a la página web. Si el código HTML5 no es válido no se realiza el despliegue y te mandan un correo informando de la incidencia.