Rich Dev School

Кто такой Frontend-разработчик и чем отличается от Backend?

Наверняка ты хоть раз заходил на сайт поиска вакансий, чтобы утолить свой интерес, сколько же зарабатывают те самые «ты ж программисты», и скорее всего натыкался на такие определения, как «Frontend» и «Backend».

Давай разберемся, что же это. Frontend – клиентская часть веба, т.е. то, что браузер выводит на экран пользователя. Backend – программно–аппаратная часть веба, основанная на логике и архитектуре программного обеспечения.

Проще говоря, если ты в любом поисковике введешь например: «доставка цветов Химки», процесс обработки твоего запроса сервером и будет бэкэндом. А уже красивый и интуитивно понятный интерфейс открытого тобой рандомного сайта доставки цветов – результат фронтэнда.

Фронтэнд разработчик занимается версткой веб-страниц по макету и разработкой функциональности веб-страницы: прописывает логику работы кнопок, обработку данных пользовательских форм и другие элементы прямого взаимодействия сайта с пользователем.

Чем же орудует фронтэнд разработчик?

- Во-первых, никуда без HTML, т.е. языка гипертекстовой разметки, на котором строится внешний вид страницы: текст, изображения, блоки и другое. Сайтов, написанных только на HTML, уже не встретить, но для фронтенд разработчика этот язык – необходимая база.
- Второе, что необходимо знать – CSS, т.е. набор шаблонов для форматирования страницы. CSS помогает создавать на веб-странице стиль оформления без лишнего дублирования кода.
- Ну и конечно же JavaScript — в отличие от HTML и CSS , является полноценным языком программирования.
Сегодня на сайтах и в приложениях активно используется JavaScript, а так же инструменты, облегчающие их создание, такие как React, Vue и Angular. Эти инструменты позволяют разработчикам выстраивать сложные пользовательские интерфейсы из компонентов, пригодных для многократного использования.

Существование фронтэнда и бэкэнда, а есть еще, кстати, и фуллстэк, но это уже совсем другая история, доказывает, что современная веб-разработка — это многоуровневый и интересный процесс, который можно разделить на клиентскую и серверную части.

Многие начинают именно с фронтэнда, изучая HTML и CSS, постепенно подключая JavaScript. Примечательно то, что умелый фронтэнд-разработчик, имея реальные визуальные примеры в своем портфолио, чего не может быть у бэкэнд-разработчика, никогда не останется без проекта.

Программа обучения

Как связаны UX/UI и Frontend?

Основной работой фронтендера является создание клиентской части рабочего и удобного интерфейса, а также проверка идентичности дизайна сайта на разных платформах и браузерах.

Отсюда напрашивается вывод, что работа фронтендера тесно связана с дизайнером. Как и фронтендер он фокусируется на удобстве и функционале пользовательского интерфейса, но помимо этого он создает ещё и современный дизайн интерфейса.

Именно этим и занимаются UX и UI дизайнеры.
Аббревиатура UX расшифровывается как User Experience, т.е. дословно пользовательский опыт. UX-дизайнер работает над удобством и понятной логикой интерфейса.
Аббревиатура UI означает User Interface, т.е. пользовательский интерфейс. UI-дизайнер работает над отображаемым видом элементов страницы и деталями взаимодействия пользователя и интерфейса.
И несмотря на разные спектры задач UX и UI дизайнеров часто бывает, что это один и тот же человек.

Работа UX/UI дизайнера и Frontend-разработчика дополняет друг друга, трудно представить верстку фронтендера без макета интерфейсов UX/UI-дизайнера, как и наоборот, поэтому важно, чтобы эти двое были игроками одной команды.

Как и в любой командной игре для слаженной работы необходимы правила взаимодействия между «игроками».
Самое главное правило для обеих сторон адекватно оценивать не только собственные силы, но и силы другой стороны. Прежде чем приступить к проекту разработчик и дизайнер должны подумать над идеей дизайна и способом ее воплощения, чтобы избежать лишних правок по ходу работы. В идеале дизайнер должен знать азы верстки, а разработчик должен разбираться в базовых понятиях дизайна.

Второй момент – это общение. Разработчик и дизайнер должны находится между собой в постоянной коммуникации, в едином информационном поле. Лучшим вариантом для разработчика и дизайнера станет работа в одном офисе, одном кабинете, а то и за одним столом. В случае если разработчик и дизайнер работают по удаленке с живой коммуникацией конечно возникнут трудности, но и здесь можно выкрутиться с помощью войсов и видео-звонков.

Еще не маловажным моментом является подбор общих инструментов для работы. Это касается в большей степени графических редакторов. Бывает, что дизайнер скидывает свой макет в неудобном формате, если он, например, был сделан в Photoshop, хотя уже существуют более удобные инструменты.

Теперь Вы понимаете, что слаженная работа UX/UI дизайнера и фронтендера зависит от их уровня коммуникации между собой, понимания не только своих задач, но и задач другой стороны, а также согласованности всех действий в проекте.