Redux-Thunk
minuta czytania
Redux-Thunk to biblioteka, która pozwala na wykonywanie operacji asynchronicznych w aplikacji opartej na Redux. Jest to jedno z najpopularniejszych rozszerzeń Redux, które pozwala na proste i czytelne zarządzanie stanem aplikacji.
Ostatnie oferty pracy
Redux-Thunk jest dodatkiem do biblioteki Redux. Hostowany jako oddzielna paczka w NPM, jest możliwy do pobrania i ustawienia jako middleware przy inicjalizacji Redux bez skomplikowanej konfiguracji. Pozwala uzyskać asynchroniczność zapytań. Middleware'y w redux pozwalają przechwycić zapytanie i zamiast wykonać pojedynczą zmianę na storze może wykonać serię zapytań, w międzyczasie mogą odpytać API po zewnętrzne dane. Całość jest możliwa, do uzyskania bez Redux-Thunk, ale ten znacznie to ułatwia.
Przykładowe zapytanie w Redux-Thunk
Najprostszym przykładem wykorzystania Redux-Thunk będzie zapytanie do API w celu zalogowania użytkownika. Aby zapytanie przebiegło poprawnie musi wydarzyć się parę rzeczy.
1. Ustawienie stanu aplikacji, że logowanie się rozpoczęło.
2. Wysłanie zapytania do API
3. Ustawienie danych użytkownika w store
4. Ewentualne zwrócenie błędu
export const authLogin = (email, password) => {
return dispatch => {
dispatch(authStart());
axios
.post(`${API_URL}/auth/api/v1/login/`, {
email: email,
password: password
})
.then(res => {
const token = res.data.token;
const user = res.data.user;
dispatch(authSuccess(token, user));
})
.catch(err => {
dispatch(authFail(err));
});
};
};
Dzięki takiemu podejściu możemy wyizolować część logiki naszej aplikacji do pojedynczej funkcji. Możemy wykorzystać mockowanie danych z API i w pełni przetestować działanie takiego Thunka.
Alternatywy do Redux-thunk
Alternatywą do Redux-thunk jest Context API, które jest wbudowane bezpośrednio w bibliotekę React. Zapytania asynchroniczne możemy z łatwością tam utworzyć. Praktyczną różnicę zobaczymy dopiero, gdy Context API będzie obsługiwać spory obiekt, w którym będziemy często aktualizować parametry. Może się okazać, że Context API jest wtedy mniej wydajny i zbyt często uruchamia aktualizacje DOM.
Mimo, że Redux jest oddzielną biblioteką to posiada bogatą dokumentację z dobrze opisanymi przykładami. Przykładów dla Redux-Thunk też jest dużo i jest zdecydowanie produkcyjnym rozwiązaniem do utrzymywania stanu aplikacji.
Nasza oferta
Web development
Dowiedz się więcejMobile development
Dowiedz się więcejE-commerce
Dowiedz się więcejProjektowanie UX/UI
Dowiedz się więcejOutsourcing
Dowiedz się więcejPowiązane artykuły
Czym są Azure Functions i jakie są ich główne zalety?
7 cze 2024
Azure Functions to usługa serverless od Microsoftu, która umożliwia tworzenie i uruchamianie małych fragmentów kodu w chmurze bez potrzeby zarządzania infrastrukturą serwerową. Dzięki swojej elastyczności i skalowalności, Azure Functions pozwalają programistom szybko reagować na zdarzenia, automatyzować procesy i integrować różne usługi. W tym artykule przyjrzymy się, czym dokładnie są Azure Functions oraz jakie są ich główne zalety dla programistów i przedsiębiorstw.
Zastosowanie Cyklu Deminga w zarządzaniu jakością
7 cze 2024
Cykl Deminga, znany również jako PDCA (Plan-Do-Check-Act), to fundamentalne narzędzie w zarządzaniu jakością, które pomaga organizacjom w ciągłym doskonaleniu swoich procesów. Wprowadzony przez W. Edwards Deminga, cykl ten stał się kluczowym elementem strategii zarządzania jakością w różnych branżach na całym świecie. W tym artykule omówimy, jak skutecznie zastosować Cykl Deminga w praktyce, aby osiągnąć lepsze wyniki i stałe ulepszanie procesów biznesowych.
Strategie pull i push w marketingu: Podstawowe definicje i różnice między nimi.
6 cze 2024
W dzisiejszym zróżnicowanym świecie marketingu, strategie pull i push odgrywają kluczowe role w kształtowaniu relacji między markami a ich klientami. Chociaż obie strategie mają ten sam cel — zwiększenie sprzedaży i widoczności — różnią się znacznie metodami osiągania tych wyników. Ten artykuł wyjaśni podstawowe definicje i różnice między strategiami pull i push, aby pomóc marketerom wybrać najlepsze podejście dla swoich unikalnych celów biznesowych.
Macierz Eisenhowera w pracy zespołowej: Jak poprawić efektywność zespołu?
6 cze 2024
W dzisiejszym szybkim świecie zarządzanie czasem i priorytetami staje się kluczowe dla efektywności każdego zespołu. Macierz Eisenhowera, narzędzie do klasyfikacji zadań według ich pilności i ważności, oferuje prostą, ale potężną metodę do optymalizacji pracy grupowej. W tym artykule przyjrzymy się, jak zastosowanie tej metody może pomóc zespołom w różnych branżach zwiększyć ich produktywność i skuteczność.
Inline CSS: Co to jest i jak różni się od stylów zewnętrznych i wbudowanych?
6 cze 2024
Inline CSS to metoda stosowania stylów bezpośrednio w tagach HTML, co różni się od zewnętrznych i wbudowanych arkuszy stylów. W tym artykule przyjrzymy się, jak inline CSS funkcjonuje, jakie ma zalety i ograniczenia, oraz kiedy jest najbardziej odpowiedni w stosunku do innych metod stylizacji.
Podstawy D-Tale: Wprowadzenie do eksploracji danych
5 cze 2024
D-Tale to narzędzie do eksploracji danych, które umożliwia użytkownikom łatwe i intuicyjne przeglądanie oraz analizowanie dużych zbiorów danych. Dzięki bogatemu interfejsowi graficznemu i integracji z Pythonem oraz Pandas, D-Tale staje się niezastąpionym narzędziem dla analityków danych i programistów. W tym artykule przedstawimy podstawowe funkcje D-Tale, pokażemy, jak zacząć pracę z tym narzędziem oraz omówimy jego kluczowe zastosowania w codziennej pracy analitycznej.
Multimodal Interaction: Co to jest i jakie są jej podstawowe założenia?
5 cze 2024
Multimodal Interaction to zaawansowane podejście do interakcji między użytkownikami a systemami komputerowymi, które wykorzystuje różnorodne formy komunikacji, takie jak głos, gesty, dotyk i wzrok. Celem tego podejścia jest stworzenie bardziej naturalnych i intuicyjnych interakcji, które naśladują sposób, w jaki ludzie komunikują się ze sobą. W niniejszym artykule przyjrzymy się, czym dokładnie jest multimodalna interakcja, jakie są jej podstawowe założenia oraz jakie korzyści i wyzwania z nią związane.
Zobacz wszystkie artykuły