Nové výhodné předplatné namísto kreditů je tu! Více informací. Upravili jsme také naše provozní podmínky.
NOVINKA: Staň se datovým analytikem a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:

Lekce 7 - Databázový klient v React - Navigace a sdílené konstanty

V minulé lekci, Databázový klient v React - Přehledy filmů a osob, jsme si vytvořili komponentu pro výpis záznamů o osobnostech a zdokonalili jsme si způsob odesílání požadavků pomocí funkce fetch().

V dnešním React tutoriálu si vytvoříme navigaci na hlavní stránce. Také přidáme sdílené konstanty a další utility funkci.

Vytvoření navigace

Teď když máme hotový přehled filmů i osobností, vytvoříme si navigační menu v komponentě App. To nám umožní jednoduše přepínat mezi zobrazením našich dvou komponent, reprezentujících stránky s přehledy filmů a osob.

Instalace react-router-dom

K práci s navigací budeme v React potřebovat knihovnu react-router-dom. Přesuneme se proto do složky client/ v příkazovém řádku a spustíme příkaz:

Windows PowerShell
PS C:\Users\sdrac\Dropbox\movie-database\client> npm i react-router-dom@^7.1.3

Přidání navigace do App.jsx

Nakonec upravíme kód komponenty App, který si hned vysvětlíme:


 

...konec náhledu článku...
Pokračuj dál

Znalosti v hodnotě stovek tisíc získáš za pár korun

Došel jsi až sem a to je super! Věříme, že ti první lekce ukázaly něco nového a užitečného.
Chceš v kurzu pokračovat? Přejdi do prémiové sekce.

Před koupí tohoto článku je třeba koupit předchozí díl

Obsah článku spadá pod licenci Premium, koupí článku souhlasíš s Provozními podmínkami.

Co od nás v dalších lekcích dostaneš?
  • Přístup k jednotlivým lekcím dle způsobu pořízení.
  • Kvalitní znalosti v oblasti IT.
  • Dovednosti, které ti pomohou získat vysněnou a dobře placenou práci.

Popis článku

Požadovaný článek má následující obsah:

V React tutoriálu si vytvoříme navigaci na hlavní stránce. Také přidáme sdílené konstanty a další utility funkci.
Článek pro vás napsal Petr Kozler
Avatar
Autor se věnuje vývoji převážně webových aplikací v PHP nebo Pythonu.
Aktivity