front end
3 minuty czytania
Tomasz Kozon
17 sty 2023
Front-end to obszar informatyki, który odpowiada za projektowanie i tworzenie interfejsu użytkownika oraz funkcjonalności stron internetowych i aplikacji. Jest to element, który widzimy i odczuwamy, korzystając z różnego rodzaju serwisów internetowych, sklepów.
Front-end to wszytko to, co widzi użytkownik, wchodząc na witrynę internetową. Odpowiada za kwestię wizualną i funkcjonalność strony www lub aplikacji webowej oraz za budowę takiej struktury, która pozwoli na jak najefektywniejszą interakcję internauty z produktem. Z kolei back-end odpowiada za to, czego nie widać, a więc zapis i obróbkę danych po stronie serwera. Frontend to dziedzina programowania zajmuje się np. nawigacją główną i boczną, układem elementów graficznych i tekstowych czy wszelkimi funkcjonalnościami, które wpływają na poziom użyteczności i przyjemności podczas korzystania z witryny. Wszystkie te elementy zbudowane są na podstawi języków kodowania, jakimi są HTML, CSS oraz języka programowania JavaScript.
Programowanie front end
Front-end to dziedzina, którą zajmują się deweloperzy odpowiedzialni za zbudowanie, czyli zakodowanie stron www i aplikacja webowych, które przede wszystkim mają być szybkie i wygodne dla ich użytkownika oraz wyświetlać się poprawnie na urządzeniach o różnej rozdzielczości, a zatem być responsywne. Deweloperzy pracujący nad widokiem witryny wykorzystują różne biblioteki JavaScript, z których najpopularniejsze są Angular, React i Vue. Każda przeznaczona jest do tworzenia front-edu produktów o odmiennej wielkości i zastosowaniu. W Boring Owl korzystamy z wydajnej technologii React, która umożliwia tworzenie niezwykle szybkich i nowoczesnych aplikacji webowych. Dodatkowo front-end wymaga znajomości innych narzędzi do programowania, jakim są mi.in.: Gulp do automatyzacji zadań, Git do pracy w zespole w zdalnym repozytorium, SASS odpowiedzialny za kompilacje CSS oraz Webpack, Npm i Node.js oferujące szeregów przydatnych usprawniających pracę narzędzi. Biblioteki te są niezwykle przydatne, ponieważ zawierają gotowe kody odpowiadające za automatyzacje i funkcjonalności, dzięki czemu programiści nie tracą czasu na ich napisanie ich od podstaw. Ponadto u developerów tego typu ważna jest także wiedza z zakresu UI i UX, aby mogli oni tworzyć przyjazne użytkownikowi interfejsy.
Czym zajmuje się frontend developer?
Front-end developer buduje strony WWW i aplikacje webowe, skupiając się na ich elementach wizualnych i funkcjonalnościach. Powinien on dostarczyć witrynę estetyczną i przejrzystą, a przede wszystkim użyteczną. Obecnie najczęściej projektuje się strony dynamiczne, które pozwalają użytkownikom wejść w interakcję z witryną. Jednak dla mniejszych stron firmowych można zbudować witrynę statyczną, która pojawia się wyszukiwarce dokładnie w ten sam sposób, w jaki jest przechowywana na serwerze. Ten rodzaj witryny nie zawiera żadnych elementów, które umożliwiałyby interakcję z użytkownikiem.
Front-end developerzy często posiadają wiedzę z zakresu User Experience i User Interfejs. Dzięki temu mogą budować nie tylko przyjemną dla oka szatę graficzną strony, ale i maksymalnie uprościć proces poruszania się użytkownika po witrynie. Jego praca polega zatem na budowie układów podstron i poszczególnych bloków, tworzeniu intuicyjnej i łatwej w użyciu nawigacji oraz przyciągnięciu uwagi użytkownika za pomocą ciekawej grafiki czy animacji.
Języki i technologie front end
Front-end developer używa kilku języków programowania. Pozwalają one napisać mu instrukcje dla komputera na temat tego, jak powinny wyglądać i gdzie się znajdować poszczególne elementy witryny. Podstawowe języki front-endu to:
- HTML (Text Markup Language), czyli język kodowania znaków, który umożliwia tworzenie struktury witryny internetowej;
- CSS (Cascading Style Sheets), który odpowiada za wygląd witryny, a zatem określa kolory i pozycje poszczególnych elementów na stornie, rodzaj i wielkość czcionek, a nawet pozwala tworzyć ciekawe efekty i animacje;
- Java Script to podstawowy język front-end, który pozwala wprowadzić na stronie ciekawe funkcjonalności oraz sprawić, aby użytkownik mógł wejść z nią w interakcję.
Dodatkowo front-end developer korzysta z wielu frameworków i bibliotek, które znaczne usprawniają pracę i optymalizują długość kodu, z których przykładowe to:
- Angular;
- React;
- Vue;
- Bootstrap.
Umiejętności front-end developera
Dobry front-end developer obeznany jest również z narzędziami do automatyzacji i optymalizacji kodu, a najważniejsze umiejętności, które powinien posiadać to:
- podstawowa wiedza z zakresu back-endu;
- minimum średniozaawansowana znajomość języka angielskiego;
- umiejętność łączenia ciekawych wizualnie form i optymalnych rozwiązań technicznych;
- znajomość narzędzi do automatyzacji takich jak GULP, Git, Node.js, Webpack czy Babel;
- znajomość preprocesorów SASS lub LESS;
- podstawowa znajomość UX i UI;
- znajomość CMS-ów takich jak WordPress, Drupal czy Joomla.
Powiązane artykuły
Jam Stack – przełom czy dobrze znana technologia?
17 lut 2022
Jam Stack to technologia, która polega na budowaniu aplikacji internetowych za pomocą statycznie generowanych stron, które są hostowane na serwerach CDN. Jest coraz bardziej popularny wśród programistów, ponieważ oferuje wiele korzyści, takich jak szybkość, niskie koszty utrzymania i bezpieczeństwo.
Tomasz Kozon
#front-end

Optymalizacja wewnętrza strony www. czym jest seo on-site?
6 sty 2022
Optymalizacja wewnętrzna strony internetowej, znana również jako SEO on-site, to proces polegający na dostosowaniu elementów strony internetowej takich jak treść, meta tagi, adresy URL, nagłówki i linki wewnętrzne, aby pomóc w pozycjonowaniu strony w wynikach wyszukiwania.
Tomasz Kozon
#front-end