Czym są React Hooks?

Hooks to zdecydowanie najgorętsza funkcjonalność Reacta 16. Pierwsza fala hype’u opadła, i co rzadko zdarza się w ekosystemie JS, tym razem entuzjazm społeczności nie okazał się dziełem przypadku. Z tego artykułu dowiesz się czym są React Hooks, jakie korzyści płyną z ich stosowania i co musisz wiedzieć, aby proces ich nauki nie sprawił Ci żadnych problemów.

(więcej…)

Miś oglądający AlgoSmart na Youtube

Wzorce w React czyli jak wyruszyłem na podbój Youtube’a

Od moich pierwszych kroków w świecie Reacta minęło przeszło pół roku. W tym czasie zbudowałem kilka projektów, co pozwoliło mi oswoić się z podstawowym API komponentów. Byłem zadowolony z czynionych postępów, ale zaobserwowałem kilka niepokojących tendencji. Tworzenie wszechstronnych komponentów wymagało ode mnie zbyt dużo mało eleganckiej gimnastyki. Umożliwienie zmiany ułożenia komponentów-dzieci, decydowania o ich widoczności – to przykłady często napotykanych problemów, które doprowadzały do rozmnażania się propsów w niebezpiecznym tempie. Współdzielenie logiki również nie szło tak gładko, fragmenty niektórych komponentów były do siebie podejrzanie podobne. Zacząłem się zastanawiać: czy to normalna kolej rzeczy, czy może brakuje kilku sztuczek w moim programistycznym rękawie?

(więcej…)

Okulary położone na biurku przed monitorem

Jak pisać testy end-to-end aplikacji React z frameworkiem Cypress

Przyszedł czas na zdobycie wierzchołka testerskiej piramidy. Zabierzemy się za testy e2e (end-to-end). W teorii to najlepszy sposób na upewnienie się, że aplikacja działa jak należy. Możliwość dokładnego odtworzenia zachowań użytkownika w środowisku przeglądarki jest nadzwyczaj obiecująca. Niestety, praktyka szybko obnaża ukryte słabości tego podejścia do testowania. Testy e2e są czasochłonne i niezwykle wrażliwe na zmiany w aplikacji. Czy to oznacza, że lepiej byłoby dać sobie z nimi spokój? Bynajmniej. Możemy mieć z nich nie lada użytek, wystarczy zachować umiar przy tworzeniu przypadków testowych i wyposażyć się w dobre narzędzia. Właśnie o jednym z takich narzędzi będzie mowa w dzisiejszym wpisie. Zobaczymy, jak sprawdza się w akcji zyskujący popularność framework cypress.io.

(więcej…)

Piątka ludzi dająca sobie żółwika nad biurkiem z sprzętem elektronicznym

Jak pisać testy integracyjne komponentów React z Jest i Enzyme

Podczas testowania interfejsu użytkownika ograniczanie się sprawdzania odizolowanych od siebie komponentów nie zdaje egzaminu. Funkcjonalności dostarczane przez aplikację zawsze są wypadkową właściwej współpracy kilku jednostek w środowisku przeglądarki. Dopiero kiedy upewnisz się, że podsystemy są właściwie ze sobą zintegrowane, znacznie wzrośnie prawdopodobieństwo, że aplikacja spełni swoje zadanie w akcji. Dzisiaj przeprowadzę Cię przez podstawowy proces planowania i implementacji testów integracyjnych komponentów React w środowisku Jest i Enzyme.

(więcej…)

Jak pisać testy jednostkowe komponentów React z Jest i Enzyme

Jak to bywa z początkami, są trudne. Przypomniałem sobie o tym podczas pisania pierwszych testów jednostkowych w React. Dręczyło mnie wiele pytań: co powinienem testować? A co zostawić w spokoju? Czy moje testy zbytnio skupiają się na wewnętrznej mechanice komponentu? A może przez brak doświadczenia pomijam istotne elementy
interfejsu? Takie wątpliwości w połączeniu z rozbudowanym API Jest i Enzyme to idealna recepta na sparaliżowanie nawet najśmielszego adepta testowania. W tym artykule zaprezentuję metodę, która pozwoliła przełamać testerską blokadę i ruszyć z praktyką. (więcej…)

Lista materiałów, których potrzebujesz do skutecznej nauki Reacta

Stawiasz pierwsze kroki w ekosystemie Reacta? A może początki masz już za sobą, ale część zagadnień jest dla Ciebie problematyczna? Tak się składa, że w czasie wolnym od tworzenia kolejnych komponentów, udało mi się odszukać wiele wartościowych materiałów. Pozwolą Ci na skuteczną naukę, niezależnie od dotychczasowego poziomu umiejętności.

(więcej…)