Lekce 5 - Databázový klient v Angular - Zprovoznění routování
V minulé lekci, Databázový klient v Angular - Příprava projektu, jsme připravili adresářovou strukturu projektu, stáhli jsme hotový kód serveru a šablonu Angular klienta.
V této lekci tutoriálu JavaScriptu a frameworku Angular se naučíme routovat. Napíšeme si také první komponentu, kterou následně při routování využijeme.
Bootstrap
V rámci tutoriálu se nebudeme zdržovat psaním vlastního CSS. Protože
ale chceme, aby naše aplikace nějak vypadala, využijeme CSS třídy front-end
frameworku Bootstrap. Proto ještě než
začneme s psaním našich komponent, přesuneme se do složky
client/
a nainstalujeme tento framework příkazem:
npm i bootstrap
Zbývá ještě importovat Bootstrap framework do naší Angular aplikace. Nabízí se nám dva způsoby:
- upravení
angular.json
- import přímo do
styles.css
Ukážeme si zde oba. V tutoriálu využijeme ten druhý.
Upravení angular.json
Otevřeme si angular.json
a najdeme řádek, který začíná
"styles": [...]
. Upravíme pole tak, aby vypadalo takto:
...konec náhledu článku...
Pokračuj dál
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.
Koupit tento kurz
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íš se smluvními podmínkami.
- Neomezený a trvalý přístup k jednotlivým lekcím.
- 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 Angular tutoriálu si nainstalujeme knihovnu Bootstrap a napíšeme si první komponentu pro zobrazení seznamu filmů. Dále si ukážeme základy routování.
Kredity získáš, když podpoříš naši síť. To můžeš udělat buď zasláním symbolické částky na podporu provozu nebo přidáním obsahu na síť.