Eessõna
Pärast saidi loomist tehisintellekti tööriistadega nagu ChatGPT, Canva, Gemini Canvas, Claude Artifacts või Sider Web Creator, on järgmine suur küsimus kuidas hallata veebimajutust GitHub Pages'is, et saaksid saiti külastada oma domeeni kaudu. See juhend juhatab sind samm-sammult läbi kogu protsessi – alates projekti eksportimisest Sider Web Creatoris kuni täielikult toimiva veebisaidi loomiseni oma isikliku domeeni all – demüstifitseerides samal ajal nii veebimajutust kui ka GitHub Pages'i konfiguratsiooni.
🎯 Mida sa õpid
Kuidas õigesti alla laadida ja mõista tehisintellekti abil loodud projektifaile enne GitHub Pages'i veebimajutuse töövoo valimist.
Samm-sammult juhised saidi tasuta paigaldamiseks GitHub Pages'ile.
Kuidas osta ja siduda oma kohandatud domeen GitHub Pages'i seadetes ning ühendada see parimate tavade DNS-i kirjetega.
Profi näpunäited, et muuta sait täielikult professionaalseks ja usaldusväärseks, kui GitHub Pages'i seadistus on aktiivne.
Enamik staatilise majutuse platvorme – sealhulgas GitHub Pages – ootavad puhast ehituskausta, seega pead kõigepealt oma failid kokku koguma.
1.1 Laadi projektifailid alla
Pärast seda, kui Web Creator on saidi genereerimise lõpetanud, klõpsa paremas ülanurgas nuppu Laadi alla.
Oota, kuni süsteem su projekti pakib.
Sa saad .zip faili, mis on valmis GitHub Pages'ile üleslaadimiseks.
Paki zip-fail lahti ükskõik kuhu oma arvutis.
1.2 Mõista failistruktuuri (oluline!)
my‑website/
├── dist/ ⭐ Tootmisversioon **GitHub Pages'i jaoks**
│ ├── index.html → Avaleht
│ ├── assets/ → Stiilid ja skriptid
│ └── …
├── src/ 📝 Lähtekoodi kaust
├── package.json 📦 Projekti konfiguratsioon
└── …muud failid
Pea meeles: Ainult dist/ sees olev sisu avaldatakse GitHub Pages'is.
1.3 Kohalik eelvaate test
Sisene kausta dist/.
Topeltklõpsa failil index.html.
Sait avaneb su brauseris.
Veendu, et kõik töötab enne GitHub Pages'ile üleslaadimist.
🚀 Samm 2: Vali paigaldusplatvorm
Kuigi GitHub Pages on selle juhendi peategelane, siin on kiire võrdlus:
| |
|---|
🌟 GitHub Pages (selle juhendi fookus) | Täiesti tasuta • Lohista ja kukuta või git push paigaldus • Tasuta HTTPS • Globaalne CDN • Kohandatud domeenid • Native CI GitHub Actions'iga |
| Globaalne edge-võrk • 100% tasuta • Välkkiire |
| Poleeritud kasutajaliides • Funktsioonirikas |
📤 Samm 3: Paigalda GitHub Pages'ile (üksikasjalik juhend)
Kuigi GitHub Pages asub arendusplatvormi sees, mõtle sellele kui ülimoodsale veebimajutusele, millel on nupuvajutusega mugavus.
3.1 Registreeru ja loo repositoorium
Külasta github.com ja logi sisse.
Klõpsa + New repository.
Nimetage see my‑website ja valige Public (või Private, kui teil on tasuline pakett; GitHub Pages toetab nüüd privaatseid reposid).
Jäta Initialize with README märkimata, kui plaanid hiljem üles laadida.
3.2 Lisa oma saidi failid
Meetod A: Lohista ja kukuta üleslaadimine (parim algajatele)
Repositooriumi vahekaardil Code klõpsa Add file → Upload files.
Kukuta kõik dist/ sisse.
Kerige alla ja klõpsa Commit changes.
Meetod B: Git CLI (parim arendajatele)
# Klooni tühi repositoorium
git clone https://github.com/<user>/my‑website.git
cd my‑website
# Kopeeri väljund
cp -r /path/to/dist/* .
# Commit & push
git add .
git commit -m "Esmane **GitHub Pages** paigaldus"
git push origin main
Mõlemad meetodid jätavad sind staatiliste failidega repositooriumi juurkausta – ideaalne GitHub Pages'i jaoks.
3.3 Luba GitHub Pages
Mine Settings → Pages.
Vali jaotises Source Deploy from a branch → main (/root).
Klõpsa Save. GitHub Pages ehitab umbes 30 sekundiga ja tagastab URL-i nagu https://<user>.github.io/my‑website/.
3.4 Hangi oma vaikimisi URL
Külasta linki, et kinnitada, et kõik laadib. GitHub Pages teenindab automaatselt globaalse CDN-i kaudu.
🌐 Samm 4: Osta ja seo oma domeen
4.1 Osta domeen
Soovitatavad registripidajad (kõik sobivad GitHub Pages'iga): Namecheap, GoDaddy, Alibaba Cloud, Tencent Cloud. Vali võimalusel lühike .com.
4.2 Lisa domeen GitHub Pages'is
Olles endiselt Settings → Pages all, leia Custom domain.
Sisesta mywebsite.com või www.mywebsite.com.
Klõpsa Save. GitHub Pages kirjutab automaatselt CNAME faili.
4.3 Konfigureeri DNS-i kirjed
| | |
|---|
| | 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153
|
| | |
Oota 10 minutit – 24 tundi levimiseks. Need IP-d on GitHub Pages'i jaoks konstantsed. |
4.4 Jõusta HTTPS
Pärast DNS-i levimist värskenda Pages sätteid ja lülita sisse Enforce HTTPS. Let's Encrypt sertifikaadid väljastatakse automaatselt.
✨ Samm 5: Muuda sait professionaalseks
5.1 Lisa kohandatud favicon
Valmista ette 32×32 px ikoon nimega favicon.ico.
Aseta see repositooriumi juurkausta.
Commit ja push; GitHub Pages teenindab seda kohe.
5.2 Sisesta kohandatud meta-info
Muuda faili index.html repositooriumi juurkaustas:
<meta name="description" content="Your website description on **GitHub Pages**">
<meta name="author" content="Your Name">
5.3 Analüütika (valikuline)
Kleebi GA / Plausible koodijupid sisse <head>; GitHub Pages austab vahemälu päiseid.
🔧 Veaotsing
Tühi leht? Kinnita, et index.html on repositooriumi juurkaustas ja varade teed on suhtelised.
Domeen suunab tagasi .github.io? Kontrolli üle A/CNAME kirjed ja oota täielik TTL.
HTTPS-i lüliti on keelatud? DNS pole veel õige; kontrolli dig abil.
🎉 Kokkuvõte
Palju õnne! Sa oled nüüd:
✅ Edukalt alla laadinud oma tehisintellekti abil loodud veebisaidi, mis on valmis GitHub Pages'i majutamiseks.
✅ Paigaldanud selle tasuta GitHub Pages'ile.
✅ Kindlustanud oma kohandatud domeeni.
✅ Poleerinud GitHub Pages'i keskkonda, et see näeks välja täiesti professionaalne.
Su sait on nüüd:
🌐 Online 24/7, mida toetab GitHub Pages CDN.
🏷️ Teenindatakse professionaalse domeeni all.
🔒 Kaitstud HTTPS-krüpteeringuga.
⚡ Globaalselt kiire tänu GitHub Pages'i edge-sõlmedele.
🗝️ Täielikult sinu omanduses ja kontrolli all.
💡 Järgmised sammud
SEO optimeerimine: lisa sihitud märksõnad ja meta-kirjeldused, et suurendada oma GitHub Pages'i seadistuse otsingutulemusi.
Sotsiaalne jagamine: integreeri jagamisnupud peamistele platvormidele.
Pidevad uuendused: commit muudatusi regulaarselt; GitHub Pages automaatselt taaspaigaldab.
Varukoopiad: luba GitHubi repositooriumi kaitse või peegelda repositoorium.
Sa oled nüüd tõeline veebisaidi omanik – jaga oma GitHub Pages'i linki ja näita oma loomingut maailmale!
