If you're seeing this message, it means we're having trouble loading external resources on our website.

Ha webszűrőt használsz, győződj meg róla, hogy a *.kastatic.org és a *.kasandbox.org nincsenek blokkolva.

Fő tartalom

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.
Megjegyzés: a Khan Academy nem áll kapcsolatban a Github-bal. Kérjük, hogy tekintsd át a Github Felhasználási feltételeit és egyéb szabályzatait, mielőtt regisztrálsz egy fiókot, főleg ha 13 év alatti vagy.

Github fiók regisztrációja

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.
Képernyőkép a Github regisztrációs képernyőjéről
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!)
Képernyőkép a Github regisztráció második lépéséről
Harmadik lépésként válaszolj a kérdőív kérdéseire, vagy ugord át ezt a lépést:
Képernyőkép a Github regisztrációról, 3. lépés: kérdőív
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:
Képernyőkép a Gmail megerősítő képernyőjéről a Github-hoz

Github projekt létrehozása a weboldaladhoz

Miután megerősítetted az e-mail címedet, látni fogod a kezdőlapot. Kattints a „Start a project” gombra.
Képernyőkép a Github kezdő oldaláról két gombbal: Read the guide és Start a project
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:
Képernyőkép a Github felületéről új projekt létrehozáskor
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.
Képernyőkép a Github felületéről új projekt létrehozása után
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.
Képernyőkép a Github fájlszerkesztőjében a README.md fájlról, a fájlnév bekarikázva
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.
Képernyőkép a Github fájlszerkesztőjéről HTML-lel a szerkesztőmezőben
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.
Képernyőkép a GitHub "Commit new file" (új fájl commitolása) felületéről
Írd be a böngésződbe, hogy YOUR_USERNAME.github.io, és frissítsd újra mindaddig, míg a weboldalad be nem töltődik.
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.
Képernyőkép egy github.io weboldalról

Több fájlból álló weboldalak feltöltése GitHubra

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...
Nyisd meg a projektet Github-on és kattints az „Upload files” (Fájlok feltöltése) gombra.
Képernyőkép a Github projektfelületéről, ahol az "Upload files" gomb piros színnel van bekarikázva
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:
Keresd meg a projekt mappádat, és válaszd ki azokat a fájlokat, amiket fel szeretnél tölteni.
Á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.
Képernyőkép a fájlválasztóról
Írj be egy új commit üzenetet és kattints a „Commit changes” (Változások commitolása) gombra.
Képernyőkép a feltöltött fájlok commitolásáról
Frissítsd a weboldaladat, hogy lásd a változásokat!
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.
Képernyőkép a véglegesként feltöltött weboldalról

Szeretnél részt venni a beszélgetésben?

Még nincs hozzászólás.
Tudsz angolul? Kattints ide, ha meg szeretnéd nézni, milyen beszélgetések folynak a Khan Academy angol nyelvű oldalán.