Фронтенд-разработчик создаёт ту часть сайта, онлайн-сервиса или веб-приложения, которую человек видит в браузере: кнопки, формы, меню, таблицы, анимации, и пишет код, который заставляет их работать. Дизайнер придумывает внешний вид, бэкенд-разработчик готовит данные на сервере, а фронтенд-разработчик собирает из этого живой сайт, который одинаково работает на любом экране.
| Коротко о профессии | |
|---|---|
| Что делает | Создание страниц по дизайну, логика интерфейса, связь сайта с сервером, исправление багов |
| Основной стек | HTML, CSS, JavaScript, TypeScript и один из фреймворков: React, Vue или Angular |
| Зарплата джуна | 86 600 ₽ на руки, медиана Хабр Карьеры на 2 октября 2026 |
| Для новичков | 11 из 172 вакансий со словом frontend или фронтенд в названии не требуют опыта, hh.ru, та же дата |
- Кто такой фронтенд-разработчик
- Чем занимается фронтенд-разработчик
- Как задача доходит до релиза
- Фронтенд, бэкенд, фулстек и верстальщик: где граница
- Что должен знать и уметь фронтенд-разработчик
- HTML, CSS и адаптивная вёрстка
- JavaScript и TypeScript
- React, Vue или Angular
- Git, тесты и инструменты сборки
- ИИ-инструменты
- Английский
- Зарплата фронтенд-разработчика по грейдам
- Карьера фронтендера: грейды и рост
- Как стать фронтенд-разработчиком с нуля
- Портфолио и курсы
- Что проверяют на отборе
- Стажировки
- Плюсы и минусы профессии
- Частые вопросы о профессии фронтенд-разработчика
- Нужен ли диплом, чтобы стать фронтенд-разработчиком?
- Сложно ли зайти во фронтенд по сравнению с другими направлениями?
- React или Vue для первой работы?
- Можно ли работать удалённо с первой работы?
- Заменит ли ИИ фронтенд-разработчиков?
Кто такой фронтенд-разработчик
Слово пришло из английского: front end, «передняя часть». По-английски должность называется frontend developer, в России пишут «фронтенд-разработчик», «frontend-разработчик» или «разработчик интерфейсов», а в разговоре говорят просто «фронтендер». Это специалист, который отвечает за клиентскую часть сайта или приложения, то есть за всё, что выполняется в браузере пользователя.
Любая веб-страница держится на трёх технологиях. HTML, язык разметки, описывает структуру: где заголовок, где абзац, где поле формы. CSS (Cascading Style Sheets, каскадные таблицы стилей) отвечает за внешний вид: цвета, шрифты, отступы, расположение блоков на разных экранах. JavaScript, язык программирования, добавляет поведение: что произойдёт после клика, как проверить заполненную форму, когда загрузить новую информацию. Браузер превращает HTML в дерево элементов DOM (Document Object Model), и скрипты меняют это дерево, не перезагружая сайт. Благодаря этому интерфейс становится интерактивным: например, фильтр каталога срабатывает сразу, а корзина интернет-магазина обновляется без перезагрузки.
В профессиональном стандарте Минтруда слова «фронтенд» нет. Ближе всего к этой работе стандарт 06.035 «Разработчик Web и мультимедийных приложений»: в нём есть функции «Верстка страниц ИР» (информационных ресурсов, то есть сайтов и порталов) и «Кодирование на языках web-программирования», а среди действий «Размещение программного кода в клиентской части ИР». Минтруд уже утвердил новый стандарт на замену, старый утрачивает силу с 1 марта 2027 года.
Чем занимается фронтенд-разработчик
Возьмём реальную вакансию: компания ищет специалиста со стажем работы 1-3 года и платит до 160 000 ₽ на руки. В обязанностях:
- вёрстка и сборка интерфейсов на React «строго по макетам (Figma) и ТЗ»;
- получение и загрузка данных через API с обработкой ошибок;
- обновление информации в реальном времени через WebSocket;
- тестирование нового функционала юнит-тестами;
- исправление дефектов после код-ревью и отчётов тестировщиков;
- поддержка технической документации.
Там же описан ритм работы: ежедневная встреча с отчётом по статусу задач, общение с бэкенд-разработчиками и тестировщиками через трекер задач, на испытательном сроке обучение под руководством тимлида.

Как задача доходит до релиза
Задача приходит из трекера. Фронтенд-разработчик открывает макет в Figma и сначала задаёт вопросы дизайнеру: как экран выглядит на телефоне, что показать, если список пуст, где сообщение об ошибке. Потом собирает компонент: разметка, стили, поведение. Подключает API; если ответ выглядит не так, как договаривались, идёт к бэкенду согласовывать формат. Обрабатывает три состояния каждого блока: «загружается», «пусто», «ошибка». Проверяет результат в нескольких браузерах и на разных устройствах, добавляет тест, отправляет код на ревью коллеге и правит замечания. Сайт должен быстро загружаться и не тормозить на слабом смартфоне, поэтому фронтенд-разработчик сжимает изображения, убирает лишние скрипты и следит за скоростью.
Одна удалённая команда прямо ставит в обязанности «общаться с дизайнерами и product-менеджерами напрямую и декомпозировать задачи, давать примерную оценку сроков». Общение с дизайнерами, бэкендом, тестировщиками, менеджерами или командой прямо записано в обязанности или требования в 53 из 139 объявлений нашей выборки.
Не всё создают с нуля. Компания, которая делает личные кабинеты абонентов, ставит в обязанности «поддержка и развитие legacy на vanilla JS, в том числе ES5», то есть старой версии сайта на чистом JS без фреймворков.
Фронтенд, бэкенд, фулстек и верстальщик: где граница
| Специалист | За что отвечает | Чем работает |
|---|---|---|
| Верстальщик | Страница сайта по макету выглядит правильно на всех экранах | HTML, CSS, SCSS, базовый JavaScript |
| Фронтенд-разработчик | Интерфейс работает: данные, логика, состояния, скорость | JavaScript, TypeScript, фреймворки |
| Бэкенд-разработчик | Сервер, база данных, API для сайта | Python, Java, Go, PHP, Node.js и другие языки |
| Фулстек-разработчик | И клиентская, и серверная часть | Языки обеих сторон, например Node.js на сервере |
Разницу с верстальщиком хорошо видно по объявлению интернет-магазина чая. Магазин ищет «HTML-верстальщика / Frontend-верстальщика», который будет верстать «страницы и отдельные блоки сайта по макетам из Figma», каталог, карточки товаров и формы, и сразу предупреждает: «Сложный backend писать не потребуется», нужен базовый JavaScript для работы с интерфейсными элементами. Зато просят внимания к мелочам: «отступам, шрифтам, состояниям кнопок». У фронтенд-разработчика вёрстка составляет только часть работы, основное время уходит на логику: запросы к API, хранение состояния, авторизацию, обработку ошибок. На hh.ru в тот же день со словом «верстальщик» в названии нашлось 76 вакансий, в 2,3 раза меньше, чем у фронтенд-разработчиков.

Бэкенд и фронтенд встречаются на API, программном интерфейсе: бэкенд описывает, что отдаёт и в каком формате, а фронтенд-разработчик это запрашивает и показывает. По зарплатам бэкенд впереди: медиана мидла у него на Хабр Карьере составила 217 500 ₽ на руки против 187 500 ₽ у фронтенда, разница 30 000 ₽, или 16 %. Чем ещё отличаются направления разработки и смежные роли, мы разбирали в обзоре профессий в IT.
Что должен знать и уметь фронтенд-разработчик
Чтобы не гадать по программам курсов, мы открыли 139 вакансий фронтенд-разработчика, которые висели на hh.ru в тот же день, и посчитали, какие знания и навыки ждут работодатели.
| Навык или технология | Из 139 объявлений |
|---|---|
| JavaScript | 123 |
| TypeScript | 110 |
| CSS, в том числе SCSS и SASS | 94 |
| Работа с API (REST, GraphQL, WebSocket) | 89 |
| React | 88 |
| HTML | 81 |
| Git | 81 |
| Код-ревью | 62 |
| Тесты | 61 |
| Адаптивная или кроссбраузерная вёрстка | 55 |
| Хранение состояния (Redux, MobX, Pinia и другие) | 55 |
| Vue | 37 |
| Angular | 32 |
| Figma | 30 |
| ИИ-инструменты в работе | 17 |
HTML и Git встречаются реже, чем TypeScript, хотя без них не обойтись. Скорее всего, их считают само собой разумеющимися и просто не пишут.
HTML, CSS и адаптивная вёрстка
Это база профессии: её требуют даже на стартовых позициях. Государственное учреждение, которое ищет джуна, просит «уверенное знание HTML5, CSS3 и JavaScript (ES6+)», раскладку блоков на Flexbox и Grid и умение «верстать по макетам Figma с соблюдением Pixel Perfect», то есть пиксель в пиксель. Адаптивная вёрстка означает, что один и тот же сайт правильно перестраивается и работает на смартфоне, планшете и широком экране.
JavaScript и TypeScript
JavaScript встречается в 123 из 139, это главный язык программирования профессии. TypeScript, надстройку над ним с проверкой типов, называют 110 работодателей из 139, то есть 79 %. Даже среди 11 предложений без опыта он есть в шести. Поэтому мы бы не откладывали TypeScript «на потом»: как только уверенно пишете на чистом JS, начинайте изучать TypeScript на своих учебных проектах.
Стажёр в Яндексе должен знать основы JavaScript на уровне «асинхронность, типы данных, функции, контекст вызова, область видимости, замыкания, прототипы». По этому списку удобно готовиться к собеседованию на работу.

React, Vue или Angular
Фреймворки и библиотеки избавляют от ручной работы с DOM: с их помощью интерфейс собирают из готовых компонентов. React встречается в 88 из 139, Vue в 37, Angular в 32. Из них 64 называют только React, 24 только Vue, 13 только Angular. Остальные называют сразу два-три варианта или ни одного.
Первым фреймворком логично брать React: он самый популярный и встречается в 6 из 11 предложений без опыта. Перед выбором посмотрите, что просят в вашем городе: если там чаще встречается Vue, учите Vue.
Git, тесты и инструменты сборки
С Git, системой контроля версий, работают с самого начала: в команде каждое изменение проходит через ветки и запросы на слияние, а от специалиста со стажем 1-3 года ждут «понимание Git Flow, умение решать конфликты слияния». Тесты есть в 61 из 139, и их пишут даже стажёры: Сбер ставит стажёрам задачу «исправлять несложные дефекты (баги) и покрывать их тестами». Сборщики проекта (Webpack, Vite и другие) упомянуты в 42 объявлениях из 139.

ИИ-инструменты
В 17 объявлениях из 139 умение работать с ИИ-помощниками записано в требования или обязанности. Требование к студентам: «Умеешь использовать AI-инструменты для разработки, но при этом понимать сгенерированный код, уметь его проверить, изменить и объяснить». Требование к кандидатам со стажем работы 1-3 года: «Проверять то, что написал AI: читать код, запускать, тестировать, понимать логику». В 8 из 17 таких объявлений прямо сказано, что результат нейросети нужно проверять или держать под контролем: отвечает за код по-прежнему человек.
Английский
Английский чаще всего описывают как чтение технической документации, иногда с пометкой «можно со словарем». Уровень B1 или B2 указывают отдельные компании в вакансиях для специалистов со стажем от трёх лет.
Зарплата фронтенд-разработчика по грейдам
Грейд описывает уровень специалиста внутри профессии: стажёр, джун (junior, начинающий), мидл (middle, самостоятельный), сеньор (senior, опытный) и лид, который руководит командой. Медианы по калькулятору зарплат Хабр Карьеры на 2 октября 2026, на руки вместе с премией:
| Грейд | Фронтенд | Бэкенд | Фулстек |
|---|---|---|---|
| Стажёр | 63 300 ₽ | 70 400 ₽ | 65 100 ₽ |
| Джун | 86 600 ₽ | 98 300 ₽ | 84 800 ₽ |
| Мидл | 187 500 ₽ | 217 500 ₽ | 162 500 ₽ |
| Сеньор | 333 300 ₽ | 343 200 ₽ | 273 300 ₽ |
| Лид | 408 300 ₽ | 451 600 ₽ | 388 300 ₽ |
Медиана стажёра-фулстека посчитана всего по 25 анкетам, это скорее ориентир. Медиана фронтенд-разработчика по всем грейдам там же 225 000 ₽, но новичку она мало что говорит: три четверти анкет приходится на мидлов и сеньоров. Медиана мидла выше медианы джуна больше чем вдвое.
Сумму указывают нечасто: в нашей выборке вилка была в 46 объявлениях из 139. Среди вакансий без опыта с указанной зарплатой нашлись 50 000 ₽ на руки в студии, которая делает игры и промосайты в Ярославле (до этого месяц оплачиваемого обучения со стипендией 25 000 ₽, оформление по ГПХ), и 127 500 ₽ до вычета налогов при переезде в Елабугу. Подробнее о том, сколько зарабатывают программисты в разных направлениях, мы писали в статье о зарплатах программистов.

Карьера фронтендера: грейды и рост
Стажёр и джун получают небольшие изолированные задачи: в Сбере это «простые, изолированные UI-компоненты (кнопки, инпуты, карточки) на React». Мидл ведёт задачу самостоятельно: сам уточняет детали у дизайнера и менеджера и оценивает сроки. В вакансии сеньора на React стоят разработка клиентской части «от архитектуры и управления состоянием до production-ready UI» и «участие в code review, менторство разработчиков». Дальше обычно выбирают между управлением людьми и технической линией.
Профстандарт 06.035 описывает похожую лестницу. Для первого уровня с должностями «Технический специалист» и «Кодировщик» хватает среднего профессионального образования, стаж не требуется. Для уровня с должностями «Разработчик» и «Ведущий разработчик» стандарт называет бакалавриат и не меньше года работы в области разработки информационных ресурсов. Компании смотрят на диплом мягче: высшее образование упомянуто только в 16 из 139.
Навыки фронтенда переносятся в соседние роли. В нашей выборке есть объявление «Frontend / Android Developer (React Native)»: с навыками этой профессии там работают над мобильным приложением.

Как стать фронтенд-разработчиком с нуля
Из 172 вакансий фронтенд-разработчика на hh.ru без опыта работы было 11. Удалённых среди них не нашлось ни одной. Почти половина (5 из 11) оказалась стажировками, ещё одна была про настольные приложения на .NET, а в двух работодатель поставил пометку «опыт не требуется», но в тексте просил полгода коммерческой разработки или знание Python-стека и разработку архитектуры приложения. Обещание «войти в профессию за три месяца» с этим рынком не сходится.
С чего начать и в каком порядке учиться:
- HTML и CSS до уверенной адаптивной вёрстки: две-три страницы по готовым дизайнам из Figma, которые не разваливаются на телефоне.
- JavaScript: типы данных, функции, массивы и объекты, асинхронность, работа с DOM и запросы к серверу.
- Git с первого учебного проекта: каждое изменение коммитом, проект на GitHub.
- TypeScript и один фреймворк, обычно React.
- Одно полноценное веб-приложение с API, авторизацией и обработкой сбоев вместо пяти одинаковых лендингов.
- Тесты и базовая сборка проекта.
- Базовые алгоритмические задачи и пара тестовых заданий из реальных вакансий: на отборе встречается и то и другое.
Сколько времени уйдёт на подготовку к первой работе, зависит от часов в неделю и от того, учитесь вы с наставником или самостоятельно. Подробный расчёт по форматам есть в статье сколько учиться на программиста, а общий план входа в профессию в материале как стать программистом с нуля.

Портфолио и курсы
Портфолио, пет-проект или ссылку на GitHub упоминают 19 из 139 объявлений. Ozon Банк, который набирает на стажировку, прямо пишет: «В случае своих pet проектов необходимы ссылки на github». Курсы помогают освоить профессию по порядку и получить обратную связь по коду, но в отклике мы бы делали ставку на проекты, а не на сертификат. Пет-проект, то есть собственный учебный проект, выглядит сильнее, если в нём есть настоящий API, состояния загрузки и сбоя, аккуратный вид на телефоне и понятное описание, что сделано и почему. Как показать это в отклике, разобрано в статье про резюме программиста.
Что проверяют на отборе
В объявлениях отбор описывают похоже: разговор с рекрутером, тестовое задание, техническое интервью. Студия игр описывает его так: «Отклик → Тестовое задание → Собеседование и стажировка (неделя) → Обучение в течение месяца». Одна компания, которая ищет сеньора, указывает «Техническое интервью + Live coding (1-2 часа)», то есть программирование при интервьюере. Тот же Ozon Банк ждёт от стажёров ещё и «базовую алгоритмическую подготовку». Готовиться стоит по четырём блокам: JavaScript (замыкания, асинхронность, контекст вызова), HTML и CSS, базовые алгоритмические задачи, разбор собственного проекта, в котором вы объясняете каждое решение.
Стажировки
На старте стажировка часто реальнее обычной работы. Программа Яндекса по фронтенду оплачиваемая, длится от 3 до 6 месяцев, работать можно 20, 30 или 40 часов в неделю, после неё есть возможность перейти в штат. В Сбере после стажировки тоже можно перейти в штат по результатам работы. Требования при этом серьёзные: фреймворк, TypeScript, понимание HTTP и API. Некоторые компании ждут на стажировку студентов старших курсов технических вузов, поэтому студенту стоит подаваться, пока он учится.
Плюсы и минусы профессии
| Что радует | Что утомляет |
|---|---|
| Результат своей работы видно сразу на экране | Инструменты меняются, учиться приходится постоянно |
| Много задач на стыке с дизайном и продуктом | Много общения: дизайнер, бэкенд, тестировщики, менеджер |
| Медиана мидла на Хабр Карьере больше чем вдвое выше, чем у джуна | Для новичков всего 11 из 172 вакансий |
| У 93 из 172 вакансий отмечен удалённый формат | Удалённой работы без опыта на hh.ru не нашлось |
| Навыки переносятся в фулстек и мобильную разработку | Нужно помнить про разные браузеры и устройства |

Частые вопросы о профессии фронтенд-разработчика
Нужен ли диплом, чтобы стать фронтенд-разработчиком?
Для большинства мест работы нет: высшее образование упомянуто в 16 из 139 разобранных нами вакансий. Диплом нужнее на стажировках для студентов старших курсов.
Сложно ли зайти во фронтенд по сравнению с другими направлениями?
Порог входа по технологиям невысокий: для первой страницы на HTML и CSS хватит браузера и редактора кода. Сложность в малом числе мест без опыта: на hh.ru таких было 11 вакансий из 172, около 6 %. У программистов в целом доля похожая: 315 предложений без опыта из 5 390 по роли «Программист, разработчик».
React или Vue для первой работы?
React: он упоминается в 88 из 139 и в 6 из 11 без опыта. Vue берите, если в вашем городе его просят чаще.
Можно ли работать удалённо с первой работы?
На 2 октября 2026 года на hh.ru не нашлось ни одного удалённого места для фронтендера без опыта. Удалённый формат отмечен у 93 из 172, и все они требуют стаж от года.
Заменит ли ИИ фронтенд-разработчиков?
Пока работодатели ждут обратного: в 17 из 139 объявлений ИИ-инструменты записаны в требования или обязанности, и в 8 из этих 17 прямо оговорено, что результат нейросети разработчик проверяет или держит под контролем.








