Tworzenie interaktywnych aplikacji internetowych w React - techniki zaawansowane

Najbliższe terminy tego szkolenia
Skuteczność
Program szkolenia
- React - Wstęp
- łówne założenia React
- Przygotowanie środowiska pracy
- “Hello world” w React
- React Developer Tools
- Elementy renderowalne
- Wstęp - co możemy renderować w React 16.x?
- React bez JSX
- JSX - Wyrażenia
- JSX- Zaawansowane atrybuty (style, value, contenteditable, dangerouslySetInnerHTML)
- React.Fragment
- Portals
- Komponenty
- Komponenty funkcyjne kontra klasowe
- Props
- Komponent jako pure function
- Stan komponentu
- Inicjalizacja stanu komponentu
- Aktualizacja stanu komponentu
- Cykl życia komponentu
- Inicjalizacja - constructor()
- Renderowanie - render()
- Zamontowanie - componentDidMount()
- Aktualizacja
- componentDidUpdate()
- shouldComponentUpdate()
- static getDerivedStateFromProps
- Odmontowanie - componentWillUnmount()
- Komponenty zaawansowane
- Komponenty wyższego rzędu - Higher-Order Components
- Sprawdzanie typów - PropTypes
- Komunikacja komponentów : dziecko - rodzic oraz rodzeństwo
- React Router
- Instalacja potrzebnych paczek
- Routing podstawy
- Generowanie strony 404
- Linki
- Zagnieżdżanie ścieżek
- Przekazywanie parametrów
- Redux
Redux pozwala nam zarządzać stanem aplikacji. W tej części poznamy sposoby na takie zarządzanie dzięki implementacji architektury Flux w postaci Reduxa.
- Architektura Flux
- Czym jest Redux?
- Redux i React
- Głupie i mądre komponenty czyli Presentational and Container Components
- Tworzenie i obsługa akcji
- Reducery
- Store
- Przepływ danych w aplikacji
- Integracja z React Router
- Testowanie
- Instalacja odpowiednich narzędzi (Jest & Enzyme)
- Przykładowa aplikacja React & Redux do testowania
- Struktura testów
- Testowanie komponentów
- Warsztat końcowy
React re-start, czyli przypomnienie podstawowych założeń, instalacja odpowiednich narzędzi i szybkie wyświetlenie hello world na potwierdzenie, że jesteśmy gotowi do pracy.
Korzystanie z React-a bez JSX jest możliwe, tylko po co? W tej części przypomnimy podstawy JSX oraz dowiemy się jakie elementy można renderować w React v 16.x w porównaniu do wersji 15.x
Komponenty to jedna z najważniejszych rzeczy w React. W tej części przypomnimy sobie podstawy związane z komponentami.
Wiemy już czym jest cykl życia komponent, dlatego w tej części omówimy dokładniej odpowiednie metody cyklu życia z uwzględnieniem nowych zmian w React 16.x
Podczas tworzenia aplikacji niejednokrotnie przyda nam się wiedza jak rozszerzyć komponent o nowe możliwości dzięki HOC. W tej części także poznamy sposób na sprawdzanie typów, przekazywanych do komponentów jako props oraz wykorzystamy zdobytą wiedzę ćwicząc na praktycznych przykładach komunikację pomiędzy komponentami.
Dzięki bibliotece React Router będziemy mogli serwować odpowiednie komponenty pod określonymi adresami. Dowiemy się również w jaki sposób przekazywać parametry z adresu URL do komponentów.
Testowanie komponentów React-owych oraz samego Reduxa nie jest takie oczywiste. W tej części poznamy odpowiednie narzędzia, które sprawią, że testowanie będzie czystą przyjemnością
Na koniec zaczynamy pracę nad praktycznym połączeniem całej dotychczasowej wiedzy - tworząc konkretny projekt.
Opis szkolenia
Szkolenie odbywa się na żywo z udziałem trenera. Nie jest to forma kursu video!O szkoleniu w skrócie
Szkolenie z zaawansowanych aspektów wykorzystania React w tworzeniu oprogramowania. W trakcie szkolenia zapoznamy się z elementami renderowalnymi, komponentami i ich cyklem życia, React Routerem, Reduxem, testowaniem w React.
Na koniec jako podsumowanie stworzymy kompletny projekt z wykorzystaniem nowo nabytych umiejętności. Służy to nie tylko utrwaleniu wiedzy. Taki projekt będzie też świetnym źródłem copy-paste na przyszłość ;)
Dla kogo to szkolenie?
Szkolenie kierowane jest do osób, które:- znają JavaScript w stopniu co najmniej średnio-zaawansowanym,
- miały już styczność z Reactem
- znają w stopniu podstawowym HTML i CSS
- Pisały testy automatyczne do kodu
- chciałyby zgłębić wiedzę w zakresie zaawansowanych technik tworzenia interaktywnych aplikacji
- JavaScript - poziom średnio-zaawansowany
- Testowanie - poziom podstawowy
- podstawy HTML i CSS
- podstawy React
Prowadząca szkolenie: Agata Malec-Sromek
Absolwentka Akademii Górniczo-Hutniczej na kierunku Inżynieria Systemów i Oprogramowania oraz Politechniki Krakowskiej na kierunku Grafika Komputerowa i Multimedia. Swoją przygodę z programowaniem rozpoczęła w 2012 roku pracując w małej agencji kreatywnej na Saskiej Kępie. Od tamtego czasu przeszła przez kilka firm od małych start-upów po duże korporacje, ciągle zwiększając swoje umiejętności. W 2016 roku rozpoczęła współpracę z jedną ze szkół programowania, w której uczyła początkujących programistów tworzenia stron i aplikacji webowych. Aktualnie pracuje w jednej z większych warszawskich firm rozwijając oprogramowanie dla klientów z całego świata. Prowadzi podstawowe i zaawansowane szkolenia zarówno z JavaScript jak i z technologii takich jak m.in.: React, Redux. Wystąpiła na kilku konferencjach (m.in. na 4Developers i Programistok.) oraz prowadziła wiele warsztatów w ramach inicjatywy Women in Technology, Geek Girls Carots, Girls in IT i innych.
Stanowisko robocze

Do tego szkolenia każdy uczestnik otrzymuje dostęp do indywidualnej wirtualnej maszyny w chmurze. Ma ona zainstalowane i skonfigurowane wszystko co potrzebne do realizacji szkolenia. Maszyna będzie dostępna przez cały okres szkolenia.
Gdy na jakiś termin zgłosi się minimalna liczba osób, termin oznaczamy jako gwarantowany.
Jeśli jakiś termin oznaczony jest jako gwarantowany to oznacza to, że na 100% się odbędzie we wskazanym czasie i miejscu.
Nawet gdyby część takiej grupy zrezygnowała lub przeniosła się na inny termin, raz ustalony termin gwarantowany takim pozostaje.
Ewentualne ryzyko ponosimy my jako organizator.
Przejdź do terminów tego szkolenia

Sprawdź, co mówią o nas ci, którzy nam zaufali
Trenerzy kategorii JavaScript





