Kompletný kurz CSS frameworku Bootstrap - Online kurz

Tento online kurz ťa prevedie CSS frameworkom Bootstrap, najpopulárnejším nástrojom pre ľahkú a rýchlu tvorbu webových šablón. Lekcie obsahujú praktické ukážky a úlohy na precvičenie získaných zručností.

27 lekcií

24 samostatných úloh

5 vedomostných testov

Certifikát absolventa

Prečo sa oboznámiť s frameworkom Bootstrap?

Každý, kto dnes vytvára, spravuje či vlastní webové stránky, by určite chcel, aby bol tento jeho internetový priestor pre návštevníkov čo najviac prívetivý, pohodlný, estetický a prehľadný. Chce samozrejme tiež, aby bol jeho web responzívny, teda aby sa zobrazoval rovnako dobre či už si ho bude návštevník prezerať na mobile, tablete či na obrazovke počítača. Na to, aby stránka dobre vyzerala a mala správne formátovanie, slúžia kaskádové štýly, teda jazyk CSS. Aj ten najväčší znalec a majster CSS však časom narazí na jeden problém: pri nových weboch musí stále dookola nastavovať tie isté základné vzhľadové parametre. Prečo si túto prácu, často vo svojej podstate monotónnu a nekreatívnu, nezjednodušiť a nevyužiť už predpripravené komplexné knižnice s CSS vlastnosťami, teda tzv. frameworky? Najznámejší a celosvetovo známy CSS framework pritom vznikol na Twitteri a volá sa Bootstrap. Jednou z najjednoduchších ciest, ako sa do jeho používania prirodzene dostať, je začítať sa do lekcií práve v tomto kurze.

Čo ťa tento kurz naučí?

Hneď v úvode kurzu sa dozvieš, čo je to framework Bootstrap a aké sú jeho základné vlastnosti. Teda napr. to, že je zadarmo, "flat", mobile-first a responzívny (týmto pojmom sa venuje samostatný kurz responzívneho web dizajnu). V úvode kurzu rozoberáme aj šablóny a odkiaľ ich stiahnuť.

Dozvieš sa o zásadách, ktoré treba pri práci s Bootstrapom dodržiavať. Následne preberáme základné triedy v Bootstrape, napr. pre nadpisy, zvýraznené písmo atď. Naučíš sa, ako Bootstrap používať na formátovanie responzívnych obrázkov a ako sa v ňom pracuje s farbami . Lekcie potom pokračujú bootstrapovým grid systémom, cez ktorý sa nastavuje formátovanie layoutu stránky.

Neskôr preberáme vytváranie bootstrapových tabuliek, tlačidiel a tiež formulárov. Pri CSS si precvičíš aj jednoduché skriptovanie v JavaScripte, ktoré slúži napr. na tvorbu rozbaľovacieho zoznamu alebo na validáciu formulára. Spomenuli sme aj "jumbotron", teda veľký informačný box. Medzi ďalšie preberané prvky patria napríklad odznaky, zoznamy či záložky, čiže taby. V nasledujúcich lekciách sa dozvieš o kartách, ktoré využiješ napr. pri vytváraní e-shopu. Ďalšími preberanými komponentmi sú carousel čiže kolotoč, ktorý slúži napríklad na vytvorenie prezentácie, a progress, ktorý ukazuje napr. načítanie obsahu. Ďalej rozoberáme zbaľovacie a rozbaľovacie komponenty typu collapse a dropdowns.

Pozornosť je potom venovaná tzv. utilitám, ktoré spríjemňujú každodennú prácu s frameworkom Bootstrap. Osobitnú pozornosť si následne zaslúžia utility typu flex. Ďalej sa kurz venuje štýlovaniu úhľadnej navigácie, omrvinkovej navigácie, ktorá je dôležitá pre zložitejšie weby, paginácie a upozornenia. Neskôr prejdeme k modálnym dialógom a informačným bublinám. Následne sa naučíš, ako používať komponenty scrollspy a tooltip. V závere kurzu sa potom preberajú multimediálne objekty a kontajnery.

Samozrejmosťou je veľké množstvo úloh, na ktorých si precvičíš väčšinu preberanej látky a ktoré ťa budú nútiť hľadať nové riešenia. Po skončení kurzu môžeš pokračovať napr. na kurz zameraný na tvorbu Bootstrap šablóny z PSD súboru, ďalšie kurzy zamerané na web a jeho štýlovanie alebo na kurzy podrobne sa zaoberajúce JavaScriptom.