Jakiś czas temu zrobiło się głośno na temat React Hooks. Co to jest i po co Ci to? Przez dłuższy czas celowo nie pisałem o tym na blogu, gdyż była to ledwie propozycja i to do tego mocno niestabilna. Teraz jednak sytuacja się zmieniła i wszystko wskazuje na to, że… Czytaj dalej… artykuł React Hooks — wprowadzenie i motywacja
Higher Order Reducers — co to takiego? Gdy popracujesz dłużej z Reduksem to na pewno zauważysz pewne powtarzalne wzorce. Napisanie akcji i reducerów do obsługi API to konieczność powtórzenia bardzo podobnego kodu kilka, kilkanaście razy! Czy na pewno jest to konieczne? Z pomocą przychodzą właśnie Higher Order Reducers i kompozycja. Czytaj dalej… artykuł Higher Order Reducers — Redux i powtarzanie kodu
Leniwe ładowanie komponentów w React dzięki import
Ten artykuł jest częścią 31 z 43 w serii React.js.
Czy w React da się ładować komponenty leniwie? A więc masz już sporą aplikację. Chcesz ją jakoś zoptymalizować. Do głowy przychodzi Ci, oczywiście, podział jej na kilka części, które będą ładowane na żądanie, dopiero gdy będą potrzebne — tzw. lazy load. Z pomocą przychodzi operator import(…) — po prostu! Czytaj dalej… artykuł Leniwe ładowanie komponentów w React dzięki import
Nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate
Ten artykuł jest częścią 30 z 43 w serii React.js.
Od wersji React 16.3 funkcje componentWillMount, componentWillReceiveProps i componentWillUpdate zostają oznaczone jako deprecated. Pojawiają się też dwie nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate. Co to dla nas oznacza? Do czego one służą? Jak ich używać? Czytaj dalej… artykuł Nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate
Bardzo często osoby poznające bibliotekę Redux próbują przenieść cały stan każdego komponentu do Reduksowego store'a. Czy to ma sens? Czy powinnaś całkowicie przestać używać setState? Czytaj dalej… artykuł Kiedy używać state, a kiedy Redux?
Do tej pory dane z API pobierałem po prostu w komponencie App, a po przyjściu odpowiedzi wysyłałem odpowiednią akcję (contactsFetched). To działało. Ale wymyśliłem sobie nową funkcję w aplikacji: Możliwość parametryzowania zapytań do API. Posłuży mi do tego nowy komponent. Jak teraz mam wykonywać zapytania do API? Przekazywać coś do… Czytaj dalej… artykuł Asynchroniczność w Redux: redux-thunk
Projektowanie komponentów: Presentational & Container Components
Ten artykuł jest częścią 27 z 43 w serii React.js.
Często w różnych artykułach poświęconych Reactowi i Reduksowi napotkasz takie sformułowania jak Presentational and Container Components albo Skinny and Fat Components albo Dumb and Smart Components i być może jeszcze kilka innych podobnych ;) Wszystkie te określenia oznaczają to samo: Podział komponentów na 2 rodzaje: Służące prezentacji oraz zawierające logikę. Czytaj dalej… artykuł Projektowanie komponentów: Presentational & Container Components
React + Redux — filtrowanie listy, proste selektory
Ten artykuł jest częścią 26 z 43 w serii React.js.
Jak dokładnie wygląda komunikacja pomiędzy komponentami przy użyciu Redux w React? W tym wpisie pokazuję jak zaimplementować filtrowanie listy przy użyciu Reduksa. Na dokładkę — poznasz pojęcie „selektor” i pewien ważny koncept w Reduksie. Do kodu! Czytaj dalej… artykuł React + Redux — filtrowanie listy, proste selektory
Jak tworzyć komponenty w React.js zgodnie z TDD dzięki react-testing-library? Jak zamockować axios? Jak napisać testy odporne na refactoring? To i kilka innych sztuczek w artykule poniżej :) Czytaj dalej… artykuł TDD w React.js z pomocą react-testing-library
Redux! Kurs Reacta dorobił się odcinka o Reduksie! Powoli wprowadzę Cię świat Reduksa, nauczysz się używać tej łatwej biblioteki, poznasz koncepty stojące za nią i napiszesz prostą aplikację. Czytaj dalej… artykuł React + Redux — kurs: wprowadzenie i podstawy