Frontend разработка веб сайтов

Часто задаваемые вопросы по Frontend-разработке

• Сколько стоит 1 час frontend разработчика?

  Стоимость 1 часа работы frontend специалиста зависит от его опыта и уровня профессиональных навыков.

  В мире IT принято классифицировать разработчиков на несколько рангов в зависимости от их опыта и технических навыков:

  1) Intern – это стажеры, которые только начинают свой путь в веб-разработке. Обычно им поручают не сложные задачи под присмотром более опытных специалистов. Стоимость часа работы интерна составляем в среднем 1500 рублей.

  2) Junior – эта младший специалист, имеющий не большой практический опыт, который владеет базовым технологическим стеком frontend-разработки (HTML, CSS, JavaScript) и способный выполнять основные задачи в своей области. Стоимость часа работы таких специалистов составляет около 2000 рублей.

  3) Middle – это достаточно опытные специалисты, имеющие за плечами значительный практический опыт и способные решать большинство задач в веб-разработке. Обычно они имеют продвинутые знания в области технологического стека (различные CSS-препроцессоры и JavaScript-фреймворки). Стоимость 1 часа работы middle-разработчика составляет 2500 рублей.

  4) Senior – это наиболее опытный специалист, который способен самостоятельно, без дополнительной помощи, решать широкий спектр задач в области веб-разработки. Такие специалисты обладают глубокими знаниями различного технологического стека и могут выступать консультантами для младших специалистов, проводить их обучение и организовывать их работу. Стоимость работы 1 часа senior-разработчика составляет в среднем 3000 рублей.

  5) Team Lead – это высокоранговый специалист, должность которого дословно переводится как «лидер команды». Тимлид является наиболее опытным членом команды, который практически уже не пишет код, но благодаря своему бэкграунду организует работу команды разработчиков, проводит оценку корректности технических решений, распределяет нагрузку между членами команды и отвечает за проекты в целом. Стоимость 1 часа работы тимлида составляет 3500 рублей.

• Что такое frontend разработка веб сайтов?

  Frontend разработка – это создание пользовательской стороны интерфейса сайта или мобильного приложения, т.е. всего того, что видит пользователь на своем экране (баннеры, кнопки, блоки страницы, различные интерактивные элементы и т.д.).

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

• Что входит в frontend разработку?

  Frontend разработка, т.е. создание пользовательского интерфейса, складывается из нескольких этапов:

  1) Создание макета. На этом этапе команда дизайнеров создает интерактивный макет приложения, где отражается то, как будут выглядеть будущие страницы.

  2) Верстка. Под версткой понимается создание страниц приложения на основе макета. Процесс верстки начинается с создания разметки страницы с помощью языка HTML, благодаря которому создается структура страницы, ее основные блоки и текстовое наполнение. Далее с помощью языка CSS создается стиль страниц, включая цветовое наполнение, особенности шрифта, расположение элементов на странице, создание анимации и т.д. Интерактивность страницы создается с помощью скриптового языка JavaScript и его фреймворков. Благодаря этому языку страница становится динамичной.

  3) Тестирование. После верстки проект передается QA-тестировщикам, которые проверяют страницы на предмет наличия багов и заранее установленным критериям качества. В случае обнаружения ошибок проект передается frontend разработчику на доработку.

• Чем отличается frontend разработка от backend разработки?

  Frontend разработка – это создание пользовательской, видимой стороны веб-приложения, которую пользователи видят на своих экранах и могут с ней взаимодействовать. В свою очередь backend – это бизнес-логика приложения, его аппаратно-программная и «серверная часть». Т.е. если применить аналогию с автомобилем, то фронтенд – это элементы управления автомобилем (руль, педали газа и тормоза, приборная панель), а бэкенд это то, что находится под капотом, благодаря чему работает автомобиль. С веб-приложениями тоже самое: бэкенд не видно, но благодаря ему работает все то, что видно во фронтенд-части.

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

  Таким образом фронтенд и бэкенд разработка – это две взаимосвязанные стороны веб-приложения, где первая отвечает за внешнюю пользовательскую сторону, а вторая за внутреннюю логику ее работы.

• Что должен знать frontend разработчик?

  В сфере IT принято разделять навыки специалиста на soft-skills и hard-skills. Софт-скиллы характеризуют личностные качества специалиста, его способность осуществлять коммуникацию с другими людьми и взаимодействовать внутри команды. В своей работе frontend-разработчик взаимодействует с широким кругом специалистов: дизайнерами, фронтенд и бэкенд разработчиками, тестировщиками, менеджерами и др. Поэтому frontend-специалист должен обладать развитыми софт-скиллами для успешной работы в IT-команде.

  В свою очередь хард-скиллы – это технические навыки специалиста.

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

  1) HTML – язык разметки страницы, благодаря которому создается общая структура, основные блоки и текстовое наполнение страниц.

  2) CSS – язык, благодаря которому создается стиль страниц (цветовое наполнение, размещение элементов, особенности шрифтов, некоторые анимации и т.д.).

  3) Препроцессоры CSS – специальные инструменты разработки, которые облегчают создание стиля страниц и расширяют возможности CSS. В качестве популярных препроцессоров выступают Less и Sass.

  4) JavaScript – скриптовый язык программирования, который позволяет сделать страницу веб-приложения интерактивной и динамичной. JavaScript имеет множество библиотек, которые облегчают работу фронтенд разработчика.

  5) Фреймворки JavaScript – специальные инструменты, написанные на основе JavaScript, которые во многом упрощают работу с ним и расширяют его возможности. Популярными JS фреймворками являются: Node.js, React.js, Vue.js, JQuery, Angular.

  6) Сборщики проектов – специальные инструменты (менеджеры задач), которые значительно облегчают работу frontend разработчика. Популярными сборщиками проектов являются Gulp и WebPack.