Jak się uczę: Angular 4 i RxJS

Solidna dawka materiałów do nauki zaawansowanych zagadnień z Angulara 4 melduje się na blogu. Radzę uzbroić się w duży kubek dobrej kawy albo herbaty, bo zapraszam Was w podróż po możliwościach Angulara 4 oraz programowaniu reaktywnym! Ruszamy!

W poniższym wpisie z serii Jak się uczę znajdziecie zbiór materiałów do nauki Angulara 4, a także RxJS. Są to zagadnienia, które warto poznać, gdy opanuje się już podstawy Angulara, a wcześniej dobrze zrozumie się JavaScript. Dlatego dzisiejszy artykuł kieruję do osób, które już jakiś czas zajmują się JavaScriptem i miały okazję trochę podziałać w Angularze.

Angular 4

Zaczniemy od samego Angulara, a dokładniej od recenzji zaawansowanego kursu Angulara 4 dostępnego na Strefie kursów. Jakiś czas temu umieściłam na blogu recenzję podstawowego kursu Angulara z tej samej strony, znajdziecie ją tutaj. Kurs zaawansowany jest kontynuacją tego podstawowego, rozwijamy w obu tę samą aplikację i uzupełniamy kolejne zagadnienia z tematu.

Kurs jest w języku polskim i fajnie prowadzi nas przez poszczególne etapy zaawansowania. Poznajemy w nim między innymi zagadnienia związane z cyklami życia komponentów, data flow, zaawansowanym wykorzystaniem formularzy czy routingu. Tematy są naprawdę dokładnie omówione i zilustrowane odpowiednimi przykładami. Cały czas możemy równolegle z prowadzącym rozwijać aplikację, co daje możliwość sprawdzenia wiedzy w praktyce.

Duże wrażenie zrobiło na mnie wprowadzenie do tematyki związanej z cyklem życie komponentu. Pierwszy raz spotkałam się z tak fajnie wyjaśnionym tematem. Chociaż korzystam z omówionych tutaj zagadnień na co dzień, nie wszystkie znałam z takiej teoretycznej strony i dlatego świetnie mi się o nich słuchało. Przyznam też, że pierwszy raz spotkałam się z niektórymi hookami, np. ngAfterContentChecked (czas nadrobić dokumentację!). Dobrze, że prowadzący wyjaśniał między nimi różnice i pokazywał, kiedy można się ich użyć. Kilkukrotnie także podkreślał, których nie należy używać i co może spowodować ich wywołanie. Dobrze jest podczas wprowadzania zagadnienia od razu uczulać uczestników na pułapki związane z danym aspektem i to w kursie jest bardzo fajnie zrobione.

Kolejny plus za podkreślenie, jakie elementy kodu są częścią Angulara, a jakie TypeScripta czy ES6. Ja uczę się TS oraz ES6 właściwie równolegle z Angularem, dlatego czasem trudno jest mi jednoznacznie stwierdzić, czy dany fragment kodu pochodzi typowo z Angulara czy np. jest z nowego standardu JS. Dzięki uwagom w kursie było mi łatwiej to sobie pogrupować. Przyznam, że skłoniło mnie to do zrobienia kursu tylko z ES6, żeby dokładnie wiedzieć, jakie rozwiązania są jego częścią. Trafiłam na super kurs z PluralSight w tym temacie. Jeśli chcielibyście sobie zrobić powtórkę (albo wstęp) do ES6, odsyłam tutaj.

Wracając do kursu – są oczywiście również minusy. Nadal, tak jak w poprzedniej recenzji, razi mnie trochę tematyka głównej aplikacji, ale o tym już pisałam ostatnio. Druga sprawa – zbyt krótkie wprowadzenie do RxJS. To naprawdę potężne narzędzie i często wykorzystywane w Angularze, a miałam wrażenie, że tutaj nie została mu poświęcona odpowiednia ilość miejsca. Wiem, że ten temat jest rozległy (poniżej zresztą wrzucam kilka fajnych materiałów do nauki), ale uważam, że jeśli to jest kurs dla kogoś, kto dopiero wchodzi w świat Angulara i jest po podstawowym kursie, fajnie byłoby RxJs wytłumaczyć szerzej. Nie wiem, czy gdybym nie znała np. idei observable, udałoby mi się od razu zrozumieć, o co chodzi.

Reasumując – kurs fajnie opisuje kolejne zagadnienia, które warto znać, jeśli chcemy pisać aplikacje w Angularze 4. Zdecydowanie polecam go osobom, które zrobiły kurs podstawowy z tej strony albo już trochę kodowały w Angularze 2+. Jeśli macie ochotę wypróbować kurs, mam dla Was kod zniżkowy -25%, ważny aż do końca listopada. Razem z kodem code25 kupicie kurs taniej. Kod obowiązuje na wszystkie kursy w ofercie, także przejrzyjcie sobie katalog szkoleń na Strefie kursów. Dodatkowo każda recenzja kursu zakupionego w serwisie (dodana do 5 listopada) weźmie udział w konkursie, w którym do wygrania jest iPad lub jedna z 10 kart podarunkowych, szczegóły znajdziecie tutaj.

Jeśli szukacie innych źródeł do nauki Angulara, to zajrzyjcie do wpisu o materiałach do nauki podstaw Angulara 2+.

RxJS

Przechodzimy do kolejnego tematu na dziś, a mianowicie do RxJS. Już wspominałam o nim pisząc o tym, jak uczę się Reduxa, ale dzisiaj postanowiłam poświęcić mu troszkę więcej miejsca. Od czego więc zacząć, gdy chcemy dowiedzieć się więcej o tej bibliotece JS umożliwiającej nam programowanie reaktywne? I co to w ogóle jest RxJS?

Jak podaje oficjalna strona:

RxJS is a library for reactive programming using Observables, to make it easier to compose asynchronous or callback-based code.

Nie będe się tutaj silić na tłumaczenia, bo uważam, że każdy powinien sam zrozumieć zagadnienie, żeby go używać. Odeślę Was więc do fajnych źródeł, które pozwolą to uczynić. Po pierwsze polecam mocno to super wprowadzenia do programowania reaktywnego. Jesli wolicie oglądać, a nie czytać, tutaj wersja video. Warto sobie też najpierw przejść przez kurs Asynchronous Programming: The End of The Loop, żeby poznać koncepcję asynchroniczności.

Moim ostatnim odkryciem są dwa świetne źródła. Po pierwsze – artykuł o observable w RxJS na blogu Type of Web. Czasem, gdy nie mogę zupełnie zrozumieć tematu, szukam materiałów po polsku, licząc, że to w jakiś sposób mi pomoże. I tak właśnie była z obserwablami (strasznie śmieszne to słowo po polsku!). Polecam gorąco artykuł wszystkim, którzy nie wiedzą, jak ugryźć temat.

Drugie odkrycie to filmy z kanału Academind na YouTube. Szczególnie przypadło mi do gustu to wyjaśnienie jak działają observable. Super wytłumaczone jest tutaj na przykład to jak stosować subskrypcje. Nałogowo wręcz oglądam też video o operatorach w RxJS, jak na przykład ten filmik o map. Jakoś tak ostatnio idealnie mi pasują na poranną jazdę autobusem 😉 Przykłady w tych filmikach są pokazywane na JavaScripcie, a nie samym Angularze, ale moim zdaniem to duży plus. Po pierwsze, zauważamy uniwersalność biblioteki, a po drugie, o wiele łatwiej jest to zrozmieć na bardzo prostych przykładach. Co szczególnie przyda się osobom, które dopiero zaczynają z bardziej zaawansowanymi zagadnieniami z Angulara i niekoniecznie ich użycie im pomoże przy w rozumieniu innych tematów, jak na przykład RxJS.

To tyle ode mnie na dziś! Mam nadzieję, że od razu ruszycie do nauki 🙂 W kolejnej odsłonie cyklu planuję zebrać materiały dotyczące programowania funkcyjnego w JavaScript oraz samego JS (z naciskiem na ES6). Który temat wolicie najpierw? Dajcie koniecznie znać w komentarzu!