Zarządzanie efektami ubocznymi – useEffect
Łukasz Kukawski W kontekście aplikacji React, efektem ubocznym (side effect) jest każda operacja, która wpływa na coś poza zwracanym przez komponent wynikiem — np. operacje na DOM, zapytania do API, ustawianie timera…
Kurs React
Portale
W React, umiejscowienie komponentu w strukturze DOM zazwyczaj zależy od miejsca jego wywołania w kodzie. Z reguły komponent jest umieszczany dokładnie tam, gdzie go zdefiniowaliśmy. Jednak czasami pojawia się potrzeba,…
Użycie useRef i praca z referencjami
Praca z elementami DOM w React W tradycyjnym JavaScript, aby uzyskać dostęp do elementów modelu DOM, często sięga się po metodę getElementById, tak jak w poniższym przykładzie: Jednak w React,…
Wyświetlanie list
W React listy danych są zazwyczaj renderowane za pomocą metody .map() JavaScript. Metoda ta pozwala na iterowanie przez każdy element listy i zwrócenie komponentu lub elementu JSX dla każdego z…
Obsługa zdarzeń
W React, obsługa zdarzeń jest realizowana przez specjalne właściwości, znane jako propsy, takie jak onClick dla zdarzeń kliknięcia. Te właściwości są przypisywane do komponentów i przyjmują funkcję, która zostanie wywołana…
Warunkowe wyświetlanie treści
Warunkowe renderowanie w React pozwala na decydowanie, które elementy interfejsu mają być wyświetlane w zależności od określonych warunków. Podobnie jak w JavaScript, możemy użyć instrukcji warunkowych, takich jak if czy…
Zarządzanie stanem i wprowadzenie do React hooks
Aby aplikacja mogła dynamicznie reagować na interakcje użytkownika, musi aktualizować swój widok w oparciu o dane, które mogą się zmieniać w czasie. React realizuje to za pomocą mechanizmu znanego jako…
Props
Komponenty w React byłyby znacznie mniej funkcjonalne, gdybyśmy nie mogli przekazywać do nich zmiennych. Props działają podobnie do atrybutów tagów HTML i umożliwiają komponentom otrzymywanie danych z zewnątrz. React automatycznie…
Pierwsze kroki z React: środowisko i konfiguracja
Rozpoczęcie pracy z Reactem jest stosunkowo proste dzięki narzędziu create-react-app, które automatyzuje konfigurację środowiska. Zobaczymy jak zarządzać wersjami Node.js za pomocą nvm, szczególnie pracując nad wieloma projektami.
JSX: składnia i zasady
JSX, czyli JavaScript XML, to wydajne rozszerzenie JavaScript, które umożliwia tworzenie interfejsów użytkownika z użyciem składni podobnej do HTML, ale bezpośrednio w plikach JavaScript. Dzięki temu możemy korzystać ze wszystkich…