AHA! Przywróćmy prostotę Frontendu

AHA stack przywróćmy prostotę frontendu
Czy zastanawiałeś się, dlaczego w dzisiejszych czasach, gdy mamy dostęp do najnowszych technologii i rozwiązań, projekty IT nadal kończą się fiaskiem? Czy nie uważasz, że w wielu przypadkach zamiast upraszczać to komplikujemy sobie życie i pracę? Czasami mniej znaczy więcej, zwłaszcza w świecie frontendu! Czytaj dalej i dowiedz się czym jest AHA stack i jak robić frontend prościej.

Jeśli chodzi o pracę z frontendem to podczas mojej niesamowitej technologicznej przygody niczym podróż kota w skarpetkach poprzez wrocławski rynek widziałem już wszystko. HTML i wysyłanie requestów do serwera przez xhttp, szablony typu Handlebars, jQuery. Pracowałem też z Magento gdzie frontend był prosty jak droga do nikąd. Tam poznałem Knockout.js czyli MVVM frawework i dekleratywne bindingi. Dalej to już z górki: EmberJS, AngularJS i ostatecznie React i Vue.

Ewolucja frontendu

Patrzę na te frameworki i podejścia do frontendu i myślę sobie, że na przestrzeni lat frontend bardzo odszedł od swoich korzeni i przeznaczenia. Zawsze myślałem o frontendzie jako o tym, ze jest jakaś strona WWW, na niej się coś wyświetla i użytkownik może sobie coś przeczytać, coś kliknąć.

Mówiąc bardziej technicznie frontend to HTML/CSS + interakcje dynamiczne i komunikacja z serwerem. Kod renderowany na serwerze i wyświetlana strona użytkownikowi. Tymczasem frontend poszedł w tym kierunku, że to wszystko robi się w przeglądarce za pomocą JavaScriptu i strony, które powinny być lekkie są mega ciężkie.

Oczywiście rozwiązanie typu SPA ma swoje zastosowania do bardziej skomplikowanych przypadków jak np. aplikacje bankowe, natomiast używanie potężnych frameworków do wyrenderowania prostej strony internetowej, czy nawet sklepu to być może przerost formy nad treścią. A może w tym całym IT nie chodzi o to, żeby coś zrobić, tylko żeby robić?

Nie wiem, natomiast jestem entuzjastą technologii i świadomych decyzji oraz upraszczania zamiast komplikowania dlatego byłem bardzo szczęśliwy gdy zobaczyłem, ze powstało coś takiego jak AHA stack. To doskonały przykład takiego podejścia, ze robisz mniej a dostajesz więcej. Prościej i szybciej. Jego filozofia opiera się na idei, że frontend powinien być przede wszystkim do komunikacji z serwerem i prezentowaniu treści użytkownikowi, a jądrem całego stacku jest – uwaga zaskoczenie: HTML!

AHA! Czyli można prościej?

AHA Stack jest idealny dla frontend developerów, którzy kochają React/JSX, ale chcą też więcej prostoty w życiu, generując HTML po stronie serwera i minimalizując ilość JavaScriptu po stronie klienta.

AHA Stack opiera się na podstawowych technologiach internetu: HTTP, HTML, CSS, JavaScript, serwerach i przeglądarkach internetowych, DOM, zdarzeniach przeglądarki, formularzach, FormData, XHR, fetch(), Request, Response oraz ciasteczkach. Są to kamienie milowe technologii internetowej, które są stabilne i niezmienniane od lat.

AHA Stack dodaje kilka fajnych rzeczy, które ulepszają doświadczenie w tworzeniu aplikacji webowych. Zamiast wymyślać koło na nowo, wykorzystuje powszechnie znane i fundamentalne technologie, ale dodaje się też coś ekstra, by sprostać współczesnym standardom użytkownika.

AHA stack - prostota

AHA! Ale jak to działa?

Nasz bohater, AHA Stack, wprowadza bibliotekę, która ułatwia zarządzanie połączeniami HTTP. Wyobraźcie sobie aplikację TODO, gdzie dodajesz element do listy zadań, a lista odświeża się bez przeładowania całej strony. To samo przy usuwaniu zadania. Brzmi znajomo? Tak, to właśnie cała idea aplikacji jednostronicowych (SPA)!

Biblioteka ta pozwala na wysyłanie dowolnych metod HTTP (POST, GET, DELETE, PUT, PATCH) do serwera, a także na serwowanie stron HTML przez serwer internetowy. Co ciekawe, nie ma tu miejsca na JavaScriptowe frameworki – serwer robi wszystko, old-school style!

Ale oczywiście, kiedy potrzebujemy więcej funkcji aplikacji, dodajesz „posypkę interaktywności JavaScriptu”. Używasz JavaScriptu lub biblioteki, która pomaga zarządzać tą interaktywnością.

AHA Stack dodaje dwa narzędzia do Platformy Webowej: łatwość komunikacji klient-serwer i dodawanie interaktywności po stronie klienta. To pozwala nam uciec od zawiłości frameworków SPA i budować lepsze, bardziej utrzymywalne aplikacje, szybciej.

A co to za narzędzia? Otóż, „AHA” to zestaw Astro, htmx, Alpine.js. Jak widać, AHA to nie tylko wyraz zaskoczenia, ale też skrót od narzędzi, które sprawią, że tworzenie aplikacji webowych będzie proste jak ABC!

Podsumowanie

W dzisiejszym felietonie przyjrzeliśmy się temu, jak AHA Stack zmienia reguły gry w świecie frontendu. Zamiast porywać się na skomplikowane, ciężkie rozwiązania typu SPA, AHA proponuje powrót do korzeni – prostoty i efektywności.

Pamiętaj, czasem kluczem do sukcesu jest… uprościć! Czy nie jest to świetna zachęta, by spojrzeć na Twoje projekty z nowej perspektywy? AHA Stack to więcej niż technologia – to filozofia, która może odmienić Twój sposób myślenia o frontendzie. Spróbuj, a może odkryjesz swój własny „AHA moment”!

Źródła

https://ahastack.dev/aha/1-stack-overview/

https://ahastack.dev/concepts/how-we-got-here/

https://ahastack.dev/concepts/html-first/

https://ahastack.dev/concepts/simplicity/

Zapisz się na newsletter i rozwijaj się w technologii i życiu​

W dynamicznym świecie startupów i rozwoju produktów łatwo stracić z oczu to, co naprawdę ważne: Twoje dobre samopoczucie i życie osobiste. Mój newsletter jest źródłem inspiracji dla właścicieli produktów, entuzjastów startupów i liderów technologicznych, którzy dążą do harmonii między ambicjami zawodowymi a satysfakcjonującym życiem osobistym.

Tutaj zagłębiam się w sztukę 'slow life’ – ruchu przeciwdziałającego nieustającemu kultowi pracy i multitaskingu. To nie chodzi o robienie mniej; chodzi o osiąganie więcej przez skupienie się na tym, co istotne.  Udostępniam wskazówki strategie i prawdziwe historie, które zainspirują Cię do tworzenia produktów, jednocześnie dbając o Twoje zdrowie, relacje i pasje.

Dołącz do mojej społeczności i odkryj, jak zrównoważyć ambicje i produktywność ze spokojem i dobrym samopoczuciem. 

Udostępnij post:

Możesz także polubić

Kariera w branży technologicznej: Jak rozwijać swoje umiejętności

Jesteś programistą i chciałbyś się rozwijać? W internecie znajdziesz pełno materiałów o tym, jak to zrobić. Pomimo tego nie uciekaj — mam coś, co Cię zaciekawi. Czy wiesz, że Adam Małysz — legendarny polski skoczek, zanim został mistrzem latania, to był dekarzem? Nie śmiem się porównywać z Panem Adamem, natomiast są dwie rzeczy, które nas łączą.

Ja też byłem dekarzem i też udało mi się przebranżowić. Może nie w tak spektakularny sposób, ale jednak. W tym artykule podzielę się z Tobą moim osobistym doświadczeniem, które zdobyłem na drodze od dekarza przez programistę do tech leada i dam Ci wskazówki, które będziesz mógł zastosować, aby się rozwijać i awansować, a może nawet zmienić diametralnie swoją karierę.

Czytaj więcej