Фронтенд vs Бэкенд

Обращаясь в компанию занимающуюся разработкой сайта, Вы наверняка услышите эти слова, но что они обозначают и для чего нужны? Давайте разберемся! Начнем с определений:

Фронтенд – это та часть сайта которая выводится на экран средствами браузера. Браузер «умеет» обрабатывать файлы HTML, CSS и JavaScript.

• HTML – файл в котором браузер получает указания какую информацию содержит страница.
• CSS – файл содержащий указания по отображению различных элементов страницы. Например, что заголовок страницы должен быть зеленого цвета, а следующий текстовый блок должен располагаться на 20 пикселей ниже.
• JavaScript – в этом файле содержатся указания по поведению некоторых элементов страницы, при взаимодействии с ними пользователем. Такие, как всплывающие окна или слайдеры.

Бэкенд – это скрытая от пользователя часть сайта, обрабатываемая сервером.

Для написания бэкенда сайта можно использовать один из универсальных языков программирования Ruby, PHP, Python, Java. Не мало важной частью бэкэнда является связь сайта с базой данных и управление ей.

Так как же они связаны?

На данный момент существует несколько видов взаимодействия фронтенда и бэкенда:

Серверные приложения

В данном варианте взаимодействие осуществляется напрямую с сервером при помощи HTTP-запроса, в качестве ответа сервер отдает HTML-страницу. После получения запроса, сервер обрабатывает запрос, находит в базе данных  соответствующие 

 ему записи, после чего встраивает эти записи в подготовленный шаблон. Далее собранная страница загружается в браузер, где с помощью HTML, CSS b JavaScript определяется ее вид и поведение.

Связь с сервером при помощи AJAX

Следующий вид взаимодействия использующийся для связи с сервером это AJAX.

Он предпологает, что браузер обрабатывает JavaScript, который отправляет HTTP-запрос и в ответ получает XML, при этом не производя перезагрузку страницы. Все обновления данных на странице сайта происходят на стороне клиента не производя обновление страницы в браузере.

В таком виде связи с сервером фронтенд будет связан с бэкендом через HTTP.

Универсальный  вид

Используя специальные библиотеки, такие как React и Ember, можно исполнять сценарий сайта как на сервере так и браузере. Для связи фронтенда с бэк эндом в этом случаем будет использоваться AJAX.