Co to znaczy być front-end developerem w 2020 roku (i później)

Czy kiedykolwiek zastanawiałeś się, co tak naprawdę oznacza front-endowa część front-end developera ? Kiedyś zapytałem Erica Meyera (który tworzy strony internetowe prawie tak długo, jak istnieją strony internetowe), czy wiedział, co oznacza ten termin na początku, i odpowiedział, że tak. Nie jest to więc zupełnie nowy tytuł ani pozycja, ale z pewnością zmieniał się na przestrzeni lat.

​​„Front-end” zasadniczo oznacza przeglądarkę internetową. Uważam się za programistę front-end i szczerze nie znienawidziłbym, gdybyś nazwał mnie programistą przeglądarek internetowych. Ale to prawdopodobnie się nie przyjmie (i brzmi jak tworzenie przeglądarek internetowych). Jako programista front-end bardzo ściśle współpracujesz z przeglądarkami internetowymi i piszesz kod, który w nich działa, w szczególności HTML, CSS, JavaScript i kilka innych języków używanych przez przeglądarki internetowe (na przykład formaty multimedialne, takie jak SVG). Lub, być może nawet częściej wyjaśniany, kod, który ostatecznie jest przetwarzany na języki zrozumiałe dla przeglądarek. To twoje terytorium jako front-end developera!

Przeglądarki nie istnieją same, działają na szerokiej gamie urządzeń. Nauczyliśmy się tego w erze responsywnego projektowania. A co najważniejsze: użytkownicy korzystają z tych przeglądarek na tych urządzeniach. Nikt nie jest bliżej użytkownika niż front-end developerzy. Dlatego programiści front-end piszą kod dla osób korzystających z przeglądarek działających na wielu różnych urządzeniach.

Samo radzenie sobie z tym ogromnym krajobrazem użytkowników, urządzeń i przeglądarek to praca sama w sobie! Myślę, że nie każdego dnia myślisz filozoficznie o swoim stanowisku i to jest w porządku; po prostu robimy tu małą refleksję z twoim starym dziadkiem Chrisem.

​​Jeśli właśnie ukończyłeś kurs programistyczny, a twoje doświadczenie w tworzeniu stron internetowych jest dość wąskie i nowe, możesz wybaczyć, jeśli pomyślisz o rozwoju front-endu jako „rzeczy React”, a rozwoju back-endu jako „węźle rzeczy” lub „pythonowe rzeczy”, jak to są obecnie najgorętsze smaki. Ty też się nie mylisz. React jest powszechnie używany jako front-end framework (jest to dosłownie JavaScript, który działa w przeglądarkach). Node i Python to przykłady języków, które tak naprawdę nie działają w przeglądarkach internetowych; są zbudowane do działania na serwerach internetowych (uhh, komputerach).

Trzymaj się przez chwilę w tej dziedzinie, a zobaczysz te biblioteki, języki, procesy budowania i do cholery, nawet całe filozofie na temat tego, jak najlepiej budować strony internetowe, przychodzą i odchodzą jak powolna fala.

Możesz być świadkiem, jak jakiś weteran macha pięścią od czasu do czasu, krzycząc, że powinniśmy uczyć się na błędach z przeszłości. Możesz także być świadkiem, jak jakiś szczególnie hałaśliwy młodzieniec wymachuje równie wysoko pięściami, ogłaszając przeszłość jako nieistotny kontekst i nie będąc już użytecznym tematem do rozmów.

Prawdopodobnie obaj mają rację. Dopóki nikt nie jest nieprzyjemny, to wszystko jest częścią przepływu.

Rzeczy się zmieniają. Uważam, że to prawda, że ​​wiele dzisiejszych witryn jest bardziej złożonych niż witryny z przeszłości. Zwłaszcza te duże. Sieci społecznościowe i odtwarzacze multimedialne. Witryny rezerwacji podróży. Sklepy eCommerce. Narzędzia inżynierskie. Te witryny zaczęły się duże i tylko się urosły. Są gospodarkami samymi w sobie, wspieranymi przez ogromne zespoły. Ta złożoność jest przyczyną zmian w technologii internetowej i przyczyną tarcia między nową i starą szkołą (jeśli możemy to tak po prostu namalować).

​​Wiele osób, które pracują w branży technologicznej, pracuje w zasadzie dla dużej witryny internetowej. I tak najczęściej słyszymy od tych ludzi. Ci ludzie budują narzędzia. Piszą posty na blogach, chodzą na podcasty, wygłaszają prelekcje. Pomagają zmieniać samą technologię, by odpowiadała ich potrzebom.

​​Przez cały czas „front-end” to wciąż tylko przeglądarka. Języki przeglądarki, HTML, CSS i JavaScript są nadal podstawowymi technologiami w grze. Języki te ewoluują, podobnie jak same przeglądarki, ale wolniej. Działają zupełnie odwrotnie do ulubionego sloganu Doliny Krzemowej: poruszaj się szybko i niszcz rzeczy . Poruszają się powoli i bardzo rzadko coś łamią.

​​Bycie front-end developerem wciąż dba o użytkowników korzystających z tych przeglądarek na tych urządzeniach. Ich doświadczenie to nasza praca. Miejmy nadzieję, że narzędzia po prostu nam w tym pomagają.

Więc co robisz jako front-end developer?

• ​​Wykonasz projekt tak, aby wyglądał dobrze na każdym ekranie
• ​​Zastosujesz semantykę do treści
• ​​Tworzysz interfejs użytkownika w sposób abstrakcyjny, dzięki czemu możesz efektywnie ponownie używać części i stylów
• ​​Zastanawiasz się nad dostępnością tego, co renderuje w przeglądarce
• ​​Niepokoisz się wydajnością witryny, co oznacza, że ​​masz do czynienia z rozmiarem i liczbą zasobów używanych przez przeglądarkę.

Te rzeczy zawsze były i zawsze będą prawdziwe, ponieważ dotyczą one zasadniczo poziomu przeglądarki i tym właśnie jest front-end.

​​Zmienia się to, że przeglądarka może coraz więcej pracy. Istnieje wiele powodów takiego stanu rzeczy, takich jak coraz lepsze interfejsy API przeglądarek, bardziej wyrafinowane biblioteki i ogólnie lepsze komputery. Przerzucanie pracy z serwera na przeglądarkę na przestrzeni lat nabierało coraz większego sensu (aplikacje jednostronicowe!). Chociaż interesujące jest obserwowanie wahadła wahadłowego (wstępnie renderowane strony!) i znalezienie środka (JAMstack!).

Rozwój front-endu w dzisiejszych czasach może również obejmować:

• ​​Architektura całej witryny od najmniejszego komponentu do całych stron aż do poziomu adresu URL
• ​​Pobieranie własnych danych z interfejsów API i manipulowanie danymi w razie potrzeby do wyświetlenia
• ​​Samodzielne radzenie sobie ze stanem witryny
• ​​Mutowanie/zmiana danych poprzez interakcję użytkownika i wprowadzanie oraz utrzymywanie tych danych w stanie i z powrotem na serwery za pośrednictwem interfejsów API

To wszystko, co można teraz zrobić w przeglądarce, ku szerokiemu spojrzeniu tego starego programisty. To cholerna odpowiedzialność, jeśli weźmiesz pod uwagę, że jest to na szczycie wszystkich rzeczy, które już musisz zrobić.

​​Podczas gdy ten stog siana rośnie z biegiem lat, światło przewodnie, które mamy jako programiści front-end, nie zmieniło się aż tak bardzo. Naszym głównym obowiązkiem jest nadal dbanie o użytkowników korzystających z przeglądarek internetowych na urządzeniach. Więc musimy pobrać trochę danych. To super, robimy to w celu zbudowania szybkiej, semantycznej i dostępnej strony, która będzie spełniała potrzeby naszych użytkowników. Więc musimy zbudować system projektowania. To super, robimy to, aby zbudować zrozumiały interfejs dla naszych użytkowników, który będzie mógł ewoluować bez tworzenia niespójnego bałaganu. Więc musimy nauczyć się nowej nieznanej technologii. Cóż, naszym zadaniem jest baczne oko i upewnienie się, że ostatecznie pojawi się nowa rzecz, która poprawi naszą witrynę dla użytkowników.

Powodzenia!

Co dalej: dlaczego Chris Coyier wybiera Local i Flywheel do obsługi swoich witryn

Dowiedz się, jak Chris korzysta z funkcji Local i Flywheel, aby przenieść swoje witryny na wyższy poziom. Zobacz, jakie są jego ulubione funkcje, w jaki sposób korzysta z Flywheel do migracji swoich witryn (za darmo!) i wiele więcej! Kliknij tutaj, aby dowiedzieć się więcej.