Szkolenie React
Poziom
PodstawowyCzas
32h / 4 dniTermin
IndywidualnieCena
IndywidualnieSzkolenie z React
React to najpopularniejsza biblioteka JavaScript pozwalająca na tworzenie aplikacji dla przeglądarek, urządzeń mobilnych a także aplikacji desktopowych. Dzięki nieskomplikowanemu API React jest biblioteką z grupy „łatwe do nauczenia, ale trudne do opanowania”. Podejście, w którym każdy element aplikacji jest komponentem pozwala na łatwe reużywanie kodu, rozwój aplikacji niezależnie przez wielu programistów oraz stopniową modernizację. Podczas szkolenia uczestnicy poznają pełny proces tworzenia nowoczesnej aplikacji React — od konfiguracji środowiska (Vite), przez budowę komponentów i zarządzanie stanem, aż po architekturę aplikacji, TypeScript, globalny state management oraz testowanie.
Dla kogo jest szkolenie z React?
Dla programistów tworzących strony internetowe, którzy chcą nauczyć się wykorzystywać React i nowoczesne wzorce JavaScript do tworzenia interaktywnych aplikacji internetowych.
Dla osób, które chcą obrać nową ścieżkę kariery, lub znają już inne popularne biblioteki i chcą zwiększyć swoją szansę na rynku pracy.
Dla programistów, którzy uczyli się React na własną rękę, ale potrzebują uporządkowania wiedzy.
Czego nauczysz się na szkoleniu?
- tworzyć interaktywne aplikacje wykorzystujące React
- skutecznie komunikować się z backendem w celu pobrania i przesłania danych
- połączyć React z popularnymi bibliotekami do routingu, zarządzania stylami
- pisać testowalne i łatwe do utrzymania aplikacje
- używać TypeScript w aplikacjach React
- zarządzać stanem globalnym z wykorzystaniem Redux
- testować aplikacje (Jest, React Testing Library, Cypress)
Program szkolenia
Dzień 1
Wstęp
- Wprowadzenie do narzędzi i opis środowiska (vite)
- Opis struktury folderów oraz wyjaśnienie jak działa React
- Tworzenie produkcyjnej wersji aplikacji
Podstawy renderowania
- Wprowadzenie do JSX
- Definiowanie komponentów
- Renderowanie warunkowe
- Renderowanie kolekcji
- Obsługa zdarzeń
Stylowanie
- CSS modules
- CSS in JS (styled-components)
- Porównanie stylowania
Dzień 2
Podstawy zarządzania stanem
- React hooks (state, effect)
- Zarządzanie lokalnym stanem komponentu
- Cykl życia komponentu
Formularze
- Obsługa formularzy poprzez komponenty kontrolowane
- Podstawy react-hook-form
Zdarzenia asynchroniczne
- Obsługa zdarzeń asynchronicznych (komunikacja z REST API poprzez fetch API)
- Wprowadzenie do react-query
Praca z wieloma komponentami
- Routing (react-router-dom)
- Kompozycja komponentów w drzewie Virtual DOM
Zarządzanie stanem poza komponentami
- Komunikacja między komponentami poprzez props
- React context
Dzień 3
Statyczne typowanie
- Iteracyjne wprowadzanie kodu TypeScriptowego
- Wprowadzenie do Typescript
- Typowanie zdarzeń
- Typowanie interfejsu komponentów
- Typowanie kodu zarządzającego stanem
- Rozwiązywanie problemów z nieotypowanymi bibliotekami w TypeScript
Architektura aplikacji oraz podsumowanie podstaw Reacta
- Przegląd praktyk związanych ze strukturą modułów w projekcie
- Stworzenie aplikacji zawierającej poznany materiał
Dzień 4
Redux
- Wprowadzenie do koncepcji Reduksa (state, action, reducer)
- Globalne zarządzanie stanem z wykorzystaniem biblioteki Redux
Testowanie
- Testy jednostkowe z wykorzystaniem biblioteki Jest i react-testing-library
- Testy integracyjne z wykorzystaniem biblioteki Cypress i cypress-testing-library