Full-stack w ekosystemie TypeScript

Ostatnio coraz częściej zastanawiam się nad swoją rolą w zespole. Ponad dwa lata w branży sprawiły, że coraz częściej muszę wychodzić ze swojej strefy komfortu i mierzyć się z zadaniami niejednokrotnie wykraczającymi znacznie poza znane mi obszary. Bardzo dobrze poruszam się po stronie klienta. Jednak niejednokrotnie przychodzi mierzyć się z zadaniami wymagającymi jednak kompetencji nie tylko z obszaru "pomiędzy" klientem i serwerem, ale również samego backendu czy architektury.
Wchodziłem do branży jako programistafrontend, ale już teraz wiem, że na dłuższą metę to mi nie wystarczy. Coraz bardziej kieruję swoje działania w kierunku samej architektury client-server, jak i serwera. Nieuchronnie zmierzam do tego, by zostać full-stack developerem.

Kim jest full-stack developer?

Full-stack developer to w moim przekonaniu osoba, która ma umiejętności programowania zarówno po stronie klienta, jak i serwera. Dzięki swojej wszechstronności jest w stanie tworzyć i zarządzać kompleksowymi projektami IT.
Do typowych obowiązków takiej osoby należą min:

• projektowanie i implementacja interfejsów użytkownika
• tworzenie i optymalizowanie kodu na back-endzie
• obsługa baz danych i integracja z innymi systemami
• testowanie i rozwiązywanie problemów z aplikacją.

Patrząc bliżej na taki rozkład obowiązków i zadań można odnieść wrażenie, że taka osoba to mit i jednorożec w swojej organizacji, a nie wspomnieliśmy jeszcze nic o umiejętnościach miękkich niezbędnych przecież do sprawnego funkcjonowania w IT.
Rozbijmy sobie każdy z tych obowiązków na czynniki pierwsze.
Projektowanie i implementacja interfejsów użytkownika, czyli szeroko pojęty frontend. Wydawać by się mogło, że cóż to tam takiego podstawowa znajomość HTML, CSS i JavaScript, jakiś framework i "impossible is nothing".
Nic bardziej mylnego.
Oprócz samej implementacji interfejsu zaprojektowanego przez kogoś dochodzi masa innych rzeczy. Samo odwzorowanie designu, co do pixela jest niejednokrotnie karkołomnym wyzwaniem. Do tego dochodzą zagadnienia związane z optymalizacją i wydajnością. Nikt przecież nie chce, żeby tabela z 1000 rekordami ładowała się wieki prawda? Wypadałoby też przynajmniej rozumieć zasady dobrego designu i UX. Zdecydowanie taka wiedza pomaga pisać odpowiednią strukturę komponentów.
Dodatkowo bezpieczeństwo i odpowiednia komunikacja z serwerem to, też przecież kolejny szeroki obszar, który wypadałoby znać przynajmniej w stopniu podstawowym pisząc frontendowy kod. Formaty wymiany danych i rodzaje komunikacji takie jak REST API, czy GRAPHQL, które same w sobie są odrębną dziedziną, też wymagają poświęcenia czasu na naukę i eksperymentowanie.

Bazy danych i ich obsługa. Sama warstwa pomiędzy klientem i serwerem i mamy tutaj walidację danych. Dane możemy walidować po stronie frontendu i backendu. Dodatkowo same zagadnienia związane z architekturą backendu to morze wymagań. Dobór odpowiedniej bazy danych, zaprojektowanie relacji w naszej bazie, rozbicie środowisk na te produkcyjne i lolalne to nie lada wyzwania.
Na koniec nie zapominajmy o samej konfiguracji autoryzacji i uwierzytelnianiu. Konfiguracji CORS i samego servera. Dodawanie i odczytywanie danych, usuwanie danych to przecież też zagadnienia wymagające odpowiedniej wiedzy i podejścia.
Do tych aspektów technicznych dochodzi odpowiednie testowanie. Tutaj znowu testowanie samego frontendu i backendu to nie wszystko. Do tego musimy przetestować, jak te systemy pracują ze sobą. Happy path to nie wszystko.
Oprócz umiejętności typowo technicznych dochodzi jeszcze masa umiejętności miękkich, które są niezbędne do odpowiedniej komunikacji w projekcie. Full-stack przenika pomiędzy różnymi zespołami projektowymi dlatego sama komunikacja i umiejętne rozwiązywanie konfliktów musi stać na wysokim poziomie.

Zalety i wady rozwoju w kierunku full-stack developera

Wiedząc już jak wiele wymagań stawianych jest przed stanowiskiem full-stackowym jakie są zalety i wady takiego kierunkowania swojej kariery?
Do niewątpliwych zalet zaliczymy na pewno wszechstronność. Nabywając takie umiejętności full-stacka stajemy się osobą, która jest przydatna w większości zespołów produkcyjnych. Szerokie zrozumienie całego procesu developmentu pozwala nam szybko identyfikować i adresować problemy, optymalizować kod i ogólnie pojętą efektywność w projekcie.
Jako full-stack jesteśmy efektywni kosztowo dla każdej organizacji. Lepiej przecież zatrudnić wszechstronnego developera niż armię wąsko wyspecjalizowanych. Oczywiście wraz ze wzrostem skomplikowania danego projektu wąska specjalizacja może okazać się niezbędna.
Jeżeli do powyższych dodamy szereg umiejętności miękkich, drastycznie ulepszamy samą komunikację w zespole i stajemy się bardziej atrakcyjni dla rekruterów. Jednak decyzja o rozwoju swojej kariery w kierunku full-stack developera nie jest tutaj usłana tylko różami.
Szerokie wymagania i konieczność głębokiego zrozumienia szerokiego zakresu procesu sprawia, że dużo ciężej jest pozostać nam "na powierzchni" i być na bieżąco z danymi technologiami. Świat technologii zmienia się na naszych oczach i jako full-stack musimy starać się nadążyć za bardzo szybko zmieniającym się ekosystemem narzędzi.
Nie zapominajmy również o wymaganiach stawianym osobom na tym stanowisku. Zatrudniający mają dużo większe oczekiwania, zakładając, zresztą słusznie, że full-stack jest ekspertem w różnych dziedzinach. To może prowadzić do zwiększonej presji i wypalenia zawodowego.

Łączenie wiedzy z zakresu front-endu/backendu i szukanie powiązań

W ostatnich latach obserwujemy dynamiczny rozwój technologii, który wpływa na coraz większe zacieranie się granicy między front-endem a back-endem. W efekcie, specjaliści IT muszą dostosować swoje umiejętności, aby sprostać wymaganiom rynku pracy. W tej sytuacji poszukiwanie powiązań między różnymi dziedzinami jest kluczem do sukcesu zawodowego.
Ważnym aspektem, który wspiera proces łączenia wiedzy z zakresu front-endu i back-endu, jest upowszechnienie technologii, takich jak Node.js, które umożliwiają programowanie zarówno na poziomie klienta, jak i serwera. Dzięki takim narzędziom developerzy mogą wykorzystać swoją wiedzę z jednej dziedziny do drugiej, co ułatwia szybkie adaptowanie się do nowych wyzwań.
Coraz większa liczba bibliotek i frameworków również wpływa na zacieranie się granic między front-endem a back-endem. Aktualnie pozostając w samym ekosystemie JavaScript/TypeScript jesteśmy w stanie tworzyć kompleksowe systemy informatyczne od klienta po serwer.
Dodając do tego serwis ze zintegrowanymi CI/CD i rozwiązania w chmurze droga do zostania full-stackiem nie musi być taka wyboista, jak mogłoby się wydawać.

Aktualny stack technologiczny i przydatne narzędzia

Zacznę od wielkiej trójki mojego stacku technologicznego, na którym obecnie opieram większość swoich projektów.

NextJS13

Backendowy framework, który stał się rozwiązaniem fullstackowym. Najnowsze zmiany dotyczące 'app-directory' czy wsparcie dla 'React Server Components' jeszcze bardziej przekonują mnie do tego, żeby pozostać przy tym frameworku. Chociaż konkurencja nie śpi i alternatywy w postaci 'SolidJS', czy powracającego do łask 'Angulara' ze wsparciem dla sygnałów wydają się warte rozważenia.

TailwindCSS + RadixUI

Odkąd zacząłem używać tego frameworka do stylowania swoich projektów nie widzę potrzeby zmiany. Świetna dokumentacja i dostęp do 'TailwindUI' pomagają mi szybko stylować elementy aplikacji. Dodatkowe wsparcie w postaci komponentów z biblioteki 'RadixUI' z pełnym wsparciem accessibility pozwala mi szybko iterować po widokach aplikacji.

Planetscale, Prisma, Digitalocean i Vercel

W większości swoich projektów do deploymentu wykorzystuję platformę 'Vercel'. Jest świetnie zintegrowana z samym NextJS. Daje wsparcie do postawowej analytyki, która na moje potrzeby jest wystarczająca. Dodatkowo na horyzoncie coraz bardziej wybija się 'Turborepo' i 'Turbopack', które znacznie ułatwiają integrację poszczególnych części składowych projektu.

Jeżeli chodzi o rozwiązania do baz danych, to najczęściej sięgam po 'Digitalocean' jest to jednak tylko kwestia przyzwyczajenia. Ostatnie próby z 'Planetscale' coraz bardziej przyciągają mnie jednak do tego, by oprzeć swoje bazy danych na tej platformie. Przejrzystość kosztów i dosyć elastyczny cennik wypada lepiej w porównaniu do digitalocean.
W warstwie do łączenia bazy danych i aplikacji wspieram się obecnie 'Prismą'. Ten ORM pozwala nam bardzo łatwo budować zapytania do bazy danych. Dodatkowe wsparcie w postaci TypeScript i IDE oraz 'PrismaStudio' sprawiają, że z bazami danych nigdy nie pracowało się łatwiej.
Jeśli chodzi o alternatywę dla prismy to coraz bardziej podoba mi sie databasejs. Jest to projekt rozwijany przez planetscale. Dzięki temu sterownikowi bazy danych możemy z łatwością skonfigurować połączenie z bazą i komunikować się z nią dostając w pełni otypowane rezultaty.
Są to główne elementy architektury moich full-stackowych projektów obecnie. Nie wykluczam jednak, że w wyniku eksperymantów i próbowania nowych rozwiązań poszczególne elementy będą się zmieniać.

Jak sam rozwijam się w kierunku full-stack developera?

Przede wszystkim pozostaję w ekosystemie jednego języka programowania, jakim jest JavaScript/TypeScript. Szeroki zakres wymagań na tym stanowisku sprawia, że świadomie podjąłem decyzję o odłożeniu innych języków "na bok", przynajmniej na chwilę obecną. Mnogość bibliotek i ogromne community sprawia, że łatwo znaleźć rozwiązanie dopasowane do swoich potrzeb tylko w obrębie jednego języka. Dodatkowo pozostawanie w obrębie jednego ekosystemu pozwala mi skupic się na rozwoju konkretnych umiejętności mając problem doboru narzędzi z głowy.
Rozwój w kierunku fullstack developera podzieliłbym u siebie na 3 główne filary.

• ciągła nauka
• networking i aktywność w community
• pozostawanie na bierząco i miejsce na eksperymenty

Ciągła nauka polega u mnie głównie na wewnętrznej ciekawości i poświecaniu czasu na przerabianie kursów i budowanie swoich projektów "na boku". Zasoby online, warsztaty i kursy to doskonałe sposoby na poszerzenie wiedzy i utrzymanie swojego zestawu umiejętności na bieżąco.
Networking odgrywa bardzo istotną rolę w rozwoju zawodowym. Budowanie silnej sieci z innymi profesjonalistami w branży może dostarczyć cennych porad i możliwości. Udział w forach internetowych, uczestnictwo w wydarzeniach branżowych oraz uczestnictwo w lokalnych spotkaniach nie tylko pomaga uczyć się od kolegów, ale także sprzyja nawiązywaniu relacji, które mogą prowadzić do możliwości zatrudnienia lub wspólnych projektów. Staram się raz na jakiś czas uczestniczyć w lokalnych meetupach grup Reactowych/TypeScriptowych.
Trzecim filarem jest pozostawanie na bieżąco z trendami i technologiami. Będąc poinformowanym o nowych narzędziach, frameworkach i najlepszych praktykach, będziesz mógł podejmować świadome decyzje, wybierając technologie do swoich projektów. Co więcej, pozostanie na bieżąco, pozwala zidentyfikować obszary, w których można zoptymalizować swój kod lub usprawnić proces twórczy. Aby być na bieżąco, zapisałem się do branżowych newsletterów, śledzę wpływowych developerów w mediach społecznościowych oraz regularne czytam blogi i artykuły na tematy fullstackowe.

Podsumowanie

Podsumowując, w świecie, w którym granice między front-endem a back-endem zacierają się, kluczowe jest poszukiwanie powiązań i rozwijanie umiejętności w tych dziedzinach. Nawet jeżeli nasza specjalizacja to czysty frontend lub backend. Nie widzę nic złego w poszerzaniu zakresu swojej kompetencji. Poprzez takie podejście do rozwoju swojej kariery możemy lepiej przygotować się na zmiany w technologicznym krajobrazie oraz utrzymać udaną i satysfakcjonującą karierę w branży technologicznej.