Subiektywny ranking frameworków dla Front-End Dewelopera!

Framework to nic innego, jak gotowy szkielet, na podstawie którego Front-End Developer buduje gotowe rozwiązania programistyczne. Składa się z gotowych komponentów, takich jak: siatka oraz biblioteki, na których deweloper opiera projekt. Mówiąc w skrócie, jest to narzędzie, które umożliwia wdrażanie stron internetowych czy aplikacji webowych. Zapraszamy na subiektywny przegląd najlepszych frameworków dla front-endowca.

Bootstrap 3 vs Bootstrap 4!

Bootstrap, czyli aktualnie najpopularniejszy framework stworzony przez programistów Twittera. Na oficjalnej stronie internetowej programu możemy przeczytać, że “jest to program stworzony przez nerdów dla nerdów”. Framework oparty jest na prostej intencji dostarczenia elastycznych reguł CSS do tworzenia layoutów. Bootstrap bazuje na gotowych rozwiązaniach HTML oraz CSS. Dodatkowo korzysta z języka JavaScript, który umożliwia dodanie dynamiki do gotowych już elementów czy obsługę okien modalnych. W przypadku tego frameworka, w pierwszej kolejności tworzymy wersję desktopową naszej aplikacji, a dopiero później dostosowujemy ją do wersji mobilnej przy wykorzystaniu Media Queries.

Struktura Bootstrapa oraz fakt, że został zbudowany na preprocesorze SASS, umożliwiają dostosowanie go do własnych potrzeb. Posiada bogaty pakiet UI, w skład którego wchodzą: typografia, formularze, tabele, nawigacje i ikonki.

Większość deweloperów z ogromną niecierpliwością czeka na kolejną wersję Bootstrapa. Co prawda, nie znamy daty premiery młodszego dziecka Twittera, ale na oficjalnym blogu pojawiła się, jakiś czas temu, informacja o możliwości testowania pierwszej wersji beta. Oto kilka zmian, które zostaną wprowadzone w nowej wersji:

  • zostanie wyposażona w nowy preprocesor – SASS ze składnią SCSS
  • piksele zastąpi rem, jako główna jednostka “miary”
  • zostanie zwiększony podstawowy rozmiar fonta 14px do 16px (1rem)
  • Flex Box Gird
  • będzie wspierać ES6, co znaczy, że pojawi się możliwość kompilowania (Babel)

Semantic UI

Kolejny framework godny uwagi. Pojawił się na rynku kilka lat temu i od razu okazał się świetną alternatywą dla Bootstrapa. Semantic UI to gotowy zestaw fragmentów kodu, oparty o LESS, który wspiera tworzenie interfejsu użytkownika. Najważniejszą zaletą tego frameworku, w porównaniu do Bootraspa, jest możliwość pobierania pojedynczych elementów. Co w konsekwencji sprawia, że jest bardzo lekki. Dodatkowo komponenty w frameworku są od siebie zdecydowanie bardziej niezależne. Poza tym umożliwia kategoryzowanie plików.

Porównując narzędzie z Bootsrapem, musimy zwrócić uwagę, na kilka ważnych minusów:

  • każdy element na stronie należy inicjować skryptem
  • przeciążenie klas
  • cały framework bardzo dużo waży jeśli chcemy wszystkie pliki od razu umieścić w assets.

Foundation

Foundation, czyli pierwszy ogólnodostępny framework wspierający responsywność! W przeciwieństwie do Bootstrapa aplikacja umożliwia wdrożenie interfejsu graficznego według zasady mobile – first. Foundation został stworzony przez ZURB w 2011 roku z wykorzystaniem preprocesora SASS. Obydwa wykorzystują metodę media-view, ale do różnych celów.

Dzięki możliwości stworzenia specyficznej siatki, którą nazywa się siatką blokową, możemy stworzyć szybki podział na kolumny oparty o listę w HTML. Zawiera pełen zestaw elementów UI i skryptów JS.

To nie wszystko!

Oczywiście na rynku dostępnych jest kilka, a nawet kilkanaście frameworków, które wspierają pracę Fron-End Deweloperów. W naszym zestawieniu znalazły się trzy najpopularniejsze. Niepodważalnym faktem jest, że Bootstrap zajmuje pierwsze miejsce na podium. Twór od Twittera zaskarbił sobie serca wielu deweloperów na całym świecie. Foundation, czyli wieczny numer dwa, zdecydowanie wart uwagi, chociażby ze względu na regułę mobile-first. No i Semantic UI najmniej znany, ale nadal godny polecenia. A wy, na jakich frameworkach pracujecie?