Lista materiałów, dzięki którym poznałam framework Angular

Angulara uczę się od kilku miesięcy. Zaczęłam od poznania wersji 1, czyli AngularJS, bo błędnie założyłam, że najpierw powinno się poznać jedynkę, a potem dwójkę. Dopiero po fakcie dowiedziałam się, że między obiema wersjami są tak duże różnice, że znajomość wersji jeden nie daje aż tak dużo, jeśli chcemy poznać wersję 2.

Jeśli chodzi o samo nazewnictwo, jakim będę się posługiwać – wersję jeden nazywać będę AngularJS, natomiast wersje wyższe – Angular. Przyjmuję więc filozofię stosowaną przez oficjalną stronę Angulara. Obecnie dostępna jest już wersja 4.0, która jest jednak rozszerzeniem wersji 2. Warto zaznaczyć, że między 2 a 4 nie ma tak ogromnego przeskoku jak między 1 i 2. Zostały wprowadzone ulepszenia, ale nie odczuwa się dużego skoku między wersjami. Materiały, które poniżej opiszę będą dotyczyć głównie Angulara 2, dlatego że Angular 4 jest jego rozszerzeniem, więc podstawa to i tak Angular 2.

Angular jest frameworkiem JavaScriptu, który pozwala budować aplikacje webowe, desktopowe, mobilne, a także natywne. Nie będę się tutaj rozwodzić nad teorią, a odeślę Was po prostu na oficjalną stronę Angulara, która jest jednocześnie moim głównym źródłem wiedzy. Na sam początek polecam kierować się sugestiami właśnie z tej strony, znajdziecie je tutaj.

Jak wskazują twórcy Angulara, najpierw warto zapoznać się z konfiguracją środowiska, potem przejść przez tutorial, a później do bardziej zaawansowanych kwestii.

Mi bardzo przydało się przejście przez tutorial aplikacji Tour of Heroes. Dzięki niemu poznałam podstawowe pojęcia związane z Angularem, a także mogłam pierwszym raz zobaczyć, jak wygląda TypeScript. W Angularze bowiem pisze się w TypeScriptcie, który jest swego rodzaju „nakładką” na JavaScript zawierającą typy oraz inne przydatne funkcje.

Na samym początku dużym problemem był dla mnie właśnie TypeScript, bo było to zupełnie coś innego niż JavaScript, którego już trochę znam. Typy nie wydawały mi się aż tak przydatne, by trzeba było się tak trudzić. Ale z czasem okazało się, że TypeScript to naprawdę fajna sprawa. W Angularze można pisać też w zwykłym JS, ale z tego co wiem nie jest to popularne. Samego TypeScriptu uczyłam się równolegle z Angularem, to znaczy po prostu patrząc na kod w tutorialach albo podglądając kod źródłowy aplikacji na githubie.

Myślałam, że to wystarczy, ale okazało się, że muszę trochę przysiąść nad samym TS. I tak trafiłam na dokumentację na oficjalnej stronie TypeScript. Bardzo prosto wyjaśnia ona podstawowe zasady, jakimi TS się kieruje. Dodatkowo zrobiłam też kurs Introduction to TypeScript na Udemy. Kurs jest darmowy i dość krótki, ale pozwala poukładać podstawowe kwestie.

Nie skłamię, jeśli powiem, że dokumentację z oficjalnej strony Angulara mam cały czas otwartą w przeglądarce. Równolegle uczę się też pisania testów jednostkowych, dlatego sekcja dotycząca testowania jest obecnie jedną z moich ulubionych. Bardzo fajnie opisuje ona sposób testowania poszczególnych elementów aplikacji. Ale to na pewno zadanie do zrobienia już po poznaniu podstaw Angulara.

Lubię sobie najpierw o jakimś zagadnieniu posłuchać, albo pooglądać tutoriale, zanim przejdę do praktyki.

W nauce Angulara bardzo pomógł mi kurs Accelerating through Angular na CodeSchool.

Kurs pokazuje jak krok po kroku stworzyć prostą aplikację, akurat w tym przypadku dotyczącą wyścigów samochodowych, a dokładniej części do samochodu. Tworzymy więc listę z odpowiednimi widokami, zapoznajemy się ze strukturą projektu, a także specyfiką TypeScriptu. Naprawdę porządna dawka wiedzy podana w przystępny sposób.

Kolejnym wartym uwagi kursem jest moim zdaniem Get Started With Angular na EggHead. Kurs podzielony jest na krótsze fragmenty niż ten na CodeSchool, więc łatwo odnaleźć wybrane zagadnienie i szybko prześledzić na czym ono polega. Według mnie fajnie jest najpierw zrobić kurs na CodeSchool, bo porusza szerszy aspekt, skupia się też na wytłumaczeniu bardziej ogólnych zagadnień. A kurs na EggHead jest dla niego świetnym uzupełnieniem, bo przekazuje małe porcje konkretnej wiedzy. Oba kursy są płatne, ale nie znalazłam niestety zbyt dużo darmowych materiałów z Angulara.

Na sam koniec polecę jeszcze kurs Angular 4 (formerly Angular 2) – The Complete Guide na Udemy. Udało mi się go kupić w promocyjnej cenie 10 euro. Polecam więc śledzić, czy nie ma promocji. Na razie obejrzałam dopiero kilka lekcji, ale już widzę, że fajnie mi się będzie uczyło, bo materiału jest dużo, ale jest podzielony na sekcje, dzięki czemu łatwo da się przerobić interesujący nas w danej chwili aspekt. I dodatkowo mamy tutaj nowości z Angulara 4, co z pewnością jest dużym plusem.

Równolegle polecam poczytać też o strukturze projektów w Angularze, bo jest dość specyficzna. Nadal mam problemy z odpowiednim rozplanowaniem układu poszczególnych plików, ale walczę.

Jako że struktura projektu w Angularze jest dość złożona, warto od razu zapoznać się z Angular CLI, który pozwala na generowanie odpowiednim plików (z odpowiednimi ścieżkami i szkieletami!) przez terminal.

Naprawdę to ogromnie ułatwia zadanie, szczególnie, gdy na przykład musielibyśmy ręcznie tworzyć po kilka plików do każdego modułu i komponentu, a tutaj po prostu wpisujemy odpowiednią komendę i dzieje się magia.

Jak widzicie, Angular to naprawdę sporo wiedzy do przyswojenia. Zaznaczam, że nie trzeba umieć AngularJS, żeby zacząć uczyć się Angulara. Mnie trochę pomogła znajomość specyfiki AngularJS, tj. nie były mi obce takie zagadnienia jak komponenty czy moduły, jednak Angular traktuje je momentami zupełnie inaczej niż AngularJS. Dlatego osobom, które chcą zacząć przygodę z Angularem, nie polecam AngularJS, tylko od razu wersje wyższe.

Artykuł pierwotnie ukazał się na wakeupandcode.pl

Zdjęcie główne artykułu pochodzi z burst.shopify.com.