Publicera din webbplats på internet

Den stora finalen: din webbplats får en riktig adress du kan skicka till vem som helst i världen.

Vad som ska hända

Hittills bor din webbplats bara på din egen dator. Nu laddar vi upp den till en server – en dator som alltid är uppkopplad mot internet – och den får en adress som vem som helst kan öppna. Vi använder GitHub Pages: det är gratis, och miljontals programmerare använder det.

⚠️

Gör det här steget med en förälder. Att skapa ett GitHub-konto kräver en e-postadress, och enligt GitHubs regler måste ett konto för ett barn under 13 skapas och hanteras av en förälder. Dessutom är det ett fint ögonblick att dela – låt dem se vad du har byggt!

Steg för steg

Skapa ett GitHub-konto. Gå till github.com och klicka på Sign up. Fyll i en e-post (en förälders), ett lösenord och ett användarnamn. Var försiktig med användarnamnet – det blir en del av din webbplats adress! Något som jake-builds är bättre än xxjake123xx.
Skapa ett nytt repository. Ett repository är en låda för ett projekt. Klicka på den gröna knappen New (eller plustecknet uppe till höger → New repository). Skriv my-website som Repository name, låt Public vara ikryssat och klicka på Create repository.
Ladda upp din webbplats filer. På repository-sidan, klicka på länken uploading an existing file. Dra in allt från din mapp my-website: index.html, dina andra .html-filer, style.css och hela mappen images. Klicka på den gröna knappen Commit changes längst ner.
Slå på GitHub Pages. Klicka på fliken Settings upptill, sedan Pages i vänstermenyn. Under Branch, välj main, lämna / (root) och klicka på Save.
Vänta en minut, öppna sedan din adress. Din webbplats bor nu på:
```
https://your-username.github.io/my-website/
```
(ersätt your-username med ditt GitHub-användarnamn). Om det inte funkar direkt, ge det två minuter och uppdatera sidan.

🎉 Grattis, Byggare!

Du har en webbplats på internet. En riktig, med en riktig adress. Skicka den till din mormor, dina kompisar, din lärare. Och ta ett ögonblick att minnas var du började: en tom fil och <h1>It works!</h1>.

Det du lärde dig under dessa 12 lektioner:

hur internet, webbläsare och servrar funkar,
HTML: sidans skelett, rubriker, stycken, listor, bilder, länkar, struktur,
CSS: färger, typsnitt, klasser, boxmodellen, flexbox, kort, animationer,
och till sist att lägga upp en webbplats på internet – det proffsen kallar deployment.

Så fortsätter du ändra din webbplats

En webbplats är aldrig riktigt färdig! När du ändrar något i dina filer på datorn:

öppna ditt repository på GitHub,
klicka på Add file → Upload files,
dra in de ändrade filerna och klicka på Commit changes.

Inom en minut är ändringen live. (På nivå 3 lär du dig göra det mer elegant – med kommandon från terminalen, som ett riktigt proffs.)

💡

Vad händer sen? Din webbplats är byggd, men den kan inte reagera än. I Nivå 2 – Trollkarlen lär du den trollformler: mörkt läge, ett blädderbart fotogalleri och ett quiz för besökare. Vi bygger det nu – och din webbplats är perfekt redo för det.

Det här tar du med dig från lektionen

GitHub Pages publicerar en webbplats gratis: repository → ladda upp filer → Settings → Pages.
Din adress: https://your-username.github.io/my-website/.
Att ändra din webbplats = ladda upp de ändrade filerna igen. Den lever och växer med dig.