Frontend (фронтенд) представляет собой публичную часть сайта (веб-приложения), которая обеспечивает прямое взаимодействие пользователя с веб-ресурсом. В понятие frontend входит:
- вывод на сайте интерфейса пользователя;
- выполнение функциональных задач;
- обработка определенных запросов посетителей и т. д.
Фронтенд — это буквально все, что видит посетитель сайта, открывая любую его страницу.
Что такое веб-приложение
Понятие «веб-приложение» стоит рассматривать как клиент-серверное программное обеспечение, где клиентом выступает браузер, а сервером — веб-сервер, на котором находится сайт.
Логика веб-приложений распределяется между клиентом и сервером — вся информация сайта хранится на сервере, а обмен данными между клиентом и сервером осуществляется через интернет.
Web-приложение — видимая для посетителя часть сайта, на которой можно выполнять определенные действия при каждом подключении к сети и открытии веб-ресурса через интернет-браузер.
Что такое фронтенд-разработка
Frontend-разработка подразумевает работу программиста над созданием видимой части веб-ресурса, с которой посетитель будет контактировать. В frontend-разработку входит создание функционала сайта, который может выполняться на стороне клиента.
Frontend-разработчик трудится над тем, чтобы на сайте работали все кнопки, иконки, формы связи и подписки, правильно отображались тексты и графические элементы, чтобы все они «стояли на своих местах» и выполняли те задачи, которые перед ними были поставлены (например, чтобы при клиенте по кнопке «заказать» открывалась форма для оформления покупки, а при нажатии на кнопку «play» включалось видео и т. д.).
Чтобы конечный продукт frontend-разработчика был качественный, востребованный среди пользователей и отвечал поставленным перед ним требованиям, необходимо обеспечить грамотное взаимодействие этого разработчика со всеми остальными специалистами, которые работают над задачей: веб-дизайнерами, маркетологами, SMM-щиками, аналитиками и т. д.
С какими языками работает фронтенд-разработчик
Фронтенд-разработчик работает со следующими компонентами:
- Фреймворки (React.js, AngularJS, Vue.js, Ember.js и т. д.). Платформы, дающие фронтенд-разработчику основу для создания веб-приложений. В них присутствуют уже определенные и реализованные функции с классами. Также в фреймворках можно добавлять свой код к уже предложенному.
- Cascading Style Sheets (CSS). Язык стилизации внешнего вида веб-страницы. При помощи CSS клиент (браузер) «понимает», каким именно образом нужно отображать графические элементы на сайте. При помощи CSS задаются цвета, шрифты, расположения блоков и т. д. CSS-код помогает адаптировать веб-приложение, чтобы оно одинаково отображалось на разных устройствах.
- HyperText Markup Language (HTML). Язык разметки всех элементов страницы, позволяющий также прописать особенности их взаимодействия друг с другом.
- JavaScript. Язык, способный «оживить» веб-страницы. Цели создания таких скриптов — отклики на действия посетителей, обработка перемещения курсора мыши, нажатий на клавиши, отправленных запросов, загрузки данных без перезагрузки самой страницы и т. д.
- Сопутствующие системы. Понимание работы инструментов для контроля версий (GitHub, Git, CVS и т. д.), минимальное владение графическими редакторами по типу Photoshop, Illustrator, знание английского языка.