Czym się różni backend i frontend? Poznaj 7 różnic.
Poznaj najprostsze wytłumaczenie, czym jest backend, a czym jest frontend. Jeśli we współpracy z firmą IT będziesz mieć do czynienia z takimi określeniami, będziesz dokładnie wiedzieć o co chodzi. Być może znasz już te pojęcia, ale chętnie poznasz szczegóły praktyczne, bo nie interesuje Cię sucha teoretyczna definicja? Przejdźmy zatem do konkretów, czyli 7 różnic pomiędzy back-endem, a front-endem.
Różnica 1: Widoczność
Backend to to, czego nie widzisz na stronie, gdy ją oglądasz. Element backendu może stanowić np. kod strony lub aplikacji napisany przez programistów albo połączone z nim bazy danych, czyli to wszystko co dzieje się i co działa „w tle”.
W odróżnieniu od backendu frontend jest widoczny dla użytkownika. Zdjęcia, grafika, przyciski, kolory, tekst, hiperłącza, czy animacje to przykłady elementów, które wyświetlają strony internetowe, aplikacje mobilne, czy inne systemy IT. Za te elementy i ich wygląd odpowiada właśnie warstwa frontendowa.
Różnica 2: Miejsce akcji
Back-end to to, co dzieje się na serwerze. Zadania warstwy backendowej są realizowane na serwerze, często umieszczonym np. w chmurze setki lub nawet tysiące kilometrów od Ciebie. Treść, którą teraz czytasz jest przechowywana właśnie na takim serwerze w bazie danych.
Front-end to to, co dzieje się w przeglądarce internetowej. Warstwa front-endowa jest wyświetlana w przeglądarce zainstalowanej na urządzeniu, z którego korzystasz. Może to być smartfon, tablet, komputer stacjonarny lub inne urządzenie. Efekt prac programistów frontend widzisz po prostu na ekranie swojego urządzenia. Tekst, który teraz czytasz na ekranie, jego kolor, rozmiar, czy krój czcionki to wszystko są elementy frontendu.
Różnica 3: Wykonywane zadania
Backend wykonuje określone, zaprogramowane przez programistów zadania, na podstawie danych otrzymanych z frontendu od użytkowników. Odpowiada za ich zapis i obróbkę. Przykładowo backend przechowuje w bazie danych treść tego zdania, które właśnie czytasz i wyświetla je Tobie, na podstawie otrzymanego żądania z Twojej przeglądarki. Innym przykładem zadania może być wykonanie obliczenia wartości produktów dodanych do koszyka w sklepie internetowym z uwzględnieniem należnego użytkownikowi rabatu.
Frontend odpowiada za pobieranie informacji od użytkowników i przekazywanie ich do backendu. Przykładowo, gdy dodajesz produkty do koszyka w sklepie internetowym i składasz zamówienie to właśnie poprzez np. formularz dane zostają przekazane z frontendu na backend i zapisane w bazie danych. Innym przykładem zadania wykonywanego przez frontend jest prezentacja danych, np. w formie wykresów na podstawie danych otrzymanych z backendu.
Różnica 4: Praca z danymi
Backend zajmuje się zapisem, przechowywaniem oraz dostarczaniem danych z bazy danych na stronę lub do aplikacji frontowej. Treść tego zdania została dostarczona do bloga przez backend z bazy danych umieszczonej na naszym serwerze w chmurze.
Frontend zajmuje się wyświetlaniem użytkownikom wyników otrzymanych z backendu. Gdy na tym blogu wybierasz artykuł do przeczytania klikając na jego tytuł, to właśnie frontend generuje zapytanie do backendu o wyświetlanie treści wybranego przez Ciebie artykułu.
Różnica 5: Odpowiedzialność
Back-end jest odpowiedzialny za logikę kryjącą się za daną aplikacją. Upraszczając odpowiada on za to, co wydarzy się na serwerze np. po kliknięciu na przycisk „Zapisz”, „Wyślij”, „Zamów”, „Usuń”, „Anuluj” itp. Może to być na przykład zapisanie się do newslettera, wysłanie wiadomości poprzez formularz kontaktowy, złożenie zamówienia, usunięcie produktów z koszyka, czy anulowanie określonego działania w aplikacji.
Front-end odpowiada za wygląd danej aplikacji, stron internetowych, aplikacji mobilnych, czy innych systemów IT. Dodatkowo frontend jest odpowiedzialny za interakcję z użytkownikiem, np. zmianę koloru przycisku po najechaniu na niego kursorem itp.
Różnica 6: Praca dla programistów
Programiści backend najczęściej zajmują się takimi zadaniami, jak np. pisanie kodu odpowiedzialnego za logikę działania aplikacji, tworzenie API, tworzenie baz danych, komunikację z bazami danych, wykorzystywanie zewnętrznych baz danych (integracja z bazami danych), bezpieczeństwo danych, wydajność itp.
Programiści frontend koncentrują się najczęściej na technologiach odpowiedzialnych za warstwę wizualną aplikacji takich, jak HTML, CSS i JavaScript wraz z różnymi jego modyfikacjami. Upraszczając HTML odpowiada za strukturę i zawartość elementów na stronie, czy w aplikacji, CSS odpowiada za styl i wygląd, a JavaScript za interakcje z użytkownikami.
Różnica 7: Kryteria oceny jakości
Po czym poznać dobrej jakości kod występujący po stronie backendu? Kryteriami oceny backendu są m.in.:
- wydajność systemu
- szybkość działania aplikacji
- skalowalność systemów IT
Dobrze przygotowaną warstwę frontendową cechuje przede wszystkim:
- wysoka ergonomia
- intuicyjna obsługa
- nowoczesna i lekka szata graficzna
- wysoki poziomem estetyki
- wysoka użyteczność
- dostępność i…
- to, że jest po prostu ładna
Porównanie backend i frontend - podsumowanie
Spójrzmy na podsumowanie 7 różnic pomiędzy backendem, a frontendem przedstawionych w poniższej tabeli.
Ta strona korzysta z ciasteczek, aby zapewnić Ci najlepszą możliwą obsługę. Informacje o ciasteczkach są przechowywane w przeglądarce i wykonują funkcje takie jak rozpoznawanie Cię po powrocie na naszą stronę internetową i pomaganie naszemu zespołowi w zrozumieniu, które sekcje witryny są dla Ciebie najbardziej interesujące i przydatne.
Ściśle niezbędne ciasteczka
Niezbędne ciasteczka powinny być zawsze włączone, abyśmy mogli zapisać twoje preferencje dotyczące ustawień ciasteczek.
Jeśli wyłączysz to ciasteczko, nie będziemy mogli zapisać twoich preferencji. Oznacza to, że za każdym razem, gdy odwiedzasz tę stronę, musisz ponownie włączyć lub wyłączyć ciasteczka.