Front-end i Back-end
Czym są? Jakie posiadają różnice? Co je charakteryzuje i który kierunek wybrać? W tym wpisie postaram się odpowiedzieć na wszystkie te pytania.
Zapraszam 🙂
Wyobraźmy sobie, że posiadamy sklep internetowy z systemem rejestracji i składania zamówień.
Podstawą do stworzenia takiego sklepu są dwie rzeczy:
- Warstwa wizualna
- Silnik sklepu
To właśnie nazywane jest Front-endem i Back-endem. Jak sama nazwa wskazuje – to co jest na Froncie to wszystko to, co widzimy. Zdjęcia, przyciski, napisy, kolory, animacje. Natomiast to co znajduje się we wnętrzu strony, z tyłu, czyli Back-end, to cały silnik strony. Odpowiada on za sposoby działania całego sklepu. Mówi on co ma się stać gdy naciśniemy przycisk, złożymy zamówienie, zarejestrujemy się.
Powyższy obrazek doskonale odzwierciedla różnice obu stron. Front-end musi być ładny, przyjemny dla oka i zachęcający użytkownika do korzystania ze strony. Back-end natomiast to cały silnik strony, który zarządza danymi, łączy się z bazą danych, wykonuje jakieś akcje na serwerze strony.
Może niektórzy z was zauważyli, że w zakładce O mnie lub w tejże kategorii na moim Portfolio napisałem, że chcę zostać Full-stack developerem. Full-stack, jak sama nazwa wskazuje znaczy wszystko, czyli programistą zajmującym się i Front-endem i Back-endem. Osobą, która dba i o warstwę wizualną i o sposób działania strony.
Z czego składa się Front-end?
Głównymi filarami Front-endu są:
- HTML
- CSS
- JavaScript
Prócz tego wyróżniamy preprocesory, biblioteki i frameworki, ale to jest temat na inny wpis i nie będę wam zawracał tym głowy.
Omówmy więc pokrótce każdy podpunkt.
HTML – jest to język, którym definiujemy co ma się pojawić na stronie. Przykładowo zdjęcie, przycisk, prostokąt, napis itp.
CSS – za jego pomocą opisujemy jak ma wyglądać treść stworzona w HTML’u. Na przykład zdjęcie ma mieć rozmiary 300×400 pikseli, przycisk ma się powiększyć po najechaniu myszką, prostokąt ma mieć czerwony kolor, a napis ma być pogrubiony i podkreślony.
JavaScript – najbardziej rozbudowany segment z wszystkich wyżej wymienionych. Pozwala na zrobienie rzeczy, na które nie pozwala nam HTML i CSS. Na przykład pozwala po naciśnięciu przycisku zmienić kolor prostokąta z czerwonego na niebieski, a zdjęcie z krajobrazu Paryża na portret Jeffa Bezosa.
Z czego składa się Back-end?
Tutaj sprawa się trochę bardziej komplikuje, gdyż Back-end jest dużo bardziej rozbudowany i nie dałbym rady wypisać tu wszystkich języków i technologii, których możemy użyć. Wymienię jednak te najważniejsze, które wykorzystujemy do tworzenia stron internetowych:
- PHP
- C# .NET
- Node.js
- MySQL
PHP, .NET i Node.js są najpopularniejszymi technologiami na świecie jeśli chodzi o Back-end. Ich działanie i możliwości bardzo się różnią, ale każda technologia odpowiada za to samo, czyli silnik strony. Dzięki nim możemy łączyć się z bazą danych, serwerem, przechowywać i pobierać dane. Możliwości są ogromne, ogranicza nas tylko kreatywność.
MySQL – jest to system zarządzania bazami danych, które obsługiwane są w języku zapytań SQL. Dzięki bazie danych możemy przechowywać informacje na temat użytkowników zarejestrowanych na naszym serwisie lub na przykład informacje o produktach dostępnych w naszym sklepie. Lub posty na blogu, takim jak ten 🙂
I to wszystko, jeśli chodzi o ogólny opis wszystkich najważniejszych technologii. Dużo tego, to prawda i na początku może się wydawać trudne, ale gdy spędzimy trochę czasu z programowaniem to wszystko załapiemy w krótkim czasie.
Gdyby ktoś nadal miał pytania i wątpliwości – zapraszam do kontaktu. Chętnie odpowiem na wszystkie pytania.
0 komentarzy