w Praktyce
17 godz. 9 min · Full-stack i Programowanie
Mateusz KuleszaSenior Software Developer, Konsultant, TrenerSposób działania biblioteki React dla osób niewtajemiczonych może wydawać się wręcz “magiczny”. I możesz zapytać - gdzie tkwi haczyk? Otóż React korzysta z bardzo sprytnego mechanizmu pracy z DOM która omówiona jest właśnie w tej sekcji. Właśnie w niej pokazuję dokładny mechanizm działania “magii Reacta” i pokazuje dlaczego wbrew temu co podpowiada intuicja podejście React jest o wiele wiele szybsze niż klasyczne metody. Kurs ten zaczyna się od szybkiego przypomnienia podstaw pracy z przeglądarką i z obiektem dokumentu - czyli ze “stroną internetową” - przy użyciu JavaScript. Dla osób początkujących jest to świetne wprowadzenie, a dla osób które znają już dobrze JavaScript ta sekcja jasno i dokładnie pokazuje różnice w podejściu standardowym do renderowania HTML w przeglądarce a tym nowym, szybszym - deklaratywnym - podejściem jakie oferuje React.
O ile pierwsza część pokazuje tajniki działania Reacta i jego API, tak kolejna sekcja skupia się na produktywności. Zobaczysz jak błyskawicznie przekonwertować kod HTML do kodu JSX dla React, a także nauczysz się jak dzięki dynamicznym szablonom możesz renderować dowolnie złożony kod HTML tak prosto i szybko jak nigdy dotąd. Czyż nie było by to super wygodne gdybyś mógł używać zmiennych i funkcji JavaScript bezpośrednio w HTML? Na takie podejście do renderowania HTML właśnie pozwala JSX. Transpilator Babel, którego będziemy używać w kolejnych sekcjach kursu daje także możliwość wykorzystania ogromnych możliwości i wygody pracy jaką daje nowa wersji JavaScript. Jeśli nie miałeś okazji z nią pracować - nie martw się - omawiam pokrótce wszystkie najbardziej przydatne elementy tego języka, z których będziemy korzystać w tym kursie!
Te sekcje kursu kończą część wizualną pracy z React, a rozpoczynają omawianie narzędzi i bibliotek współpracujących doskonale z biblioteką React. Pokazuje krok po kroku jak zamienić prostą stronę internetową napisaną w React na pełnoprawną Single Page Application, czyli aplikacje internetową z prawdziwego zdarzenia. Dowiesz się jak strukturyzować dane i w prosty sposób przekazywać je do komponentów by struktura aplikacji była przejrzysta i elastyczna. W kolejnej sekcji dowiesz się jak przekonwertować aplikacje z plików na moduły ES6, jak dynamicznie budować aplikacje przy każdej zmianie, a także zaawansowane tematy - jak skonfigurować super-szybki serwer developerski, oraz jak skonfigurować przeładowywanie modułów “na gorąco”, dzięki czemu zmiany w twoim kodzie będą widoczne w aplikacji natychmiast - bez odświeżenia strony przeglądarki!
Ponadto dowiesz się także jak dzięki podejściu funkcyjnemu można nie tylko tworzyć super-szybkie aplikacje internetowe, ale jak architektura Flux i jednokierunkowy przepływ danych pozwalają także uzyskać stabilny i przejrzysty kod aplikacji. Jest to sekcja zaawansowana, ale jednocześnie bardzo istotna dla osób, które planują budować bardziej rozbudowane aplikacje z użyciem Reacta, chcą znać wysokopoziomowe koncepcje i nie chcą popełnić typowych błędów w swoich projektach. W tym kursie architektura Flux nie jest omówiona pobieżnie - budujemy własną prostą implementacje Flux - dzięki czemu refaktorując kod aplikacji uczysz się krok po kroku poznając zalety i wady poszczególnych rozwiązań. Pod koniec kursu pokazuje także jak skonfigurować zaawansowane narzędzia takie jak przeładowanie modułów “na gorąco” - bez odświeżania strony, zalety niemutowalnych stanów aplikacji, czy tzw. “time-travel debugger”, czyli niesamowite możliwości manipulacji stanem aplikacji płynące z zastosowania biblioteki Redux!
Kurs jest przeznaczony dla wszystkich osób, które pracowały już lub pracują na co dzień z technologiami Front-End, czyli HTML,CSS i JavaScript. Kurs skonstruowany jest w taki sposób, że już podstawowa wiedza o tych trzech technologiach pozwala własnym tempem krok po kroku zagłębić się w ogrom możliwości jakie daje React. Jednocześnie dla osób bardziej doświadcznych, np. pracujących z Framework`ami JavaScript - kurs ten pokaże zupełnie inne podejście do tworzenia apliacji, niż znany powszechnie model Model-View-Controller. React dobrze zastosowany pozwala zwielokrotnić nie tylko szybkość tworzenia aplikacji i szybkość jej działania - ale co najważniejsze - pozwala znacznie zwiększyć komfort pracy programisty i pewność co do stabilności każdej linijki stworzonego kodu. Nawet jeśli nie planujesz zmiany technologii na React, i tak warto poznać zasady jego działania - wiedza ta może być zastosowana w innych rozwiązaniach i na pewno otwiera ona umysł na wiele nowych możliwości.
React 14-15.3