Kategoria:Nauka

Frontend jest trudny

  • Czas potrzebny na przeczytanie:8 minut
  • Opublikowane:

Frontend? To nie programowanie, tylko centrowanie głupich divów! Jesteś Frontend Developerem? Nie jesteś prawdziwym programistą, jesteś tylko skrypterem. Nie wiem za co ci Frontend Developerzy dostają pieniądze, przecież to łatwizna!

Ehhh...

Nie zliczę ile razy usłyszałem podobne stwierdzenia.

Czekaj, czekaj - mam jeszcze jedno dobre!

Na bootcampie powiedzieli mi, że ogarnę Front w 3 miesięce, potem jeszcze kilka na Backend i lecę po Fullstacka!

Tego typu teksty pojawiają się najczęściej na grupach i forach dla programistów, ale nie jest to regułą. Kilkukrotnie spotkałem się z podobnymi teoriami przy przysłowiowym piwku, na programistycznych meetupach.

Jak to w końcu jest z tym Frontendem?

Niski próg wejścia

Chcesz zacząć uczyć się programowania? Na start najłatwiejszy będzie Frontend.

Faktycznie, jeśli dopiero stawiamy swoje pierwsze kroki w IT, to Front wydaje się łakomym kąskiem, żeby przetrzeć szlaki.

Bardzo dużo osób gdzieś na etapie swojego życia liznęło trochę HTML. Nie ma to jak lekcje informatyki w szkole średniej i tworzenie pliku strona.html z tekstem Hello World.

Często Frontend jest też naturalnym wyborem dlatego, że praktycznie natychmiastowo widzimy zmiany i progres tworzonej strony. Piszemy kilka linijek HTML i już efekt wow - coś się wyświetliło na ekranie! Jakie zdziwienie będzie jak zmienimy kolor tekstu.

Pozorna prostota

To jest naprawdę super. Nieironicznie mogę powiedzieć, że ten niski próg wejścia to świetna sprawa. Zachęca wielu ludzi do wejścia w temat, pozwala pochwalić się wynikami i powiedzieć - mamo, jestem koderem!

Ale nie wszystko jest tak kolorowe, jak Twoja pierwsza strona w HTML. Sucho, wiem.

Ta pozorna prostota jest bardzo, ale to bardzooo często zgubna. Po sobie i dziesiątkach spotkanych raczkujących devów wiem, że jak jest za łatwo, to jest źle.

Co łączy profesjonalnych graczy i początkujących programistów? Speedrun.

Dosłownie tak wygląda droga wielu zaczynających Frontend Developerów. Kilka godzinek HTML na YouTube, potem może z kilka dni na stylach, żeby ogarnąć tego flexboxa i lecimy dalej.

Problem w tym, że wiele rzeczy jest w ten sposób pomijanych. Nie mówię tutaj nawet o jakiś super zaawansowanych tematach, ale teoretycznie o banalnych technologiach jakimi są HTML i CSS.

Uwaga, teraz będzie mocne - 80% Frontend Developerów nie zna dobrze HTML.

Co prawda te statystyki dostarczył mi pewien znany instytut, ale opieram się bardziej na własnych doświadczeniach.

Pociągnijmy temat tego nieszczęsnego HTML:

  • Semantyczne tagi to do SEO są, żeby stronka się fajnie pozycjonowała.
  • Accessibility. Access... co? Daj spokój, kto by się tym przejmował.
  • Nagłówki? No układamy od największego (h1) do najmniejszego (h6), no nie?
  • Tekst alternatywny do zdjęć? Po co jak fotka mi się zawsze ładuje?

Oczywiście z przymrużeniem oka, ale mógłbym tak wymieniać i wymieniać...

Nie chodzi mi, żeby komuś umniejszać. Uczymy się całe życie i każdy z nas ma braki, nic w tym niezwykłego.

Celem tej całej szydery jest to, że nawet z pozoru proste technologie skrywają wiele złożoności, pod pokrywą lodu...

Frontendowy Iceberg

Założę się, że gdzieś mogłeś się spotkać z konceptem góry lodowej. To, co widoczne jest znane, pospolite, często oczywiste. Co kryje się pod taflą wody jest tajemnicze, nieodkryte, trudne.

Na potrzeby tego artykułu możemy puścić wodze fantazji i poznać nieco frontendowego iceberga.

Oczywiste oczywistości, czyli wierzchołek góry lodowej. Wszystko co znamy, wszystko o czym kiedyś słyszeliśmy. Zestaw technologii, które pozwolą nam stworzyć działającą stronę / aplikację webową.

  1. HTML

    Wiadomo, stary dobry HyperText Markup Language.

    Podstawa każdej strony internetowej, nic dodać, nic ująć.

  2. CSS

    Style razem ze swoją całą okazałością. Tworzenie layoutów, dodawanie kolorków, centrowanie divów. Dorzućmy do tego zestaw przydatnych narzędzi. Sass, Bootstrap, Tailwind, CSS-in-JS, CSS Modules...

  3. JavaScript

    Jakby to powiedzieli programiści innych języków - tu już się zaczyna prawdziwe programowanie. Chociaż niektórym mogłoby to nie przejść przez gardło. Złośliwi by powiedzieli, że jest do wszystkiego i do niczego.

    Trzeba na pewno przyznać mu jedno - kompletnie zawładnął światem i jest aktualnie jednym z najpopularniejszych języków programowania na świecie. Nie jest idealny, ale nic takie nie jest.

    Nie jest też prosty, wbrew pozorom. Możesz się go uczyć latami a i tak w końcu trafisz na moment, w którym powiesz WTF?! Co tu się odwala?

    JavaScript - jedyny w swoim rodzaju, język który można uwielbiać i nienawidzić jednocześnie. Pełen dziwactw i trudnych do zrozumienia konceptów.

  4. Framework

    Jak jest JS to i musi być jakiś framework. Jest z czego wybierać, to na pewno. Możemy się śmiać, że codziennie na rynku pojawia się nowe, rewolucyjne narzędzie do rozwiązywania tych samych problemów. Prawda jest jednak taka, że na rynku dość gruntownie ustatkowali się trzej królowie - React, Vue i Angular.

    Fundamentalnie podobne, a jednak kompletnie inne. Każdy z nich posiada wady i zalety, problemy i niedociągnięcia, które trzeba ogarnąć. Składnia to jedno, ekosystem drugie. W każdym z nich znajdziesz masę bibliotek i dodatków, które trzeba znać.

Co kryję się niżej? Co jest trudne, nieoczywiste, niezrozumiałe?

  1. Narzędzia

    Oho, zaczyna się z grubej rury. Współczesny Frontend stoi masą narzędzi i jakbym miał to wszystko wymieniać, to musiałbym skelić osoby wpis.

    Problem w tym, że taka lista po krótkim czasie nie byłaby aktualna. To naprawdę szybko się zmienia. Tworzone są nowe narzędzia, które ułatwiają i przyspieszają pracę.

    Przykładem może być wykres zainteresowania narzędziami do budowania kodu:

    Co prawda wykres z faktycznym wykorzystaniem wygląda nieco stabilniej, ale nie zmienia to diametralnie sytuacji.

    We Frontendzie musimy z jednej strony bardzo uważać na tzw. hypetrains, nie wpadać w pułapkę chwilowych trendów. Z drugiej to naprawdę dynamiczna specjalizacja, w której zbyt długie "nie bycie na czasie" może skutkować poważnymi brakami.

  2. Brak kontroli nad środowiskiem

    Najróżniejsze urządzenia i przeglądarki - masakra.

    Ponownie, problem może wydawać się wyolbrzymiony. Naukę o responsywności zaczynamy w początkowych etapach. Dostosowanie strony pod różne rozdzielczości to standard, nic nadzwyczajnego.

    Sęk w najróżniejszych przeglądarkach i ich wersjach. Nie zliczę godzin jakie poświęciłem na naprawianie i debugowanie błędów na Safari. Nie wspominam już o Frontend Developerach, którzy mają przyjemność wspierać stare wersje Internet Explorer - tak, takie systemy nadal istnieją i są utrzymywane.

  3. Accessibility

    Temat, o który już nieco wcześniej zahaczyłem. Dostępność nadal jest bardzo niszowym zagadnieniem, po które nie wszyscy ochoczo sięgają. Jednak sytuacja, a właściwie świadomość programistów, ostatnimi czasy się zmienia, co bardzo mnie cieszy :)

    Ktoś mógłby powiedzieć, że nawet jeśli to takie trudne, to tylko niepełnosprawni, więc nie trzeba się przejmować...

    Prawda jest zupełnie inna i dostępny system to dobry User Experience, dla każdego.

    Zadaniem Designerów jest przygotowanie zrozumiałego i czytelnego interfejsu. Twoim jest zrobienie go tak, żeby każdy mógł z niego skorzystać. Niezależnie, czy ktoś korzysta wyłącznie z myszki, klawiatury, czy czytnika ekranowego.

  4. Performance

    Świat pędzi w zawrotnym tempie. Chcemy wszystko na teraz, natychmiast. Media społecznościowe dostarczają nam tysiące różnych bodźców każdego dnia. Chcą przyciągnąć i zachować naszą uwagę.

    W takich realiach nie możemy sobie pozwolić na bycie powolnymi.

    Jak udowodnił chociażby Amazon, czy Walmart wydajność produktów ma bezpośredni wpływ na biznes. Google od dłuższego czasu bierze pod uwagę Core Web Vitals przy pozycjonowaniu stron.

    Dlatego dbanie o jak najlepszy User Experience, a co za tym idzie o performance, jest tak bardzo ważne.

    Cała społeczność Frontendu ciągle dąży do maksymalizowania wydajności. Optymalizujemy nasze strony i aplikacje, non stop.

    Nie należy to rzeczy banalnych. Czynników jest masa, a to wszystko musimy ogarnąć my, Frontend Developerzy.

  5. Design

    Olaf, przecież Frontend Developer nie musi znać się na UI/UX!

    To prawda, nie musisz być mistrzem projektowania, żeby być dobrym Frontend Developerem.

    Nie zmienia to jednak faktu, że Frontend leży pomiędzy kodem, a Designem. To my, we współpracy z Designerami i Copywriterami, mamy bezpośredni wpływ na odczucia naszych użytkowników.

    Razem tworzymy produkty, które ludzie pokochają lub znienawidzą. Nasza rola w tym, żeby połączyć świat projektu ze światem rzeczywistym.

    Dbanie o funkcjonalną stronę aplikacji, interakcje, kolaboracja z Designerami, tworzenie spójnych Design Systemów - to rzeczy nieoczywiste i wbrew pozorom nie takie proste.

  6. Dobre praktyki, skalowanie software'u, testy

    Frontend w porównaniu do Backendu jest dość ograniczony, jeśli chodzi o zasady, których powinniśmy się trzymać.

    Oczywiście, istnieje szereg wzorców, dobrych praktyk i zasad, które są uniwersalne - niezależnie nad jakim kodem pracujemy.

    Jednak rzeczywistość nie wygląda tak kolorowo i pewne praktyki dla warstwy UI się nie sprawdzają. Frontend w wielu miejsach rządzi się swoimi prawami. Posiada zestaw własnych, unikatowych problemów, z którymi musimy sobie radzić.

    Prowadzić to może do sytuacji, w których piszemy słabo skalujący się kod, wykorzystując utarte schematy z innych dziedzin programowania. Z drugiej strony, często szukamy tego właściwego rozwiązania, niekiedy wynajdując koło na nowo.

Nasza góra lodowa jeszcze nie dotknęła dna. Frontend jest bardzo obszerny i zróżnicowany. Zagadnień, o których tutaj nie wspomniałem jest dużo, dużo więcej...

Dlaczego o tym piszę?

Patrzę na ten temat z dwóch perspektyw.

Z jednej strony mam przed oczami osoby, które twierdzą, że Frontend to nie programowanie, a Frontend Developerzy nie są prawdziwymi programistami.

Czy aż tak bardzo żal mi dupę ściska na widok podobnych komentarzy? A może boli mnie to, że nie jestem tym prawdziwym, prawilnym programistą?

No nie do końca...

W 100% zdaję sobie sprawę, że większość tego typu komentarzy to zwykły trolling.

Istnieje jednak grupa osób, która inaczej na to patrzy i faktycznie uważa tworzenie UI za coś banalnego. Czy wynika to z ich poprzednich, dawnych doświadczeń? A może ktoś im tak powiedział i uwierzyli?

Analizując to całe zamieszanie, doszedłem do jednego wniosku.

Osoby, które twierdzą, że Frontend jest łatwy, po prostu go nie znają.

Odważne, wiem.

Podsumowanie

To jak to w końcu jest z tym Frontendem? Trudny czy łatwy? ;)

Jeśli jesteś Frontend Developerem to wiedz, że to co robisz, to żadna zniewaga. Frontend to skomplikowana dziedzina, wymagająca nieco innego, wcale nie gorszego, podejścia do wytwarzania oprogramowania - nie daj sobie wmówić, że jest inaczej.

Do usłyszenia!

O autorze

Olaf Sulich

Olaf jest Frontend Developerem, blogerem i nosi rybacki kapelusz 🎩 Pisze o wszystkim co związane z frontendem, ale nie boi się backendu i designów 🦾 Ma głowę pełną pomysłów i nadzieję, że znajdziesz tutaj coś dla siebie!

Dołącz do społeczności!

Bo w programowaniu liczą się ludzie

Wchodzę