Conectar un repositorio de GitHub con Travis CI y lograr que cada cambio se despliegue automáticamente en GitHub Pages es una de las prácticas más valiosas en integración continua. A continuación se explica paso a paso cómo subir el archivo de configuración, generar un Personal Access Token, vincular Travis CI y ejecutar el primer build exitoso.
¿Cómo subir el archivo de Travis al repositorio?
Con el archivo .travis.yml listo en tu proyecto local, el siguiente paso es enviarlo al repositorio remoto. Desde la terminal se ejecuta una secuencia de comandos de Git que resulta fundamental conocer:
git status: verifica que el archivo de Travis aparezca como pendiente de agregar.git add: añade el archivo al staging area.git commit -m "mensaje": crea el commit describiendo el cambio, por ejemplo "Agregamos archivo Travis al repositorio".git push origin master: envía los cambios a la rama principal del repositorio remoto.
Si la terminal solicita usuario y contraseña, debes ingresar tus credenciales de GitHub. Esto ocurre cuando no has configurado la autenticación persistente en tu terminal. Una vez completado el push, puedes verificar en GitHub que el archivo .travis.yml ya se encuentra visible en el repositorio [01:05].
¿Cómo vincular Travis CI con el repositorio y crear el token?
Dentro de Travis CI, en la sección de configuración, se sincronizan los repositorios de GitHub. Al buscar el proyecto —en este caso "Platzi Store"— aparece listado y se debe habilitar para que Travis lo monitorice [01:35].
La sección de configuraciones de Travis ofrece varias opciones relevantes:
- Compilación de branches.
- Trabajo sobre pull requests.
- Autocancelación de procesos fallidos.
- Variables de entorno.
- Cron Jobs para automatización programada.
¿Por qué necesitas un GitHub Token?
El archivo .travis.yml hace referencia a una variable de entorno llamada GitHub Token. Esta variable permite que Travis CI tenga permisos para escribir en el repositorio y ejecutar el deploy [02:20].
Para crearlo, ve a GitHub → Settings → Developer Settings → Personal Access Token y genera uno nuevo con el nombre Travis_CI. Los permisos necesarios son:
- repo: acceso a status, deployment y publicación.
- admin:repo_hook: permite gestionar los webhooks del repositorio.
Una vez generado, copia la llave inmediatamente porque solo se muestra una vez. Luego pégala en Travis CI como valor de la variable de entorno GITHUB_TOKEN [03:15]. Esta llave es única y debe protegerse: nunca la compartas ni la incluyas directamente en el código del repositorio.
¿Qué sucede al ejecutar el primer build?
Con la configuración completa, se activa el primer build desde la opción Trigger Build en Travis CI [04:20]. El proceso sigue un flujo claro que se puede observar en el output de la consola:
- El trabajo se recibe y entra en cola.
- Un worker asigna un servidor que clona el repositorio usando
git clone con profundidad tres (depth: 3), configuración definida en el archivo .travis.yml.
- Se instalan automáticamente las versiones necesarias de npm y Node.js.
- Se ejecuta
npm install de forma implícita dentro del flujo, por lo que no es necesario declararlo manualmente.
- Se ejecuta el comando de build del proyecto.
El código de salida determina el resultado: retornar cero significa éxito, mientras que retornar uno indica fallo [05:30]. Si todo pasa correctamente, Travis prepara el deploy y envía los assets, el bundle y el index.html a la rama de GitHub Pages.
¿Cómo verificar que el deploy fue exitoso?
Después del build, la rama de GitHub Pages se crea automáticamente en el repositorio. Para confirmarlo:
- Revisa en GitHub que la nueva rama exista.
- Ve a Settings → GitHub Pages y encontrarás la URL pública donde el sitio ya está disponible [06:10].
Al acceder a esa URL, el sitio funciona completamente: puedes explorar los productos, agregar elementos al carrito, eliminar items y comprobar que la aplicación está operativa en producción.
Este flujo de integración continua con Travis CI garantiza que cada cambio enviado al repositorio pase por un proceso automatizado de construcción y publicación. ¿Ya configuraste tu primer deploy automático? Comparte tu experiencia y las dificultades que encontraste en los comentarios.
