Prog Academy
RU UA
Веб-разработка

Что такое frontend?

Frontend — это часть сайта или приложения, которая выполняется в браузере пользователя: вёрстка, стили, анимации и вся логика интерфейса. Всё, что человек видит и с чем взаимодействует, — зона ответственности фронтенда.

Базовый набор фронтенд-разработчика — HTML, CSS и JavaScript, поверх которых работают фреймворки вроде React, Vue или Angular. К ним добавляются адаптивная вёрстка под разные экраны, доступность, оптимизация скорости загрузки и работа с макетами дизайнера.

Фронтенд получает данные от бэкенда и отображает их, а действия пользователя отправляет обратно на сервер. Внешне это выглядит как одно приложение, но за экраном — две разные системы, общающиеся через API.

Подробная статья в блоге →

Связанные термины

Backend

Backend — серверная часть приложения: она хранит и обрабатывает данные, содержит бизнес-логику, отвечает за авторизацию и безопасность и отдаёт результат фронтенду через API. Пользователь её не видит, но именно она определяет, что приложение умеет.

Full Stack

Full stack разработчик — специалист, который умеет делать и клиентскую, и серверную часть приложения: сверстать интерфейс, написать API, спроектировать базу данных и связать всё это в работающий продукт.

HTML

HTML (HyperText Markup Language) — язык разметки, который задаёт структуру веб-страницы: заголовки, абзацы, списки, ссылки, изображения и формы. Браузер читает HTML и строит по нему документ, который вы видите на экране.

CSS

CSS (Cascading Style Sheets) — язык описания внешнего вида страницы: цвета, шрифты, отступы, расположение блоков и поведение вёрстки на разных размерах экрана. HTML задаёт, что находится на странице, CSS — как это выглядит.

JavaScript

JavaScript — язык программирования, который выполняется прямо в браузере и делает страницы интерактивными: реагирует на клики, отправляет запросы к серверу, меняет содержимое без перезагрузки. С появлением Node.js на нём пишут и серверную часть.

React

React — библиотека JavaScript для построения пользовательских интерфейсов. Интерфейс собирается из компонентов — самостоятельных блоков со своей разметкой и логикой, — а React сам обновляет на экране только то, что действительно изменилось.