Masz już konto? Zaloguj się

Kurs React

Poznaj sekrety pracy z React i naucz się zaawansowanych technik budowy stron w oparciu o tą technologię!

44 lekcji

6h 6min

5 (9 oceny)

React - Techniki Zaawansowane

Higher Order Components, Render Props, Compound Components... React pełen jest wzorców i narzędzi, których nazwy potrafią przyprawić o ból głowy. Właśnie po to, by uniknąć tego przytłoczenia, został przygotowany ten kurs. Skupimy się w nim praktycznie wyłącznie na React'cie, który mimo że jest niepozorną biblioteką, to kryje w sobie ogromny potencjał i jeszcze większą swobodę działania dla developera. W dużych, komercyjnych aplikacjach wzorce, o których wspominamy, pojawiają się niesłychanie często, a ich poprawne zrozumienie to jedyna droga do tego, abyśmy nie czuli się nieswojo patrząc na nieco bardziej skomplikowany kod.

Higher Order Components

Jeden z pierwszych i najbardziej popularnych wzorców w React, który przez lata był traktowany jako najlepszy sposób na wydzielanie logiki z komponentów i współdzielenie jej w wielu miejscach aplikacji. W kursie na przykładzie dowiesz się w jaki sposób można wykorzystać HOC, a także jak łączyć je ze sobą tworząc bardziej zaawansowane struktury.

Render Props

Obecnie Render Props jest jedną z najczęściej wykorzystywanych praktyk pozwalającą, podobnie jak HOC, na tworzenie abstrakcji, z których możemy czerpać dane lub zachowania potrzebne w naszych komponentach. Na pierwszy rzut oka Render Props mogą przerażać, ale spokojnie – zaczniemy od prostego przykładu, który pozwoli Ci zrozumieć, że nie ma się czego bać.

Hooks

Hooks to temat niezwykle ciekawy i populary, ale rzadko poruszany w sposób bardziej zaawansowany. W tym kursie dowiesz się nie tylko jak używać takich hooków jak useState, useReducer, useEffect, useContext czy useRef, ale też jak napisać swoje własne hooki, które niesamowicie uprzyjemnią pracę z Reactem.

Compound Components

Compound Components to prawdziwa "ciężka artyleria" Reacta – stosowana w zadaniach wymagających sporej złożoności. Ewoluowała przez lata i kiedyś zawsze spotykana była w formie klas, natomiast w tym kursie proponujemy nieco lżejsze podejście. Dowiesz się jak wykorzystując hooki możesz stworzyć Compound Component wyłącznie przy użyciu komponentów funkcyjnych.

Testowanie aplikacji reactowych

Testy to hasło, które potrafi wzbudzić lęk u osób uczących się Reacta, lub jakiejkolwiek innej technologii. Rzadko kto jednak mówi to głośno – testy są przyjemne! Wystarczy tylko zrozumieć w jaki sposób środowisko testowe działa i jakimi rządzi się zasadami. Przerobimy to wszystko wspólnie, a na koniec kursu przekonasz się, że to faktycznie ciekawe i przyjemne zagadnienie.

Dobre praktyki

W kursie przygotowana jest też garść dobrych praktyk, które pozwolą Ci spojrzeć krytycznie na niektóre fragmenty kodu i ulepszać je w taki sposób, aby stanowiąc część większej całości miały więcej sensu i wdzięku. Dowiesz się czym jest Single Responsibility Principle, jak wydzielać odpowiednio logikę z komponentów i paru innych ciekawych wskazówek.

Dla kogo jest ten kurs?

Ten kurs został stworzony z myślą o programistach swobodnie poruszających się po podstawach i nieco bardziej skomplikowanych partiach Reacta, ale nadal czujących, że brakuje im czegoś, aby wynieść swoje aplikacje na jeszcze wyższy poziom. Rzeczy związane z zaawansowanym JavaScriptem będziemy tu wykorzystywać intuicyjnie, bez zbędnego tłumaczenia, dlatego zanim przystąpisz do tego kursu, upewnij się, że treści React od Podstaw oraz React w Praktyce są dla Ciebie jasne i zrozumiałe.

Czego się nauczysz?

  • Higher Order Components

  • Render Props

  • Zaawansowane hooki reactowe

  • Tworzenie własnych hooków

  • Compound Components

  • Testy jednostkowe

  • Testy integracyjne

  • Testowanie zapytań asynchronicznych

  • Dobre praktyki tworzenia aplikacji

  • Bulma

Zawartość

React

6 rozdziały 44 lekcji 6h 6min

  • Wstęp do kursu

    30min

    Wprowadzenie

    Podgląd lekcji

    2min

    Słowem wstępu

    10min

    Konfiguracja środowiska pracy

    8min

    Jak działa Bulma

    10min

  • Zaawansowane wzorce projektowe

    2h 41min

    Czym są Higher Order Components

    4min

    HOC - przygotowanie komponentu

    8min

    HOC - komponent bliźniaczy

    5min

    Stworzenie pierwszego HOC

    11min

    Zagnieżdżanie HOC

    9min

    Komponowanie HOC

    5min

    Czym są render props

    6min

    Render props w praktyce

    12min

    Zagnieżdżanie render props

    Podgląd lekcji

    6min

    Render props i Downshift

    7min

    Render props i Downshift cz 2

    10min

    React hooks - useState

    9min

    React hooks - useState cz 2

    14min

    React hooks - useReducer

    11min

    React hooks - useEffect

    9min

    React hooks - useRef

    8min

    useRef i GSAP

    7min

    React hooks - tworzenie własnych hooków

    8min

    React hooks - tworzenie własnych hooków cz 2

    11min

  • Compount Components czyli komponenty złożone

    46min

    Czym są Compound Components

    8min

    Tworzenie multi-step form

    10min

    Dodawanie contextu dla Compound Component

    9min

    Współdzielenie stanu

    12min

    Dodawanie nowych komponentów

    7min

  • Testowanie aplikacji reactowych

    1h 51min

    Konfiguracja środowiska testowego

    9min

    Jest - przypomnienie

    10min

    Czym jest react-testing-library

    Podgląd lekcji

    16min

    Testowanie propsów

    6min

    Testowanie wartości pól

    8min

    Testowanie eventu onChange

    8min

    Walidacja pola

    12min

    Refactor testów

    6min

    Problemy z routerem

    9min

    Testowanie contextu

    8min

    Testowanie zapytań asynchronicznych

    8min

    Testowanie zapytań asynchronicznych cz 2

    12min

  • Dobre praktyki

    14min

    Modularyzacja kodu, wydzielanie logiki

    6min

    Single Responsibility Principle i obsługa błędów

    7min

  • Podsumowanie

    4min

    Podsumowanie kursu

    4min

    Zakończenie

Autor kursu

Adam Romanski

Frontend developer & YouTube Creator

Średnia ocen autora: 5

Bio
Cześć! Nazywam się Adam Romański i sam siebie nazywam kreatywnym front-endowcem, ponieważ zanim dołączyłem do branży IT, wiele lat spędziłem pracując jako copywriter. Na co dzień pracuję w jednym z największych software house'ów w Polsce, realizując ambitne projekty dla zagranicznych klientów. Dzięki tej pracy zdobyłem sporo doświadczenia, którym chętnie się z Tobą dzielę. W moim przypadku pasja do uczenia innych przejawia się także w inny sposób. „Po godzinach” zajmuję się vlogiem Hello Roman na YouTube, który w kilka miesięcy zdobył prawdziwą rzeszę fanów. Możesz go odwiedzić klikając w ten link: https://youtube.com/helloroman Do tej pory zrealizowałem wiele projektów zarówno w React, Vue, Gatsby jak i innych technologiach, co pozwoliło mi nabrać pewności siebie a także poszerzyć nieco moje perspektywy. Liczę, że moje kursy dadzą Ci to samo! To dla mnie ogromne wyróżnienie, lecz także ogromna odpowiedzialność. Za pośrednictwem vloga opowiadam o moich przemyśleniach dotyczących programowania, branży IT, a także tworzę materiały z praktycznymi, technicznymi poradami. Do tej pory zrealizowałem wiele projektów zarówno w React, Vue, Gatsby jak i innych technologiach, co pozwoliło mi nabrać pewności siebie a także poszerzyć nieco moje perspektywy. Liczę, że moje kursy dadzą Ci to samo!
Inne kursy tego autora
Gatsby.js React React React

Dołącz do ponad 10 tys. zadowolonych z naszych kursów

Ciekawy Kurs

Patryk Korszun

22 lutego 2021

Grzegorz Nęcka

21 marca 2021

Paweł Mazurek

3 czerwca 2021

Mateusz

5 czerwca 2021

Marcin Piwko

4 lipca 2021

Mateusz Kozłowski

25 października 2021

Fajnie przedstawione na prostych i zrozumiałych przykładach.

Grzegorz Martowski

23 listopada 2021

Polecam

Magdalena Antoniak

29 sierpnia 2022

Małgorzata Zub

6 września 2023

Kurs React

  • 44 lekcji wideo

  • 6h 6min materiału

  • Ostatnia rewizja 25.05.2020

  • Certyfikat w ramach ścieżek

  • Dostęp z urządzeń mobilnych

Dlaczego wybrać właśnie ten kurs?

Efektywna nauka

Kurs wideo to najbardziej efektywna a zarazem najprzyjemniejsza forma nauki. Jest on tak prowadzony, byś cały czas mógł go śledzić z zainteresowaniem i zaangażowaniem, a także czerpać satysfakcję ze zdobytej wiedzy!

Wiedza ekspertów

Wiedza, którą otrzymujesz w tym kursie, to nie tylko sucha teoria, ale również wskazówki od praktyka z wieloletnim doświadczeniem, dzięki którym dużo łatwiej będzie Ci opanować materiał i pracować efektywniej.

Praktyczne przykłady

Uczysz się na praktycznych przykładach. Kurs, który masz przed sobą to esencja praktycznej wiedzy i doświadczenia a także wzorów, które oszczędzą Ci godziny pracy i poszukiwań.

Pytania i odpowiedzi

Przeczytaj najczęściej zadawane pytania

Masz więcej pytań?

Porozmawiaj z nami na na czacie

Wyślij nam e-mail

Zadzwoń +48 880880606

Czy każdy kurs ma pliki źródłowe?

Nie każdy. Jeśli pliki są dostępne dla danego kursu, znajdziesz je w zakładce źródła. Niektóre kursy nie posiadają źródeł ponieważ nie są potrzebne, inne nie mogły być zamieszczone np. ze względu na prawa autorskie do wykorzystania komercyjnych prac naszych autorów. Staramy się aby kursy były maksymalnie praktyczne i chętnie pokazujemy zaplecze zawodowe naszych autorów, ale niekiedy nie możemy dołączyć go w postaci źródeł.

Jak jest skonstruowany kurs?

Kurs składa się z rozdziałów oraz lekcji. Staramy się, aby optymalnie kursy miały 5-7 rozdziałów po około 5-10 lekcji w każdym. W ten sposób nauka jest optymalna a podtrzymanie uwagi staje się łatwiejsze. Rekomendujemy przerabianie nie więcej niż jednego rozdziału naraz a po jego przerobieniu powtórzenie materiału we własnym zakresie.

Jak najlepiej wykorzystać kurs?

Potraktuj kurs jako inspirację do własnej pracy. Tam, gdzie się da staraj się powtarzać czynności, które wykonuje autor. Nie powtarzaj ich jednak bezmyślnie - spróbuj zmodyfikować przykłady i dostosować je do swoich potrzeb. W ten sposób przyswoisz materiał jeszcze lepiej!

Jak mogę uzyskać dostęp do kursu?

Możesz albo wykupić ten konkretny kurs przez koszyk, uzyskując do niego (i jego rewizji) bezterminowy dostęp, albo wykupić wariant abonamentu, który obejmuje dany kurs i w ten sposób oglądać go oraz inne materiały na platformie tak długo, jak Twój abonament jest aktywny.

Czy kurs jest aktualny?

Staramy się aby wszystkie materiały na stronie były aktualne. Nie znaczy to, że kurs powstał bardzo niedawno. Często na stronie znajdziesz trochę starsze kursy, jednak regularnie wykonujemy ich rewizję i zmieniamy lekcje - czy to przez dodanie stosownych komentarzy z aktualizacją, czy poprzez nagranie danej lekcji jeszcze raz. Datę ostatniej rewizji znajdziesz w informacjach o kursie.

Czym się różni kurs od warsztatu i ścieżki?

Kursy to kilku godzinne, kompleksowe opracowanie danego zagadnienia, podzielone na lekcje i rozdziały. Często uzupełniają je Warsztaty, które mają formę jednej dłuższej, praktycznej lekcji (30min-1h), natomiast ścieżki stanowią zbiór jednych i drugich materiałów - ułożoną z kursów i warsztatów playlistę, która pozwala Ci kompleksowo opanować dane zagadnienie.

We frontendzie nie można stać w miejscu, niezależnie od tego, czy jest się początkującym, czy zaawansowanym. Narzędzia i techniki się zmieniają, więc trzeba cały czas trzymać rękę na pulsie. Jako twórca kursów i programista mogę spokojnie polecić eduweb.pl jako aktualne i dobre źródło wiedzy.

Adam Romański

helloroman.com

Zacznij naukę w React

  • 44 lekcji wideo

  • 6h 6min materiału

  • Ostatnia rewizja 25.05.2020

  • Certyfikat w ramach ścieżek

  • Dostęp z urządzeń mobilnych