Komponent s direktívou 'use client'.
Klientsky komponent používa hooky, stav a prehliadačové API, preto sa hydruje v prehliadači.
Praktické využitie
- Vyhľadávací panel slovníka je klientsky komponent.
Každý pojem obsahuje slovenský význam, praktické vysvetlenie a konkrétny príklad použitia. Sekcia vznikla pre podnikateľov aj junior developerov, aby rozumeli slovám, ktoré denne používame pri návrhu moderných digitálnych produktov.
Komponent s direktívou 'use client'.
Klientsky komponent používa hooky, stav a prehliadačové API, preto sa hydruje v prehliadači.
Rozdelenie balíka na menšie časti načítané podľa potreby.
Next.js vytvára samostatné chunks a dynamické importy, čím zrýchľuje prvé načítanie stránky.
Základný diel používateľského rozhrania.
Komponent vytvára izolovanú časť UI so vzhľadom, logikou a stavom v Reacte aj Next.js.
Zdieľanie dát naprieč stromom komponentov.
Kontext poskytuje globálne hodnoty ako téma či používateľ bez nutnosti reťaziť props.
Komponent zachytávajúci runtime chyby detí.
Záchytná hranica zobrazí náhradný obsah a zabráni pádu aplikácie pri chybe v konkrétnej sekcii.
Funkcia s prefixom use rozširujúca komponent.
Hooky ako useEffect, useMemo či useRef pridávajú stav, efekty aj optimalizácie bez tried.
Oživenie serverom vykresleného HTML na klientovi.
Hydratácia pripája udalosti ku statickému HTML a synchronizuje stav s klientskym Reactom.
Statika s automatickým prepočítaním obsahu.
ISR kombinuje SSG a SSR, po intervale potichu pregeneruje stránku a doručí čerstvé dáta.
Syntax kombinujúca HTML a JavaScript.
JSX zapisuje komponenty ako HTML s výrazmi a pri build-e sa prekladá na React volania.
Konfigurácia titulkov, popisov a OG informácií.
Next.js generateMetadata vytvára SEO dáta, kanonické odkazy aj Open Graph obrázky pre stránky.
Kód bežiaci pred obsluhou požiadavky.
Middleware v Edge runtime presmeruje, overí prístup alebo doplní hlavičky ešte pred odpoveďou.
Komponent pre automaticky optimalizované obrázky.
next/image generuje viaceré veľkosti, lazy loaduje a používa moderné formáty pre lepší výkon.
Dáta alebo funkcie od rodičovského komponentu.
Props definujú rozhranie komponentu, prenášajú texty, čísla aj callbacky a kontrolujú sa typmi.
Metódy zvyšujúce organickú návštevnosť webu.
SEO kombinuje technický výkon, obsah a odkazy; Next.js pomáha rýchlosťou, metadata aj sitemapami.
Funkcia označená 'use server' volaná z klienta.
Serverová akcia bezpečne spracuje formulár, vykoná databázovú operáciu a vráti výsledok.
Komponent vykreslený len na serveri.
Serverové komponenty získajú dáta bez JavaScriptu na klientovi, čím šetria prenos a výkon.
Generovanie HTML pri každej požiadavke.
SSR obsluhuje dynamické dáta na serveri, prináša čerstvý obsah a posilňuje SEO stránok.
Meniteľné údaje riadiace správanie komponentu.
Stav uchováva aktuálne hodnoty pomocou useState alebo databázy a mení vzhľad či logiku.
PostgreSQL s API, autentifikáciou a realtime službami.
Supabase ponúka databázu, bezpečné RLS politiky aj klienta, ktorý sa hodí k serverovým akciám.
Zobrazuje zástupný obsah počas načítania.
Suspense spolupracuje so streamingom a lazy loadingom a zobrazuje skeletony do príchodu dát.
Sada tried na rýchle responzívne štýly.
Tailwind poskytuje utilitné triedy, JIT engine odstráni nepoužité štýly a udrží konzistentný dizajn.
Jazyk pridávajúci statickú typovú kontrolu.
TypeScript umožňuje definovať rozhrania, generiká a zabraňuje chybám ešte pred spustením kódu.
Reaguje na zmeny stavu alebo props po renderi.
useEffect vykoná vedľajší efekt, napríklad fetch dát, a vie upratať zdroje v cleanup funkcii.
Pamäťová kópia DOMu na porovnávanie zmien.
React diffuje virtuálny strom s predchádzajúcim stavom a do prehliadača posiela len rozdiely.
Preložené pojmy
24
Zahrnuté anglické výrazy z Reactu, Next.js aj nástrojov vývoja.
Tematické okruhy
21
Architektúra komponentov, správa dát, optimalizácia a marketing.
Pokryté technológie
9
Frameworky, knižnice a služby používané v projektoch Upgrade-Web.