Hlavní obsah
Programování
Kurz: Programování > Kapitola 2
Lekce 5: Nástroje webového vývojářeProvozování webových stránek na Github
Github je společnost, která poskytuje úložiště pro repozitáře (adresáře) s kódy k projektům. Mnoho kódů je tzv. "open source", to znamená, že jsou veřejně dostupné pro celý svět. Díky tomu se mohou programátoři od sebe navzájem učit a společně pracovat. Khan Academy má také několik open source repozitářů. Tyto repozitáře nemusí obsahovat pouze HTML a CSS kódy, ale i ostatní typy kódů, které jsou u jednotlivých projektů potřeba.
Proč se o nich zmiňujeme? Github totiž umí hostovat webové stránky (Github Pages), takže si můžeme sami založit vlastní webovou stránku na adrese
našeuživatelskéjméno.github.io
.Poznámka: Khan Academy nespolupracuje s Githubem. Pokud si chceš založit účet, je nutné nastudovat si pravidla užívání a další podmínky Githubu, především pokud je Ti méně než 13 let.
Vytvoření účtu na Github
Po otevření stránky github.com uvidíme na hlavní stránce přihlašovací formulář. (Pokud ne, již účet máme! Přeskočíme tedy na Krok 2.)
Při vybírání svého uživatelského jména musíme pamatovat na to, že bude veřejně zjistitelné na internetu a bude součástí naší URL adresy:
našeuživatelskéjméno.github.io
. Někteří lidé místo svých pravých jmen využívají přezdívky nebo různá vtipná jména.V druhém kroku vybereme "free plan" (účet zdarma). Pro veřejnou webovou stránku není třeba placený účet (pokud budeš později potřebovat některé z pokročilých funkcí, můžeš tuto volbu kdykoli změnit).
V třetím kroku můžeme, ale nemusíme, vyplnit průzkumový dotazník:
Poté, co vyplníme registrační formulář, si zkontrolujeme náš e-mail a klikneme na odkaz pro potvrzení naší e-mailové adresy.
Vytvoření projektu na Github pro webovou stránku
Jakmile potvrdíme naší adresu, uvidíme úvodní stránku. Klikneme na "Start a project".
Na stránce pro vytvoření nového projektu budeme vyzváni, abychom vyplnili jméno projektu. ¨Musíme si dát pozor, abychom pojmenovali projekt přesně "našeuživatelskéjméno.github.io". Tím Githubu říkáme, že tvoříme webovou stránku a aby nahrával naše soubory na veřejné URL, kdykoliv je změníme. Jelikož naše uživatelské jméno bylo "PamelaFoxBot", projekt jsme pojmenovali "PamelaFoxBot.github.io":
Máme nový projekt! Nejsou v něm však žádné soubory. Pro rychlé vytvoření souboru klikneme na odkaz "README":
Nyní se díváme na prostředí Github pro úpravu souboru
README.md
. Změníme jméno souboru z README.md
na index.html
. Servery očekávají, že hlavní stránka webové stránky bude v adresáři pojmenována index.html
. Z této stránky poté můžeme odkazovat na ostatní stránky.Nyní smažeme stávající obsah editoru souboru a vložíme HTML kód naší stránky. Můžeme zkopírovat kód z projektu Khan Academy, nebo z našeho vlastního.
Nyní sjedeme dolů po stránce a klikneme na tlačítko "Commit new file". Každou novou verzi souboru takto musíme potvrdit, aby se uložila. Každé potvrzení obsahuje popis změn. Github nám zde navrhuje pojmenování této verze jako "Create index.html", ale tento název můžeme přepsat.
Do prohlížeče napíšeme našeuživatelskéjméno.github.io a zkoušíme obnovovat adresu, dokud se stránka nenačte.
Githubu trvá zpracovat změny v projektu 1-10 minut, musíme proto být trpěliví. Možná budeme muset během načítání držet klávesu Shift, aby se vyprázdnila mezipaměť prohlížeče.
Nahrání vícesouborové webové stránky na Github
Pokud pracujeme na webových stránkách mimo Khan academy, naše stránka může mít více HTML, CSS, JS a obrázkových souborů.
Na Github naštěstí nemusíme každý soubor nahrávat jednotlivě! To by jistě bylo únavné. Je tu lepší řešení...
Otevřeme náš projekt na Github a klikneme na "Upload files".
Objeví se prostředí pro nahrávání souboru. Pro výběr souborů soubory přetáhneme, nebo použijeme průzkumník souborů:
Najdeme složku našeho projektu a vybereme soubory, které chceme nahrát.
Obvykle chceme nahrát ty soubory, které jsme změnili. Pokud si nejsme jisti, nahrajeme všechno. Github si sám zkontroluje, které soubory se změnily, a které ne, a nahraje pouze nové verze změněných souborů.
Změníme název verze podle libosti a klikneme na "Commit changes".
Znovu načteme naši stránku, abychom si prohlédli změny!
Musíme pamatovat, že to může zabrat až 10 minut. Trpělivost je náš přítel. :)
Nejlepší je proto vytvářet a testovat projekty ve vlastním prostředí v počítači, a na Github (nebo kamkoliv jinam) je nahrát, až když jsme s nimi plně spokojeni.
Chceš se zapojit do diskuze?
Zatím žádné příspěvky.