Pojď si s námi naprogramovat jednoduchou hru. O co v ní půjde? O zdraví. 😊 Postavička, kterou si naprogramuješ a budeš ovládat, se rozhodla zůstat doma, protože venku řádí „chorobné potvůrky”. Cílem je za co nejkratší čas posbírat veškeré vitamíny a ovoce, které postavičku udrží v kondici.

Tvým hlavním úkolem bude vytvořit hru od základů. Celou hru postavíme na webových technologiích a jazyce HTML, CSS a JavaScript. Dnes začneme zlehka, přípravou editoru, do kterého budeme následující dny psát kód.

Aby bylo všechno pohodlné, nebudeme používat klasický editor, ale online editor – Repl.it. Pokud nemáš na Repl.it vytvořený účet, tak si ho založ.

Po úspěšné registraci stiskni tlačítko Start coding now. Případně, pokud už jsi účet měl/a, klikni nahoře v menu na My repls a na stránce pak klikni na velké kulaté tlačítko se znakem plus v pravém dolním rohu obrazovky.

Objeví se nabídka různých typů projektu, které můžeš v Repl.itu vytvořit. V kategorii Popular vyber HTML, CSS, JS: The languages that make up the web.


Repl.it pak vytvoří nový projekt a objeví se stránka rozdělená na 3 části. Úplně vlevo je seznam souborů v našem projektu. Repl.it ti sám připravil soubory index.html, style.css a script.js. Uprostřed je hlavní blok, kam budeme psát náš kód. V pravé části je zatím zcela prázdná bílá stránka – tam uvidíš výsledek, když svoji stránku spustíš pomocí tlačítka Run.

V levém horním rohu najdeš jméno projektu, toto jméno ti vytvořil Repl.it, vedle je šedá ikonka tužky. Klikni na tužku a svůj projekt si pojmenuj.

Využíváš jiný editor?

Pokud už máš něco naprogramováno, jistě využíváš jiný program, např. Visual Studio Code. Projekt můžeš zpracovat i ve svém editoru, jen si musíš všechny složky a soubory vytvořit sám.

Použitý editor nemá na výsledný projekt žádný vliv a Repl.it nedělá nic speciálního, co by jiný editor nezvládl.

Na závěr

Paráda! Pro dnešek máme hotovo. 😊 Těšíme se na tebe zase příště! 😊

Projekt online vzdělávání byl realizován v rámci Stipendia Czechitas v projektu: „Ženy do IT“ (reg.č. CZ.03.1.51/0.0/0.0/16_061/0003268), který je financován z prostředků Evropského sociálního fondu prostřednictvím Operačního programu Zaměstnanost.

ZAUJAL TĚ TENTO ONLINE KURZ?

Odebírej náš měsíční newsletter, kde najdeš například IT novinky, Tech Meetupy, ale i pozvánky na konference. Čas od času ti dohodíme slevu na vstup, zajímavé pracovní příležitosti nebo tipy, kde se dál vzdělávat. Buď v obraze!

Odebírej Newsletter