JavaScript jest obecnie peÅ‚nowartoÅ›ciowym jÄ™zykiem programowania - wszechstronnym, elastycznym i pozwalajÄ…cym na tworzenie wydajnego kodu. SpoÅ‚eczność skupiona wokóÅ‚ JavaScriptu udostÄ™pniÅ‚a wiele przydatnych frameworków i bibliotek. WÅ›ród nich wyjÄ…tkowo ciekawÄ… propozycjÄ… jest React - popularna biblioteka przeznaczona do tworzenia nowoczesnych, dynamicznych aplikacji. To narzÄ™dzie, które w stosunkowo prosty sposób pozwala na peÅ‚ne wykorzystanie możliwoÅ›ci nowoczesnych przeglÄ…darek i urzÄ…dzeÅ„ mobilnych - wystarczy wiedzieć, jak technologie JavaScript, CSS i HTML dziaÅ‚ajÄ… w przeglÄ…darce WWW.

W tej przystÄ™pnej, zajmujÄ…co napisanej książce znajdziesz nie tylko dokÅ‚adne omówienie biblioteki React, ale też podstawowe koncepcje JavaScriptu, testowania i debugowania oraz zarzÄ…dzania informacjami o stanie. Przedstawiono tu aktualne i wnikliwe informacje o najlepszych praktykach i wzorcach stosowanych podczas tworzenia nowoczesnego kodu Reacta. Pokazano, jak budować interfejs użytkownika pozwalajÄ…cy na zmianÄ™ treÅ›ci strony bez jej odÅ›wieżania. Zaprezentowano również podstawy programowania funkcyjnego z użyciem najnowszych funkcji oferowanych przez ECMAScript. DziÄ™ki temu przewodnikowi dowiesz siÄ™, jak tworzyć komponenty Reacta, korzystać z routera Reacta, a także generować i testować serwery. Poszczególne informacje zostaÅ‚y uporzÄ…dkowane i podane w sposób uÅ‚atwiajÄ…cy natychmiastowe rozpoczÄ™cie pracy z tÄ… Å›wietnÄ… bibliotekÄ….

W książce między innymi:

• kluczowe koncepcje programowania funkcyjnego w JavaScripcie
• dziaÅ‚anie Reacta w przeglÄ…darce WWW
• tworzenie warstwy prezentacji aplikacji
• debugowanie aplikacji Reacta
• zaczepy Reacta i korzystanie z routingu
• aplikacja Reacta klient-serwer

React: śmiało sięgaj po efektywność i nowoczesność!

Osoby które kupowały "React od podstaw. Nowoczesne wzorce tworzenia aplikacji. Wydanie II", wybierały także:

• D3.js w akcji 67,42 zÅ‚, (20,90 zÅ‚ -69%)
• Tablice informatyczne. Node.js 16,86 zÅ‚, (5,90 zÅ‚ -65%)
• React i GatsbyJS. Kurs video. Nowoczesne strony internetowe w oparciu o headless CMS i GraphQL 148,98 zÅ‚, (59,59 zÅ‚ -60%)
• TypeScript i React. Kurs video. Tworzenie nowoczesnych komponent 129,00 zÅ‚, (51,60 zÅ‚ -60%)
• Vue.js w praktyce. Kurs video. Poznaj narz 148,98 zÅ‚, (59,59 zÅ‚ -60%)

Spis treści

React od podstaw. Nowoczesne wzorce tworzenia aplikacji. Wydanie II -- spis treści

Wprowadzenie 9

1. Poznajemy Reacta 13

• Solidne podstawy 14
• PrzeszÅ‚ość i przyszÅ‚ość biblioteki React 14
  
  • Zmiany w wydaniu drugim książki 15
• Praca z plikami 16
  
  • Repozytorium pliku 16
  • React Developer Tools 16
  • Instalacja Node.js 17

2. JavaScript dla Reacta 19

• Deklarowanie zmiennych 20
  
  • SÅ‚owo kluczowe const 20
  • SÅ‚owo kluczowe let 21
  • Szablon ciÄ…gu tekstowego 22
• Tworzenie funkcji 24
  
  • Deklaracje funkcji 24
  • Wyrażenie funkcji 24
  • Parametry domyÅ›lne 26
  • Funkcja strzaÅ‚ki 26
• Kompilacja kodu napisanego w JavaScripcie 29
• Obiekty i tablice 30
  
  • Destrukturyzacja obiektu 30
  • Destrukturyzacja tablicy 32
  • Usprawnienie literaÅ‚u obiektu 32
  • Operator rozszczepienia 33
• Asynchroniczny JavaScript 35
  
  • Proste obietnice za pomocÄ… fetch 35
  • SÅ‚owa kluczowe async i await 37
  • Tworzenie obietnicy 37
• Klasy 38
• ModuÅ‚y ES6 40
  
  • CommonJS 41

3. Programowanie funkcyjne w JavaScripcie 43

• Co to jest programowanie funkcyjne? 44
• Styl imperatywny kontra styl deklaratywny 45
• Koncepcje funkcyjne 48
  
  • Niemodyfikowalność 48
  • Czyste funkcje 50
  • Konwersja danych 52
  • Funkcje wyższego rzÄ™du 58
  • Rekurencja 59
  • Kompozycja 61
  • Zebranie wszystkiego w caÅ‚ość 63

4. Jak działa React? 69

• Konfiguracja strony 69
• Elementy Reacta 70
• ReactDOM 72
  
  • Elementy potomne 73
• Komponenty Reacta 77
  
  • Komponenty Reacta - podróż po historii 80

5. React i JSX 83

• Elementy Reacta jako JSX 83
  
  • Wskazówki pomocne w pracy z JSX 84
  • Mapowanie tablicy za pomocÄ… JSX 85
• Babel 85
• Przepisy kulinarne w postaci kodu JSX 87
• Fragmenty Reacta 93
• Wprowadzenie do narzÄ™dzia webpack 94
  
  • Tworzenie projektu 96
  • Wczytywanie paczki 104
  • Mapowanie źródÅ‚a 105
  • NarzÄ™dzie create-react-app 105

6. ZarzÄ…dzanie informacjami o stanie Reacta 109

• Utworzenie komponentu StarRating 109
• Zaczep useState 111
• Refaktoryzacja dla zapewnienia zaawansowanych możliwoÅ›ci wielokrotnego użycia 115
• Informacje o stanie w drzewie komponentów 117
  
  • Przekazywanie informacji o stanie w dóÅ‚ drzewa komponentów 118
  • Przekazywanie interakcji z powrotem w drzewie komponentów 120
• Tworzenie formularzy 124
  
  • Użycie ref 124
  • Komponent kontrolowany 126
  • Tworzenie zaczepu niestandardowego 127
  • Dodawanie danych kolorów do informacji o stanie 129
• Kontekst Reacta 130
  
  • Umieszczenie danych kolorów w kontekÅ›cie 132
  • Pobieranie kolorów za pomocÄ… useContext 133
  • Dostawca kontekstu zawierajÄ…cego informacje o stanie 134
  • Zaczepy niestandardowe w kontekÅ›cie 136

7. Usprawnianie komponentów za pomocÄ… zaczepów 139

• Wprowadzenie zaczepu useEffect 139
  
  • Tablica zależnoÅ›ci 142
  • GÅ‚Ä™bokie sprawdzanie zależnoÅ›ci 146
  • Kiedy należy używać useLayoutEffect? 151
  • ReguÅ‚y, które należy stosować podczas pracy z zaczepami 153
  • Usprawnienie kodu za pomocÄ… useReducer 155
  • Zaczep useReducer stosowany do obsÅ‚ugi skomplikowanych informacji o stanie 157
  • Usprawnienie wydajnoÅ›ci dziaÅ‚ania komponentu 160
  • shouldComponentUpdate i PureComponent 162
  • Kiedy przeprowadzać refaktoryzacjÄ™? 163

8. Wykorzystywanie danych 165

• Żądanie danych 165
  
  • WysyÅ‚anie danych w żądaniu 167
  • Przekazywanie plików za pomocÄ… metody fetch() 167
  • Autoryzacja żądania 168
  • Zapisywanie danych lokalnie 169
  • ObsÅ‚uga informacji o stanie obietnic 172
• Generowane wÅ‚aÅ›ciwoÅ›ci 174
• Listy wirtualizowane 177
  
  • Tworzenie zaczepu useFetch 181
  • Tworzenie komponentu Fetch 183
  • ObsÅ‚uga wielu żądaÅ„ 185
  • Zachowywanie wartoÅ›ci 186
  • Żądania typu kaskadowego 190
  • Ograniczanie szybkoÅ›ci dziaÅ‚ania sieci 193
  • RównoczeÅ›nie wykonywane żądania 194
  • Oczekiwanie na wartoÅ›ci 196
  • Anulowanie żądania 197
• Wprowadzenie do GraphQL 200
  
  • API GraphQL serwisu GitHub 200
  • Wykonanie żądania GraphQL 202

9. Technologia Suspense 209

• Granice bÅ‚Ä™du 211
• PodziaÅ‚ kodu 214
  
  • Wprowadzenie - komponent Suspense 216
  • Użycie komponentu Suspense z danymi 217
  • ZgÅ‚aszanie obietnicy 220
  • Tworzenie źródÅ‚a danych typu Suspenseful 224
  • Algorytm Fiber 228

10. Testowanie kodu tworzonego z użyciem Reacta 231

• ESLint 231
  
  • Wtyczki ESLinta 234
• Prettier 236
  
  • Konfiguracja Prettiera w projekcie 237
  • Prettier w VSCode 238
• Sprawdzanie typów w aplikacji pisanej z użyciem Reacta 239
  
  • PropTypes 239
  • Flow 242
  • TypeScript 245
• Programowanie sterowane testami 248
  
  • TDD i nauka 249
• Wykorzystanie frameworka Jest 249
  
  • Create React App i testy 249
• Testowanie komponentów Reacta 253
  
  • Zapytania 256
  • Testowanie zdarzeÅ„ 257
  • Stosowanie pokrycia kodem 259

11. Router Reacta 261

• DoÅ‚Ä…czanie routera 262
• WÅ‚aÅ›ciwoÅ›ci routera 265
  
  • Trasy zagnieżdżone 267
• Użycie przekierowania 269
  
  • Parametry routingu 271

12. React i serwer 275

• Izomorficzny kontra uniwersalny 275
  
  • Domeny serwera i klienta 276
• Serwer generujÄ…cy kod Reacta 278
• Generowanie danych za pomocÄ… Next.js 284
• Gatsby 288
• PrzyszÅ‚ość Reacta 290