GitHub Pages

I siti che hai scritto fino a oggi sono raggiungibili da qualsiasi browser installato sul tuo computer.

Tutto diventa più divertente quando il sito è raggiungibile da qualsiasi browser, installato su qualsiasi dispositivo.

Esistono mille modi per pubblicare un sito web: oggi imparerai a farlo utilizzando GitHub Pages.

Alla fine di questa guida, avrai pubblicato un sito web raggiungibile all’indirizzo URL https://{username}.github.io, dove al posto di {username} ci sarà il nome utente scelto per la registrazione a GitHub.

Se vuoi un indirizzo URL carino, scegli quindi un nome utente carino in fase di registrazione a GitHub!

  1. Crea un account su GitHub.
  2. Collegati all’account appena creato e crea un nuovo repository. Un repository è, semplicemente, una cartella contenente dei file. Nel tuo caso, questo sarà il repository conenente i file del sito web.
    Attenzione! Il repository deve chiamarsi {username}.github.io, dove al posto di {username} devi indicare il nome utente scelto in fase di registrazione. Se al posto di {username} scrivi qualcosa d’altro, nulla funzionerà.
  3. Scarica e installa GitHub Desktop. Accedi a GitHub desktop utilizzando l’account GitHub creato poco fa.
  4. In GitHub Desktop, sulla destra, nella sezione “Your repositories”, noterai il repository creato al punto 2. Clicca una volta sul repository. Più in basso, clicca sul tasto “Clone {username}/{username}.github.io”. Clonare un repository significa, semplicemente, scaricare quel repository sul proprio computer, così da poter visualizzare o modificare i file al suo interno.
  5. Si apre un menù con due sezioni. La seconda sezione, “Local path”, è utile per scegliere in quale posizione clonare il repository. Scegli una posizione che ti piace, e infine clicca su “Clone”.
  6. Ora apri il repository in Visual Studio Code! Se non sai come fare, segui la guida a Visual Studio Code.
  7. Attraverso VS Code, crea il tuo sito web. Ora, per semplicità, ti consiglio di creare solo un file index.html. In <body>, metti un titolo <h1> con il tuo nome e il tuo cognome.
  8. Torna in GitHub Desktop. Qui, sulla sinistra, noterai una lista di file, nella sezione “Changes”. Sono i file che hai da poco creato o modificato! Manca poco. Sempre sulla destra, in basso, nella sezione “Summary”, scrivi un piccolo messaggio che riassuma ciò che hai fatto. Ad esempio, potresti scrivere “Prima bozza del mio sito web”.
  9. A questo punto, puoi cliccare sul pulsante “Commit to main”, in basso a destra. I termini “repository”, “clone”, “commit”… sono tipici di Git, il software sottostante GitHub Desktop, di cui per ora ignoreremo il funzionamento.
  10. Ultimo step! In GitHub Desktop, sulla destra, sarà apparso il pulsante “Push origin”. Cliccalo: così pubblicherai il tuo nuovo sito web su internet.
  11. Attendi un po’ di secondi, poi apri un browser e prova a collegarti a {username}.github.io. Se tutto è filato liscio, vedrai il tuo fantastico sito web online! Non solo: potrai visitarlo da qualsiasi disposivo: il tuo smartphone, quello di mamma, quello del vicino di banco: dove vuoi.

Per apportare modifiche al tuo sito web, basta modifcarlo in Visual Studio Code, poi caricare le modifiche online attraverso GitHub Desktop, come spiegato sopra.