DevTools nejsou nepřítel
Tak se s nimi skamaraď s námi!
Pokud jen trošku přičichneš k vývoji webových aplikací, tak DevTools se ti budou hodit na prozkoumávání a studování applikace. Přidej se na jízdu prozkoumávání webových stránek.
Proč by tě to mělo zajímat...
Pokud ses v něčem našel, jsi tu správně. Náš kurz je pro tebe jako dělaný, pokud:
- máš základní znalosti HTML a CSS (někdy si napsal jednoduchou stránku)
- máš základní znalosti JavaScriptu (víš co je proměnná a podmínka)
- tušíš, co je to webová aplikace
Proč znát DevTools?
Švýcarský nůž každého vývojáře i testera
Dokážeš si představit webový vývoj bez DevTools? My ne! Jsou jako multifunkční švýcarský nůž v digitálním světě - nepostradatelné pro každého vývojáře i testera. Ať už ladíš HTML, CSS, JavaScript nebo analyzuješ výkon stránky, DevTools jsou tvým věrným společníkem. Je to jako mít superschopnost vidět pod pokličku každé webové aplikace - prostě must have pro každého, kdo se pohybuje ve světě webu!
Už žádný console.log 10x v kódu
Už tě nebaví zaplavovat kód desítkami console.log? DevTools jsou tvoje tajná zbraň. S Network panelem odhalíš každý API požadavek, s Consolí elegantně zkoumáš proměnné, a s Debuggerem procházíš kód řádek po řádku. S DevTools už nemusíš hádat - vidíš přesně, co se v tvé aplikaci děje. Tak proč se spokojit s primitivním výpisem do konzole, když můžeš mít celou laboratoř na dosah ruky?
Virtuální opravna pro webové vývojáře
Máš pocit, že tvoje stránka vypadá jinak než by měla? Nefunguje ti JavaScript tak, jak očekáváš? S DevTools se stáváš detektivem i chirurgem webových aplikací. I zdánlivě neřešitelné problémy často mají jednoduché řešení - stačí vědět, kam se podívat. S DevTools můžeš diagnostikovat a opravit jakýkoliv webový neduh. Proč se trápit s nefunkčními stránkami, když máš po ruce nástroj, který ti umožní rychle identifikovat a napravit každou chybu?
Proč je aplikace pomalá
Trápí tě pomalé načítání stránky? Freezuje se ti aplikace při scrollování? S DevTools se stáváš výkonnostním guru. Využij Performance panel k analýze renderování, JavaScript execution a layoutu. Či Sleduj síťové požadavky v Network tabu a odhal zbytečně velké assety. Je to jako mít superpočítač, který rozloží tvou aplikaci na prvočinitele. Drobné optimalizace mohou vést k výraznému zrychlení. Proč se spokojit s línou aplikací, když můžeš mít raketu?
Těžko získáš zkušenosti bez praxe, ale praxi ti nedají, pokud nemáš základy.
Přihlas se na kurz a připrav se na nálož učení
Suchý je únor
ne náš výklad.
Prezentuj se díky svým dovednostem.
Nekonečné opáčko
Záznamy všech lekcí budou tvoje navždy! Zapomněl jsi něco? Žádný problém, pusť si to znovu.
Dostaneš extra materiály, které tě posunou ještě dál. Vždy je co objevovat!
IT partu na Discordu
Máš otázku? Cokoli tě trápí? Nejsi v tom sám. Náš Discord bude tvůj druhý domov.
Certifikát o absolvování
Důkaz, kterým můžeš potvrdit své znalosti. Připrav se na obdivné pohledy kolegů!
4. 11. 2024
10 lekcí
2680 Kč
Platí pro Jsem v Kurzu.
4. 11. 2024
10 lekcí
12900 Kč
do 15. 10. poté 14900 Kč
Přihlas se na kurz prostřednictvím programu Jsem v kurzu.
Získej cenovou výhodu.
V úvodní lekci se seznámíme s DevTools. Naučíš se jak se v nich pochybovat a navigovat. Podíváme se na interface Devtools v různých prohlížečích.
Prozkoumáme z lehka jednotlivé záložky, ať víš, co tě čeká.
V této lekci se do hloubky ponoříme do záložky elements. Prozkoumáme jednotlivé prvky na stránce detailněji v DOMu. Naučíš se editovat HTML i CSS stránek.
V této lekci se dozvíš víc o Box Modelu, čí Flexboxu nebo Gridu.
Nedají ti chyby spát? V této lekci se zaměříme na jejich odhalování. Podíváme se blíže na logování chybových hlášek. Prozkoumáme záložku Control.
Naučíš se pomocí break pointů zastavit událost a prozkoumat kód.
Záložka network nabízí exkurzi do komunikace mezi tvým prohlížečem a serverem. Rozpitváme requesty dopodrobna. Probereme je důkladně.
Kromě toho se naučíš jak simulovat pomalejší rychlost internetu.
Říká ti něco cache, service workery či local storage? Nvštívíme záložku application, kde se naučíš prozkoumat paměť aplikace.
Další neméně důležitá záložka je Security. Porozumíš jednotlivým údajům.
Prozkoumáme stránku pomocí Lighthouse. Zjistíme její hodnocení. Naučíš se interperetovat výsledky.
Zjistíš, že Ligthouse není vše. Podíváme se na zoubek Performance panelu.
Podíváme se na přístupnost webových aplikací. Zaměříme se na accesibility tree a zároveň probereme možnosti testování přístupnosti.
Zkusíš si jak v DevTools nasimulovat mobilní zařízení pro potřeby testování responzitivity.
Ponoříme se více do záložky Sources. Naučíš se jak si zmrazit prohlížeš. Napíšeš si kousky kódu - snippety, kterými pak můžeš ovlivňovat stránku.
V druhé části si přprav mobilní zařízení a kabel. Budeme přes Devtools zkoumat prohlížeč na tvém mobilu.
Spousta aplikací nyní používá animace pro zpříjemnění uživatelského zážitku. Ale nic se nemá přehánět. Společně se podíváme na to, jak s animacemi pracovat v DevTools.
A vrátíme se trošku k přístupnosti, abychom zase podali o kus lepší zpětnou vazbu k přístupnosti.
Na závěr si vše zopakujeme. Podávíme na best practices. Dozvíš se jak si zjistit verzi prohlížeče.
Zároveň nebudeš odcházet s práznou. Máme pro tebe připravené zdroje, které stojí za to prozkoumat.
Po univerzitě jsem se rozhodla, že nechci být vývojářka. Proč? Našla jsem vzrušující svět testování webových aplikací. Něco nového, neprozkoumaného a lákavého. Je tomu již několik let a můj názor se nezměnil, spíše se prohloubil.
Během své cesty jsem spolupracovala na vývoji několika aplikací. Ať už jsem psala automatické testy, nebo manuálně testovala, poznala jsem, že dobrá znalost základních pojmů a konceptů je důležitá a přenositelná.
Proto se mi například jednoduše přechází mezi jednotlivými testovacími frameworky.
Přestože nejsem vývojář, starám se o code base a dbám na best practices. Důležité pro mě je, aby všichni členové týmu měli vhodné podmínky pro spolupráci. Proto jsem na jednom projektu vedla migraci z JavaScriptu na TypeScript a na dalších projektech zavedla statickou analýzu kódu.
Své znalosti ráda předám dál. Již jsem mentorovala několik kolegů během jejich začátků s automatizací. Důležité pro mě je, že nejenže ví, jak nabušit testy nebo něco proklikat podle návodu, ale také rozumí, proč to dělají.
Kurz má devět dvouhodinových lekcí, které budou probíhat každé pondělí a čtvrtek.
Je možné, že kurz netradičně odstartuje ve čtvrtek. Během státního svátku si dáme studijní volno.
Jsem v kurzu je program od Ministerstva práce a sociálních věcí.
Během tří let ti mohou schválit dotaci na kurzy v hodnotě 50 tisíc. Kurzy ti neplatí celé, je potřeba tvoje spoluúčast. V případě našeho kurzu je to x Kč.
Chceš-li vědět víc o programu, doporučujeme se podívat na stránky programu.
Pro absolvování kurzu musíš splnit:
- docházky minimálně 16 hodin
- 80% úkolů z lekcí (kvízy, prozkoumávání stránek).
Úkoly budou vždy oznámeny na lekci a dostaneš
e-mail se zadáním. Deadline je poslední lekce kurzu.
Na našem Discord bude nejpozději po první lekci vytvořena podpůrná skupina, do které budou mít vstup jen účastníci kurzu a naši lektoři.
Do skupiny můžeš psát svoje dotazy, lektoři ti odpoví co nejdříve.
Počítej s tím, odpověď nebude vždy okamžitá. Když napíšeš dotaz po půlnoci pravděpodobně dostaneš odpověď až ráno.
Kurz stojí 13 400 Kč včetně DPH.
Pokud pošleš přihlášku do 15. 10., dostaneš slevu 2000 Kč. Pozor zvýhodnění platí pouze do půlnoci.
Od 16. 10. je kurz za plnou cenu.
Pokud se hlásíš přes program Jsem v kurzu. Tak cena se odvíjí od podmínek programu. Při splnění podmínek účasti ti bude programem proplaceno až 80% z ceny kurzu.
Kurz je zcela online. Lekce budou probíhat na platformě Google Meets.
Nemusíš si nikde tvořit účet, stačí se připojit. Pozvánka ti přijde na email. Záznamy obdržíš vždy několik hodin po lekci.
Podpůrná skupina bude na našem Discord, kam se musíš přihlásit a dát lektorovi vědět během první lekce svoje přihlašovací jméno.
