Weboldal üzemeltetése Githubon

A Github cég „kód repozitóriumokat” üzemeltet, kódgyűjteményeket projektek számára. Sok kód repozitórium „nyílt forráskódú”, ami azt jelenti, hogy nyilvánosan elérhető az egész világ számára. Ez nagyszerű dolog, mert így a programozók tanulnak egymástól és egymás munkájára tudnak építeni! A Khan Academynek is van néhány nyílt forráskódú repozitóriuma. A kód repozitóriumok többféle kódot is tartalmazhatnak, nem csak HTML-t és CSS-t – bármilyen kódot, ami szükséges a projekt működéséhez.

Miért beszélünk erről? Azért, mert a Github-nak van egy funkciója, az ún. GitHub Pages, amivel egyszerűen és ingyenesen készíthetsz több fájlból álló weboldalakat, ami a yourusername.github.io címen érhető el.

Keresd fel a github.com oldalt! Látni fogsz egy regisztrációs űrlapot a főoldalon. (Ha nem látsz ilyet, akkor gratulálunk, már van fiókod! Ugorj a 2. lépésre!).

Amikor felhasználónevet választasz, vedd figyelembe, hogy a név publikusan látszani fog az interneten, és a yourusername.github.io weboldalad URL-jében is szerepelni fog. Vannak, akik adatvédelmi okokból szeretnek becenevet vagy vicces nevet választani a valódi nevük helyett. Rajtad múlik, hogy döntesz.

Második lépésként válaszd az ingyenes tervet (angolul free plan). Ha publikus weboldal repozitóriumot szeretnél, akkor nem kell fizetős változatot használnod. (Bármikor változtathatsz ezen később, ha termékeny Github felhasználó leszel és szükséged lesz privát repozitóriumra!)

Harmadik lépésként válaszolj a kérdőív kérdéseire, vagy ugord át ezt a lépést:

Miután kitöltötted az új fiók űrlapot, ellenőrizd az e-mail fiókodat és kattints a linkre, hogy megerősítsd az e-mail címedet:

Miután megerősítetted az e-mail címedet, látni fogod a kezdőlapot. Kattints a „Start a project” gombra.

A projektlétrehozási oldalon meg kell adnod a projekt nevét. A projekt neve legyen pontosan az, hogy „YOUR_USERNAME.github.io”. Ez jelzi a Github-nak, hogy egy speciális weboldal projektet hozol épp létre, és tudni fogja, hogy a fájljaidat erre, a más felhasználók által is látható URL-re kell feltöltenie, minden egyes változtatásnál. Mivel az én felhasználónevem „PamelaFoxBot", az én projektem neve „PamelaFoxBot.github.io” lett:

Gratulálunk, elkészült az új projekted! De még nincsenek benne fájlok. Az első fájlt gyorsan létrehozhatod, ha rákattintasz a „README” linkre.

Most már a Github fájlszerkesztő felületet látod, a README.md nevű fájllal. Változtasd meg a fájl nevét README.md-ről index.html-re! A szerver arra számít, hogy a weboldal mappában a fő fájl neve index.html. Az index oldalad linkelhet majd más oldalakra is.

Töröld a fájlszerkesztő aktuális tartalmát, cseréld ki a weboldalad HTML kódjára! Kimásolhatod és beillesztheted a HTML kódot valamelyik Khan Academy projektedből, vagy egy olyan projektből, amit a számítógépeden fejlesztesz.

Görgess le az oldalon addig, amíg meg nem találod a Commit area-t (commit terület), és kattints a „Commit new file”-ra (Fájl beküldése committal)! Minden alkalommal, amikor egy fájlnak létrehozod egy új verzióját, egy „commit”-ot hozol létre, ami eltárolja a fájl verziótörténetét. Minden commitnak van egy üzenete, ami leírja, mi változott. A Github javasol egy alapértelmezett üzenetet (ebben az esetben ez a „Create index.html”), de ezt felülírhatod azzal, hogy begépelsz a beviteli mezőbe.

1-10 percig tart a Githubnak feltölteni a projekted változtatásait a felhasználó weboldalára, ezért türelmesnek kell lenned. Emellett lehet, hogy „teljes frissítés”-t kell az oldalra végrehajtani (tartsd a Shift gombot frissítéskor) ahhoz, hogy a böngésződ gyorsítótárát kitöröld.

Néhányan közületek már valószínűleg dolgoztak több fájlból álló weboldalakkal a Khan Academyn kívül, asztali szerkesztőt használva. A weboldalatok lehet, hogy több HTML, CSS, JS és képfájlból is állt.

Ha szeretnéd feltölteni egy ilyen korábbi weboldaladat Githubra, ne aggódj, nem kell minden egyes fájlt egyesével kimásolni és beilleszteni! Elég unalmas is lenne. Van rá egy jobb mód...

Látni fogsz egy Github fájlfeltöltő felületet. Válaszd ki a fájlokat húzd-és-ejtsd módon, vagy használd a fájlválasztót:

Általában célszerű minden olyan fájlt feltölteni, ami változott. Ha bizonytalan vagy, csak tölts fel mindent. A Github olyan algoritmust használ, ami meg tudja állapítani, hogy mi változott és mi nem, és csak azokhoz a fájlokhoz készít új verziót, amik megváltoztak.

Ne feledd, hogy 10 percbe is telhet, mire a változások érvénybe lépnek. A türelem rózsát terem. 😊

Ezért a legjobb, ha a saját asztali környezetedben fejlesztesz és tesztelsz, és csak akkor töltöd fel Github-ra (vagy bármilyen másik szolgáltatóhoz) amikor már elégedett vagy a saját gépeden azzal, ahogyan a weboldalad fest.