Podstawowy samouczek React
Wprowadzenie
Instalacja React
Podłączenie wtyczki react-devtools
Podejście komponentowe
Układ strony
Wynik działania komponentu
Język JSX
Wprowadzenie do JSX
Zwracanie zagnieżdżonych tagów
Przeniesienie tagu w dół
Zwracanie wielu tagów
Zwracanie niezamkniętego tagu
Zwracanie pustego tagu przez funkcję
Wstawianie wartości zmiennych
Niuanse przy wstawianiu zmiennych
Wstawianie tablic
Wstawianie obiektów
Wstawianie w atrybuty
Przechowywanie tagów w JSX
Przechowywanie wielu tagów
Tagi na różnych liniach
Zwracanie tagów
Zamkniętość tagów JSX
Poprawność wersji
Wykonywanie kodu JavaScript
Warunki
Warunki w JSX
Wyświetlanie warunkowe
Warunki dla zwracanego tagu
Operator trójargumentowy w JSX
Użycie operatora && w JSX
Inwersja dla skróconych warunków
Funkcje
Używanie funkcji
Wywoływanie funkcji wewnątrz znaczników
Podpinanie procedur obsługi
Parametry procedur obsługi
Obiekt Event
Obiekt Event przy przekazywaniu parametrów
Tworzenie znaczników
Tablica znaczników
Tablica znaczników w pętli
Znaczniki z tablicy z danymi
Klucze w tablicy
Tablica obiektów
Klucze przez id
Tabela z tablicy obiektów
Unikalne id
Dyskusja
Problemy z nowymi id
Losowe ciągi znaków dla id
Generowanie id
Funkcja generująca id
Używanie funkcji id
Nieprawidłowe użycie funkcji
Stany
Formularze
Praca z polami input
Zmiana danych input przy ich wyświetlaniu
Zmiana danych za pomocą funkcji
Praca z wieloma polami input
Przetwarzanie danych formularza
Praca z textarea
Praca z checkboxami
Checkboxy i renderowanie warunkowe
Praca z selectami
Punkty select z tablicy
Atrybuty value w select
Atrybuty value select z tablicy
Praca z radio
Wartości domyślne
Powiązanie pól input z tablicą
Powiązanie pól input z obiektem
Dane
Wprowadzenie
Reaktywne dodawanie do tablicy
Reaktywne operacje na tablicach
Reaktywne dodawanie do tablicy obiektów
Reaktywne operacje na tablicach obiektów
Reaktywne wyświetlanie danych
Komponenty
Wprowadzenie do komponentów
Używanie komponentów
Wiele instancji komponentu
Propsy komponentów
Komponenty potomne
Tablica do tworzenia komponentów potomnych
Komponenty potomne w pętli
Przekazywanie stanów do komponentów potomnych
Przekazywanie id do komponentu
Zmiana stanu rodzica
Edycja stanu rodzica
Edycja stanu przodka
Tryby pracy przez stany
Koncepcje
Wprowadzenie
Dane komponentów
Typy komponentów
Jednokierunkowy przepływ danych
Podnoszenie stanu
Jedno źródło prawdy
Stylizacja
Metody stylizacji w React
Globalny CSS
Wstawianie danych do atrybutu style z obiektu
Wstawianie danych do atrybutu style z osobnego pliku
Praca z stylami CSS w atrybucie style
Wstawianie danych do atrybutu style ze zmiennych
Styled Components
Propsy w Styled Components
Propsy i renderowanie warunkowe w Styled Components
Komponenty z rozszerzoną stylizacją
Rozpoczęcie pracy z CSS modules
Kontynuacja pracy z CSS modules
Polecenie composes dla klas
Polecenie composes dla plików