React i Redux. Praktyczne tworzenie aplikacji WWW. Wydanie II - ebook

React służy do budowy złożonych jednostronicowych aplikacji WWW. Jest biblioteką języka JavaScript, utworzoną i udostępnianą przez Facebook na licencji open source. Biblioteka ta oferuje wiele gotowych komponentów i innych przydatnych funkcji. Pozwala rozwiązywać często powtarzające się i uciążliwe problemy programistyczne w zaskakująco prosty sposób. Pierwsze próby programowania przy użyciu biblioteki React mogą jednak sprawiać trudności. Podobnie jak z innymi narzędziami dla profesjonalistów - aby docenić jej zalety, trzeba ją poznać.

Ta książka jest jedynym w swoim rodzaju praktycznym przewodnikiem po bibliotece React - przejrzystym i przystępnym. Zawiera wskazówki ułatwiające błyskawiczny start w tworzeniu efektownych i efektywnych aplikacji WWW. Nawet programista, który pierwszy raz ma do czynienia z tym narzędziem, będzie mógł w krótkim czasie napisać i uruchomić swoją aplikację. W książce zamieszczono setki przykładów omawiających krok po kroku zastosowanie poszczególnych funkcji, a złożone pojęcia wyjaśniono za pomocą trafnych ilustracji. W ten sposób można sobie znacznie uprościć tworzenie nawet bardzo skomplikowanych elementów interfejsu aplikacji!

W tej książce między innymi:

• tworzenie aplikacji za pomocą biblioteki React
• pisanie komponentów definiujących elementy interfejsu użytkownika
• zarządzanie stanami aplikacji i jej danymi
• cykl życia komponentów
• tworzenie wielostronicowych aplikacji

Oto React: znakomity efekt w krótkim czasie!

 

O autorze 11

 

Podziękowania 11

Rozdział 1. Wstęp do biblioteki React 13

• Stara szkoła - witryny wielostronowe 14
• Nowa szkoła - witryny jednostronowe 15
• Przedstawiamy React 18
  • Automatyczne zarządzanie stanem interfejsu użytkownika 18
  • Błyskawiczne modyfikowanie modelu DOM 19
  • Interfejsy API do tworzenia naprawdę rozbudowanych interfejsów użytkownika 20
  • Elementy interfejsu zdefiniowane całkowicie w języku JavaScript 21
  • Tylko V w architekturze MVC 22
• Podsumowanie 23

Rozdział 2. Twoja pierwsza aplikacja React 25

• Język JSX 26
• Pierwsze kroki z React 27
• Wyświetlenie imienia 28
• To wszystko jest dobrze znane 30
  • Zmiana miejsca docelowego 30
  • Trochę stylu! 31
• Podsumowanie 33

Rozdział 3. Komponenty biblioteki React 35

• Krótkie przypomnienie funkcji 36
• Zmiana obsługi interfejsu użytkownika 37
• Komponent React 39
  • Utworzenie komponentu "Witaj, świecie!" 40
  • Właściwości 43
  • Operacja 1.: zmiana definicji komponentu 43
  • Operacja 2.: zmiana wywołania komponentu 43
• Dzieci komponentu 44
• Podsumowanie 45

Rozdział 4. Style w bibliotece React 47

• Wyświetlenie kilku samogłosek 47
• Stylizowanie treści za pomocą reguł CSS 49
  • Struktura generowanego kodu HTML 49
  • Nadajmy styl wreszcie! 50
• Stylizowanie treści według React 51
  • Tworzenie obiektu stylizującego 52
  • Właściwa stylizacja treści 53
  • Dostosowywanie koloru tła 54
• Podsumowanie 54

Rozdział 5. Tworzenie złożonych komponentów 57

• Od elementów interfejsu do komponentów 57
  • Określenie głównych elementów wizualnych 58
  • Określenie potrzebnych komponentów 61
• Tworzenie komponentów 63
• Komponent Card 64
• Komponent Square 65
• Komponent Label 66
  • Znowu przekazywanie właściwości! 68
• Dlaczego możliwość łączenia komponentów jest super? 70
• Podsumowanie 71

Rozdział 6. Przekazywanie właściwości 73

• Opis problemu 73
• Szczegółowy opis problemu 75
• Poznaj operator rozciągania 79
• Lepszy sposób przekazywania właściwości 80
• Podsumowanie 82

Rozdział 7. Witamy ponownie JSX! 83

• Co się dzieje z kodem JSX? 83
• Atuty JSX, które trzeba znać 84
  • Wyrażenia 85
  • Zwracanie wielu elementów 85
  • Nie można definiować stylów CSS w kodzie 87
  • Komentarze 87
• Wielkości liter, elementy HTML i komponenty 88
• Kod JSX można stosować wszędzie 89
• Podsumowanie 89

Rozdział 8. Obsługa stanów w React 91

• Stosowanie stanów 91
  • Punkt wyjścia 91
• Włączenie licznika 93
  • Określanie początkowej wartości stanu 94
  • Uruchomienie czasomierza i ustawienie stanu 95
  • Wizualizacja zmiany stanu 97
• Opcja: pełny kod 97
• Podsumowanie 99

Rozdział 9. Od danych do interfejsu użytkownika 101

• Przykład 101
• Kod JSX można stosować wszędzie (część II) 103
• Tablice 104
• Podsumowanie 106

Rozdział 10. Zdarzenia w React 109

• Nasłuchiwanie i obsługiwanie zdarzeń 109
  • Punkt wyjścia 110
• Przygotowanie przycisku do reagowania na kliknięcie 112
• Właściwości zdarzenia 113
  • Poznaj zdarzenia syntetyczne 114
  • Korzystanie z właściwości zdarzeń 115
• Więcej o zawiłościach zdarzeń 116
  • Zdarzeń nie można nasłuchiwać bezpośrednio w komponentach 116
  • Nasłuchiwanie zwykłych zdarzeń modelu DOM 118
  • Obiekt this w procedurze obsługi zdarzenia 119
• React, ale dlaczego? 120
  • Kompatybilność ze starszymi przeglądarkami 120
  • Większa wydajność 120
• Podsumowanie 120

Rozdział 11. Cykl życia komponentu 123

• Poznaj metody cyklu życia 123
  • Metody cyklu życia w akcji 124
  • Faza pierwszego wyświetlenia 127
  • Faza aktualizacji 128
  • Faza odmontowania 131
• Podsumowanie 131

Rozdział 12. Dostęp do elementów DOM w bibliotece React 133

• Aplikacja Koloryzator 135
• Poznaj referencje 137
• Portale 140
• Podsumowanie 143

Rozdział 13. Konfiguracja środowiska React bez stresu 145

• Przedstawiamy projekt Create React 147
  • Opis utworzonego projektu 149
• Utworzenie aplikacji "Witaj, świecie!" 152
• Kompilacja wersji produkcyjnej 155
• Podsumowanie 155

Rozdział 14. Przetwarzanie zewnętrznych danych w aplikacji React 157

• Podstawy zapytań HTTP 159
• Czas na React! 160
  • Pierwsze kroki 161
  • Uzyskanie adresu IP 162
  • Upiększenie aplikacji 164
• Podsumowanie 167

Rozdział 15. Niebanalna lista zadań 169

• Pierwsze kroki 171
• Utworzenie początkowego interfejsu użytkownika 172
• Utworzenie pozostałej części aplikacji 173
  • Dodawanie zadań 173
  • Wyświetlanie zadań 176
  • Stylizacja aplikacji 179
  • Usuwanie zadań 180
  • Animacje! 182
• Podsumowanie 184

Rozdział 16. Tworzenie wysuwanego menu za pomocą biblioteki React 185

• Jak działa wysuwane menu? 185
• Przygotowanie wysuwanego menu 188
• Pierwsze kroki 190
• Wyświetlanie i ukrywanie menu 192
  • Utworzenie przycisku 193
  • Utworzenie menu 194
• Podsumowanie 196

Rozdział 17. Zapobieganie niepotrzebnemu wyświetlaniu komponentów 197

• Metoda render() 197
• Optymalizacja wywołań metody render() 199
  • Kontynuacja przykładu 199
  • Monitorowanie wywołań metod render() 200
  • Modyfikacja aktualizacji komponentu 203
  • Komponent PureComponent 204
• Podsumowanie 205

Rozdział 18. Tworzenie jednostronowej aplikacji za pomocą biblioteki React Router 207

• Przykład 208
• Pierwsze kroki 209
• Tworzenie jednostronowej aplikacji 210
  • Wyświetlenie początkowej ramki 210
  • Utworzenie widoków z treścią 211
  • Biblioteka React Router 213
• Kilka poprawek 215
  • Korekta procesu kierowania 215
  • Dodanie stylu 216
  • Wyróżnienie aktywnego odnośnika 217
• Podsumowanie 218

Rozdział 19. Wprowadzenie do biblioteki Redux 219

• Czym jest Redux? 220
• Prosta aplikacja wykorzystująca bibliotekę Redux 223
  • Czas na bibliotekę Redux 223
  • Światło, kamera, akcja! 224
  • Reduktor 225
  • Magazyn 227
• Podsumowanie 228

Rozdział 20. Stosowanie bibliotek React i Redux 229

• Biblioteki React i Redux oraz zarządzanie stanem aplikacji 234
  • Wspólne funkcjonalności bibliotek React i Redux 234
  • Przygotowanie 237
  • Utworzenie aplikacji 237

Skorowidz 243