Tworzenie aplikacji w React i Redux
by:
5.0/5
Najbliższe terminy tego szkolenia
26.04
Termin gwarantowany
Szkolenie online
Ostatnie miejsca!
Standardy JSystems
- Wszyscy nasi trenerzy muszą być praktykami i osiągać średnią z ankiet minimum 4.75 na 5. Nie ma wśród nas trenerów-teoretyków. Każdy trener JSystems ma bogate doświadczenie komercyjne w zakresie tematów z których prowadzi szkolenia.
- Wszystkie szkolenia mają format warszatowy. Każde zagadnienie teoretyczne jest poparte rzędem warsztatów w ściśle określonym formacie.
- Terminy gwarantowane na 100%. Jeśli jakiś termin jest oznaczony jako gwarantowany, oznacza to że odbędzie się nawet jeśli część grupy wycofa się z udziału. Ryzyko ponosimy my jako organizator.
Program szkolenia
- Podstawy ECMAScript
Zanim zaczniemy tworzyć naszą aplikację, przypomnimy sobie pokrótce podstawy ECMAScript
- Let i const
- Fat arrow function
- Klasy
- Spread/rest operator
- Template string
- Import i export
- React - Wstęp
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
- Główne założenia React
- Przygotowanie środowiska pracy
- “Hello world” w React
- React Developer Tools
- JSX
JSX to rozszerzenie JavaScript, które umożliwia tworzenie elementów DOM za pomocą składni przypominającej HTML.
- Podstawy JSX
- Wyrażenia
- Atrybuty
- Inne elementy renderowalne (Portals, React.Fragments)
- Klucze
- Komponenty
Komponenty to jedna z najważniejszych rzeczy w React. W tej części dowiemy się czym są, jak je tworzyć i jak się nimi biegle posługiwać.
- Czym jest komponent?
- Komponenty funkcyjne
- Komponenty klasowe
- Komponenty funkcyjne kontra klasowe
- Props
- Komponent jako pure function
- Cykl życia komponentu
- State
- Eventy
Tworzenie eventów w React jest bardzo proste czego dowiemy się w tej części. Dodatkowo eventy w React mają jeszcze jedną ciekawą właściwość - pomagają w komunikacji pomiędzy komponentami.
- Rodzaje eventów
- Tworzenie eventów - bindowanie i this
- Arrow function jako metoda eventu
- Inline arrow function jako metoda eventu
- Przekazywanie argumentów do eventów
- Przekazywanie eventów do komponentów dzieci
- Warunkowe renderowanie
Czym jest instrukcja warunkowa if, wie każdy kto chociaż trochę poznał podstawy programowania, ale w tej części skupimy się na kilku prostych zasadach dotyczących warunkowego renderowania lub blokowania elementów i komponentów.
- Instrukcja warunkowa if
- Operator warunkowy
- Logiczny operator &&
- Blokowanie wyświetlania komponentów
- Formularze
Formularze to bardzo przyjemny rozdział w React, a to dzięki spójności w tworzeniu i obsłudze elementów formularza.
- Komponenty kontrolowane
- Jedyne źródło prawdy (single source of truth )
- Input
- Select
- Textarea
- Obsługa wielu elementów formularza
- Komponenty niekontrolowane
- Atrybut ref
- Domyślne wartości elementów formularzy
- Komponenty kontrolowane
- Kompozycja
W dokumentacji Reacta jest napisane, że programiści podczas tworzenia Facebooka nigdy nie musieli korzystać ze standardowego dziedziczenia. W każdej sytuacji kompozycja sprawdzała się idealnie. W tej części porozmawiamy na temat kompozycji.
- Kompozycja kontra dziedziczenie
- props.children
- React Router
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.
- 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
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ą
- Instalacja odpowiednich narzędzi (Jest & Enzyme)
- Przykładowa aplikacja React & Redux do testowania
- Struktura testów
- Testowanie komponentów
- Warsztat końcowy
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!- znają JavaScript w stopniu co najmniej średnio-zaawansowanym
- 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
- podstawy HTML i CSS
- podstawy React
- podstawy testowania automatycznego
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.
Terminy gwarantowane
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
Szkolenia online
Szkolenia online odbywają się na żywo z udziałem trenera. Uczestniczy łączą się na szkolenie za pomocą platfomy ZOOM.
Informacje o wymaganym niezbędnym oprogramowaniu oraz informacje organizacyjne uczestnicy otrzymują na 7 dni przed datą rozpoczęcia szkolenia.
Inne szkolenia tej kategorii
Sprawdź pozostałe
szkolenia JavaScript!
Sprawdź, co mówią o nas ci, którzy nam zaufali
Trenerzy kategorii JavaScript
Mateusz Kulesza
Mateusz Kulesza
Mateusz Lewandowski
Mateusz Lewandowski
Agata Malec-Sromek
Agata Malec-Sromek
