Профессия frontend-разработчика удивительна и многогранна... Она совмещает в себе навыки находчивого дизайнера, дотошного проектировщика, опытного аниматора и даже немного волшебника. Ведь как еще можно назвать человека, который умеет вдохнуть жизнь и движение в неживую статичную картинку-макет, который получает от дизайнера? А еще этот непростой человек должен уметь предугадывать мысли и желания проджект-менеджера и клиента.
Чем же мы занимаемся
Основная задача frontend-разработчика состоит в том, чтобы по готовому дизайн-проекту воссоздать веб-страницу на языке, понятном любому браузеру на любом устройстве. При этом необходимо «научить» отдельные элементы двигаться, разворачиваться/сворачиваться, менять вид и цвет в зависимости от тех или иных действий пользователя.
Для создания структуры страницы и правильной расстановки элементов пишется HTML-код, для придания элементам формы, цвета, отступов применяются CSS-стили, а для «оживления» элементов и создания интерактивности используется JavaScript. Для того, чтобы веб-страница одинаково хорошо и понятно выглядела на любом устройстве, frontend-разработчик очень тщательно продумывает архитектуру сайта и воссоздает максимально структурированный код. Это занимает немало времени и сил, но полученный в итоге результат этого стоит! Вот листочки при движении мыши задвигались в такт, вот картинка «выплыла» из ниоткуда при скролле страницы, а вот тут блоки перестроились в одну колонку лишь при повороте телефона... согласитесь, магия?
Каждый серьезный frontend-разработчик при написании кода старается соблюдать аккуратность и последовательность. Бывает, что в дальнейшем, при работе с сайтом, появляется необходимость внести какие-то изменения или доработки. В такой ситуации аккуратный и четко структурированный код помогает сделать это максимально быстро. Зачастую именно код frontend-разработчика говорит об уровне его профессионализма.
Также немало времени уделяется так называемому «неймингу» CSS-классов, с помощью которых задаются внешние характеристики объектам веб-страницы. По названию классов должно быть понятно, какой элемент страницы под ним скрывается или какого рода стили по нему задаются. Здесь нужно быть аккуратным и стараться максимально все продумать. Например, часто можно встретить такую ситуацию: кнопка, которой изначально задавался класс «btn-green», то есть зеленого цвета, может стать красной или синей. Тогда смысловая нагрузка в названии класса не просто теряется, а мешает работать.
За всем эти скрывается огромная увлеченность своей работой и, конечно же, немалый опыт.
