← Livello 6 – Capo progetto

Lezione 5 di 8 ⏱ 35 minuti Premium

Pubblicazione automatica

Configura GitHub Actions: fai push di una modifica e il sito web si aggiorna da solo. Come i professionisti.

I robot fanno il lavoro per te

Adesso funziona così: cambi il codice → commit → push → GitHub Pages si aggiorna. È già automazione! Ma i professionisti vanno oltre – GitHub Actions è un robot che, dopo ogni push, fa quello che gli dici: costruire il sito web, controllare errori, pubblicare.

Si chiama CI/CD (continuous integration / continuous deployment). Sembra complicato, ma in realtà è: “I robot controllano e pubblicano tutto dopo ogni modifica.”

Te lo mostro: il tuo primo workflow

I compiti per i robot si scrivono in un file dentro la cartella .github/workflows/. Per esempio, deploy.yml:

name: Check and deploy

on:
  push:
    branches: [main]   # run after every push to main

jobs:
  check:
    runs-on: ubuntu-latest   # the robot gets a clean Linux computer
    steps:
      - uses: actions/checkout@v4      # download my code
      - name: Check HTML
        run: |
          echo "Checking that index.html exists…"
          test -f index.html && echo "OK ✅"

Dopo un push, un robot in esecuzione compare su GitHub sotto la scheda Actions. Un segno di spunta verde significa che tutto è passato; una X rossa significa che qualcosa non va, e il robot ti dirà cosa.

💡

GitHub Pages usa già Actions! Se guardi la scheda Actions, vedrai che la pubblicazione di Pages passa attraverso un workflow chiamato “pages build and deployment”. Ora stai aggiungendo i tuoi controlli extra – come un vero capo che non lascia andare online una versione rotta.

Ora tocca a te 💪

  1. Crea .github/workflows/deploy.yml seguendo l’esempio, fai push, e guarda la scheda Actions.
  2. Rompi qualcosa di proposito: rinomina index.html in index2.html, fai push – il workflow diventa rosso. Correggilo e guardalo diventare verde. (Questa è l’esperienza più importante di questa lezione!)
  3. Aggiungi un secondo passo al workflow – controllare che non sia rimasto localhost nell’HTML:
      - name: No localhost in the code
        run: |
          if grep -r "localhost:3000" *.html; then
            echo "WARNING: localhost was left in the code!" && exit 1
          fi
          echo "OK ✅"
  1. Scrivi in LAUNCH.md: “Il sito web si pubblica automaticamente, un robot controlla ogni push.”

Controllo: Il tuo workflow gira nella scheda Actions dopo ogni push. Hai visto sia rosso (rotto) che verde (corretto). Il sito web si aggiorna senza un solo passo manuale.

Cosa porti via da questa lezione