Si todavía estás usando programas como FileZilla para arrastrar archivos a tu servidor cada vez que haces un cambio en tu web, este artículo te va a cambiar la vida.
En este laboratorio no creemos en los procesos manuales y repetitivos. Queremos que nuestra energía se vaya a crear contenido y a trastear con IA, no a subir carpetas por FTP. Por eso, JRChub está montado sobre una tubería automática (un pipeline): tú escribes en tu PC, haces un “push” y la web se construye y se sube sola a Hostinger en segundos.
Hoy vamos a configurar tu propio sistema de Despliegue Continuo (CI/CD).
El Plan de Vuelo
Para que esta magia funcione, necesitamos tres puntos de control:
- Tu PC (El Origen): Donde escribes el código en VS Code.
- GitHub (El Búnker): Donde se guarda tu código y reside el “robot” que lo procesa.
- Hostinger (El Destino): Donde vive tu web real de cara al público.
Paso 1: Obtener las llaves del servidor
Hostinger debe permitir que GitHub entre a dejar los archivos. Para eso necesitamos tus credenciales FTP.
- Entra en tu hPanel de Hostinger.
- Ve a Archivos -> Cuentas FTP.
- Apunta la IP del servidor, tu Usuario y la Contraseña (si no la sabes, cámbiala por una nueva ahí mismo).
Paso 2: Configurar la “Caja Fuerte” en GitHub
No podemos poner tus contraseñas en el código porque cualquiera las vería. GitHub tiene una “caja fuerte” llamada Secrets para esto.
- En tu repositorio de GitHub, ve a Settings -> Secrets and variables -> Actions.
- Crea tres New repository secrets:
FTP_SERVER: La IP de tu servidor (ej:185.x.x.x).FTP_USERNAME: Tu usuario de FTP.FTP_PASSWORD: Tu contraseña de FTP.
Paso 3: Programar al Robot (El archivo YAML)
Ahora le daremos las instrucciones al robot de GitHub para que sepa qué hacer cada vez que subas código.
- En la raíz de tu proyecto Astro, crea la carpeta
.github/workflows/. - Crea un archivo llamado
deploy.ymly pega estas instrucciones:
name: 🚀 Desplegar en Hostinger
on:
push:
branches: [ main ] # Se activa al subir a la rama principal
jobs:
web-deploy:
runs-on: ubuntu-latest
steps:
- name: 🚚 Obtener código
uses: actions/checkout@v4
- name: 🛠️ Construir Proyecto
run: |
npm install
npm run build
- name: 📂 Subir vía FTP
uses: SamKirkland/[email protected]
with:
server: ${{ secrets.FTP_SERVER }}
username: ${{ secrets.FTP_USERNAME }}
password: ${{ secrets.FTP_PASSWORD }}
local-dir: ./dist/
server-dir: /public_html/Nota de trasteador: La carpeta local-dir: ./dist/ es donde Astro guarda la web terminada. El robot solo subirá lo que hay ahí dentro, manteniendo tu servidor limpio de archivos innecesarios.
Paso 4: El Momento del Despegue
Ahora, vuelve a tu terminal y lanza los comandos de siempre:
git add .
git commit -m "Activando despliegue automático"
git pushSi vas a la pestaña Actions de tu GitHub, verás un círculo amarillo girando. Significa que el robot está instalando Astro, “cocinando” tu web y enviándola a Hostinger por ti. Cuando se ponga en verde… ¡tu web ya se habrá actualizado sola!
El motor que lo hace posible
Para que todo este proceso sea fluido y rápido, necesitas un hosting que no te ponga trabas y que tenga una buena velocidad de subida. En este laboratorio hemos probado varios, y este es el que mejor se lleva con el despliegue automático de Astro:
Hostinger: Hosting de Alto Rendimiento
Es el proveedor que usamos para JRChub. Su panel de control y su compatibilidad con despliegues Git lo hacen ideal para proyectos tecnológicos.
Conclusión
El despliegue automático no es solo una comodidad, es una filosofía de trabajo. Te permite equivocarte rápido y corregir rápido. Ahora que JRChub es una máquina autónoma, ya no hay excusas para no publicar ese proyecto que tienes a medias.
¿Te ha funcionado el pipeline? Si el robot de GitHub se pone en rojo y te da un error de “Authentication”, revisa que no hayas puesto ftp:// en la IP de los Secrets.
¡A seguir trasteando! 🛠️