Z Żanetą znamy się zawodowo już dość długo, dzięki czemu mogłem być świadkiem jej przeobrażenia się z developera aplikacji natywnych na telefony w prawdziwą frontend developerkę z pasją!  Jako że jest to mój pierwszy gościnny wpis na blogu NetteCode, wypada podziękować jej za możliwość podzielenia się z Wami tymi kilkoma słowami.

Chciałem w Was dzisiaj zaszczepić pewną koncepcję, która przyświeca mi zawsze, kiedy uczę się nowych technologii. Jest ona w zasadzie dość prosta i oczywista, ale na swojej drodze spotykam wielu developerów, którym sprawia ona problemy w praktycznej realizacji. Wymaga ona natomiast odrobinę samozaparcia i dobrej organizacji pracy.

Moje podejście do nauki czegokolwiek w świecie programowania jest takie, że zawsze dążę do tego, aby z mojej nauki coś wynikło (thank you captain obvious 😉 Rzecz jasna zupełnie nie chodzi mi o to, co oczywiste, czyli o poszerzenie swoich umiejętności w danym zakresie (chociaż jest to pożądany skutek uboczny ;), lecz o to, aby po mojej nauce powstał gotowy produkt – zawsze, bez wyjątków! Może być to aplikacja dowolnie mała lub dowolnie duża, dowolnie prosta lub dowolnie skomplikowana. Liczy się natomiast to, żeby nigdy nie skończyło się na samym poszerzeniu wiedzy bez dania czegoś od siebie dla użytkowników.

W dalszej kolejności będę się posługiwał przykładami ze świata frontendu, który na blogu jest dość mocno obecny. Przykładowo – jeśli ktoś już zna podstawy w postaci JavaScript, CSS i HTML, to ucząc się nowego frameworka, np. React albo Vue, ma możliwość stworzenia prostej, działającej aplikacji.

Oczywiście wymaga to od nas więcej pracy, ponieważ najczęściej w trakcie procesu uczenia się zostawiamy wszystko w stanie bardzo surowym. Dzięki “nieszufladowemu” podejściu mamy też pewnego rodzaju motywację, aby wszystko nieco lepiej dopracować, gdyż potencjalnie inni ludzie zobaczą wynik naszej pracy. Zmusza nas to też do lepszego przemyślenia funkcjonalności, znacznie lepszego dopracowania UI, stworzenia podstawowej promocji marketingowej oraz należytego przetestowania gotowej aplikacji przed jej publikacją. Dzięki temu weryfikujemy naszą nowo poznawaną technologię od razu “w boju”. Umożliwia nam to jej znacznie lepsze zrozumienie, ponieważ uwzględniamy od razu wiele przypadków brzegowych, o których nigdy byśmy nie pomyśleli, pisząc tylko aplikację tutorialową “do szuflady”. Pisanie aplikacji od razu dla użytkowników mobilizuje nas do większej dokładności, odpowiedzialności oraz wyrabia podejście “get things done”.

Podejście “nie do szuflady” oczywiście nie wyjdzie, gdy będziemy chcieli poznać i wykorzystać naraz za dużo nowych technologii . Przykładowo – kiedy nie znamy dobrze JavaScriptu, nie powinniśmy wykorzystywać omawianego podejścia i brać się za naukę Angulara wykorzystującego TypeScript, licząc, że za pierwszym razem poradzimy sobie ze stworzeniem dobrze działającej aplikacji webowej na nim opartej. Kluczowe są proporcje! Sugeruję mniej więcej wykorzystanie w 70% technologii, które już dobrze znamy, i w 30% nowej technologii. Ta nowa technologia, której się uczymy, powinna stanowić znacznie mniejszą część całościowej wiedzy potrzebnej do stworzenia naszej aplikacji. Podam Wam kilka przykładów z mojego życia.

Znając już dość dobrze Angulara, TypeScript oraz koncepcje mobilnych aplikacji hybrydowych, uczyłem się Ionic2 poprzez stworzenie aplikacji National Holidays, którą opublikowałem na Google Play. Jako że jest to oczywiście aplikacja webowa, mogłem ją także wypromować jako plugin do Chrome.

Znając dobrze Angulara i podstawy tworzenia aplikacji na platformę Android, postanowiłem nauczyć się frameworka NativeScript (opartego na Angularze) do stworzenia aplikacji Scan & Find, która także znalazła się na Google Play.

Natomiast ostatnio postanowiłem zgłębić technologię Redux oraz podejście serverless web applications z wykorzystaniem Firebase. Reduxa chciałem nauczyć się w kontekście Angulara, zatem naturalne było wykorzystanie biblioteki ngrx/store.

Do nauki Redux w kontekście Angulara szczerze mogę polecić książkę “Architecting Angular Applications with Redux, RxJS, and NgRx: Learn to build Redux style high-performing applications with Angular 6” (co prawda rozdział o własnej implementacji Reduxa z początku książki sugeruję tylko najwytrwalszym. Późniejsze praktyczne przykłady z wykorzystaniem ngrx/store serdecznie wszystkim polecam).

Jak zatem widzicie, mój plan polegał na dołożeniu dwóch nowych technologii do stosu już zupełnie mi znanago z Angularem, TypeScript, Cordovą (chciałem stworzyć także hybrydową aplikację mobilną) i Angular Material na czele. Działałem w myśl zachowania proporcji 70/30. Postanowiłem, że napiszę aplikację umożliwiającą tworzenie współdzielonej listy zakupów z wieloma kategoriami. Dzięki temu powstała aplikacja Simply Shopping List dostępna na urządzenia z Androidem.

Ponieważ aplikacja została stworzona w podejściu mobile first, to pomyślałem, że można ją także rozpropagować jako aplikację desktopową (http://simply-shopping-list.scislo.eu/), a także jako pluginy do Chrome i Firefox. Ponadto mogłem wykorzystać znane mi już frameworki RWD, takie jak Bootstrap. Stwierdziłem jednak, że nadszedł czas na dołożenie i wykorzystanie kolejnej nowej technologii, w tym przypadku CSS Grid. Do jej nauki polecam książkę “Grid Layout in CSS: Interface Layout for the Web”. Ze względu na to, że fundament aplikacji był już na miejscu i “nowe” technologie w momencie dokładania CSS Grid nie były już takie nowe, to nadal działałem w myśl proporcji 70/30. Tym oto sposobem i zupełnie przypadkowo w trakcie nauki Redux, Firebase i CSS Grid powstała pełna aplikacja RWD, dostępna na desktopy oraz urządzenia z Androidem.

Być może Wasze cyfrowe szuflady są już pełne aplikacji napisanych przy okazji uczenia się nowych technologii. Zastanówcie się jednak, czy nie warto nad nimi trochę popracować, aby ujrzały światło dzienne? Mam też nadzieję, że od teraz, ucząc się czegoś nowego, pozostawicie swoje szuflady zamknięte, a Wasze aplikacje otwarte na użytkowników.

 

P.S. Wiem, że w tym wpisie wymieniłem wiele różnych technologii frontendowych bez zagłębiania się w szczegóły. Gdybyście jednak chcieli, żebym napisał o którejś z nich więcej, dajcie znać w komentarzach poniżej. Dzięki!