Путь от нуля до первого оффера во frontend — год-полтора, а не три месяца: примерно полгода учиться плюс полгода-год искать работу. Порядок жёсткий и нарушать его нельзя — HTML и CSS, потом JavaScript до автоматизма, потом один фреймворк, потом инструменты, и только потом собеседования. Junior стартует с 50 000–80 000 ₽ (медиана предлагаемых зарплат на hh.ru за 2026 год), middle уже зарабатывает 140 000–250 000 ₽. Но главная цифра другая, и про неё молчат на лендингах: на одну junior-вакансию во frontend сегодня приходят десятки выпускников курсов, и берут того, у кого есть что показать.
Поэтому план ниже — не «какой курс купить». Это карта: что учить, в каком порядке, сколько это реально занимает и как собрать портфолио, которое вытащит вас из толпы одинаковых джунов.
Дальше по шагам. Сначала почему порядок нельзя ломать. Потом сам роадмап — пять блоков от тегов до первого собеседования. Потом честный разговор про перенасыщенный рынок и про то, что на нём реально работает. И сетка сроков: что у вас будет через месяц, через полгода, через год.
Кирилл, двадцать шесть лет, бывший монтажник в Краснодаре. Решил во frontend — посмотрел зарплаты, увидел React в каждой вакансии и начал с React. Логично же: учи то, что просят работодатели.
Восемь месяцев он бился с фреймворком, который не понимал. Не понимал, потому что не знал JavaScript, на котором тот написан. А JavaScript не давался, потому что Кирилл толком не чувствовал, как браузер рисует страницу из HTML и CSS. Он строил третий этаж на фундаменте, которого не было. Каждый туториал работал ровно до того места, где надо отступить от туториала, — и там Кирилл вставал намертво.
Это типовая ошибка, и она дорогая. Frontend выглядит как набор модных слов — React, TypeScript, Webpack, — и новичок хватается за верхний слой, потому что именно его называют в вакансиях. Но вакансии описывают, что middle делает в проде, а не в каком порядке этому учиться. Учить frontend в порядке списка из вакансии — всё равно что учить высшую математику, начав с интегралов, потому что они звучат серьёзнее сложения.
Цена ошибки — не лишний месяц. Восемь месяцев иллюзии движения, после которых человек решает, что программирование «не для него», и уходит.
Хотя проблема была не в способностях. В порядке.
Каждый следующий слой frontend стоит на предыдущем. Перепрыгнул — и не понимаешь, что под руками. Вот единственный правильный маршрут.
HTML и CSS — две-четыре недели. Это не язык программирования, это разметка и стили: из чего состоит страница и как она выглядит. Кажется скучным и простым, и поэтому большинство его проскакивает — а потом всю карьеру верстает криво. Здесь важны не теги сами по себе, а две вещи, на которых ломаются даже мидлы: как работает блочная модель (почему элемент занимает именно столько места) и как устроена адаптивная вёрстка через Flexbox и Grid (почему сайт не разваливается на телефоне). Освоили — умеете сверстать статичную страницу, которая красиво выглядит на любом экране. Это уже навык, за который платят.
JavaScript — два-три месяца, и это сердце профессии. Здесь страница оживает: реагирует на клики, грузит данные, меняется без перезагрузки. Большинство недоучивает именно JavaScript — спешит к фреймворку, потому что фреймворк в вакансии, а «голый JS» нет. Это и есть ловушка Кирилла. Фреймворк — надстройка над JavaScript; не зная основы, вы не отлаживаете код, а гадаете. Что должно дойти до автоматизма: как работают функции и замыкания, что такое асинхронность (промисы, async/await — без этого не загрузить данные с сервера), как браузер хранит структуру страницы (DOM) и как её менять. Не торопитесь отсюда. Месяц, сэкономленный на JavaScript, оборачивается тремя потерянными на фреймворке.
Один фреймворк — два-три месяца. Один, не три. Когда чистый JavaScript перестал пугать, берёте ровно один популярный фреймворк и доводите до рабочего уровня. Не «посмотреть React, потом Vue, потом ещё что-то для резюме». Один — глубоко. Работодателю не нужен список из трёх фреймворков на уровне «прошёл вводный урок». Ему нужен один, на котором вы реально собрали проект. Какой именно — почти неважно для старта: принципы общие, второй потом учится за пару недель. Важно довести первый до состояния «могу собрать приложение сам, без подглядывания в туториал на каждой строчке».
Заметили закономерность? Каждый блок — фундамент для следующего. Пропустить нельзя ни один. А вот растянуть или ускорить — можно, и зависит это от того, сколько часов в день вы реально вкладываете.
Код писать научились. Теперь то, без чего код не доходит до работодателя.
Git и GitHub — система контроля версий и площадка, где живёт ваш код. Это не «дополнительный навык», это рабочий стол разработчика: на собеседовании первым делом смотрят ваш профиль на GitHub. Пустой профиль — пустое резюме. Сюда же — умение работать с командной строкой, ставить пакеты через npm, собирать проект сборщиком. Звучит как технические мелочи, но именно их отсутствие выдаёт человека, который «прошёл курс», но никогда не доводил проект до живого, развёрнутого в интернете состояния.
Ещё один слой, который добавился в стандарт 2026 года, — TypeScript. Это JavaScript со строгой проверкой типов, и в новых вакансиях его требуют всё чаще. Новичку не надо учить его параллельно с JavaScript — это перегруз. Но к моменту, когда фреймворк освоен, базовый TypeScript уже не роскошь, а ожидаемый минимум.
Здесь нет отдельного «этапа на три месяца». Инструменты подтягиваются по ходу: Git — с первого же проекта, командную строку — когда впервые ставите фреймворк, TypeScript — ближе к концу. Не выделяйте под них отдельное время. Выделяйте под проекты, внутри которых они и осваиваются сами.
Вот факт, который переворачивает весь план. На junior-вакансию во frontend приходят десятки откликов, и почти у каждого — сертификат об окончании курса. Сертификат перестал отличать. Отличает другое: что вы реально собрали и можете показать.
Рынок 2026 года устроен жёстко. Фокус найма сместился на опыт: 51% вакансий требуют от одного до трёх лет, ещё 25% — от трёх до шести. На совсем зелёного джуна остаётся узкая щель. Формула рынка звучит так — «дефицит навыков, а не людей»: компаниям не хватает не желающих войти в ИТ, а тех, кто умеет делать конкретную работу и может это доказать. Доказательство для frontend одно — пет-проекты. Не учебные задания из курса, которые сделали ещё двести человек по тому же шаблону, а ваши собственные приложения, решающие понятную задачу.
Что кладут в портфолио, чтобы оно работало. Три-четыре проекта, но настоящих и доведённых до конца — развёрнутых в интернете по живой ссылке, которую можно открыть прямо на собеседовании. Не десять заброшенных репозиториев на середине. Законченное маленькое всегда бьёт незаконченное большое. Хорошо, если хотя бы один проект решает реальную задачу — вашу собственную или знакомого с его маленьким делом: трекер, калькулятор, витрина, мини-магазин. Такой проект на собеседовании рассказывается живой историей — «у знакомого была проблема, я сделал вот это», — а не отчётом «прошёл модуль номер четыре». Истории запоминаются. Модули — нет.
Крупным компаниям часто выгоднее взять джуна и вырастить под себя — и они присматриваются к людям ещё во время обучения, по их открытым проектам. Публичный код, который виден и развивается, — это и есть способ показать опыт, когда коммерческого опыта ещё нет. Поэтому проекты выкладывают не в стол, а наружу, с первого дня.
Теперь честно, без рекламного оптимизма. Войти во frontend в 2026-м труднее, чем три года назад. Курсы выпустили волну джунов, требования работодателей выросли — от новичка нередко ждут, чтобы он с первой недели работал почти как middle. Поиск первой работы у многих растягивается на шесть-двенадцать месяцев, и часть людей на этом сроке сдаётся. Это реальность, и закрывать на неё глаза — значит готовить себя к разочарованию.
«Раз рынок переполнен, может, и не стоит лезть?» — резонный вопрос. Ответ зависит от того, как вы собираетесь входить. Если так же, как большинство — прошёл курс, получил сертификат, разослал сто одинаковых резюме, — то да, шансы низкие, потому что вы неотличимы от остальных ста человек в той же очереди. Переполнен рынок именно одинаковыми. Не переполнен — теми, у кого есть живое портфолио, понятная история своих проектов и умение довести задачу до развёрнутого результата.
Перенасыщение меняет не маршрут, а акценты внутри него. Меньше времени на коллекционирование сертификатов — больше на проекты. Меньше теории впрок — больше доведённых до конца приложений. И трезвый горизонт: закладывайте на поиск работы не месяц, а полгода как норму, и тогда шестой месяц без оффера не сломает вас, а будет ожидаемой частью пути.
Тот, кто ждал оффер через две недели, бросает на третьем месяце. Тот, кто заложил год, доходит.
Чтобы план не остался абстракцией — реальные горизонты при 2–3 часах в день. Меньше времени — растягивайте сроки, но не меняйте порядок.
Месяц. Вы уверенно верстаете статичные адаптивные страницы на HTML и CSS и пишете первые скрипты на JavaScript. Уже есть один маленький проект на GitHub. Этого мало для работы — но достаточно, чтобы честно понять: затягивает или приходится заставлять себя каждый вечер. Это ваша точка дешёвого разворота.
Полгода. JavaScript не пугает, один фреймворк освоен на уровне «собираю приложение сам», в портфолио два-три развёрнутых проекта, профиль на GitHub живой. Здесь начинается активный поиск работы и подготовка к собеседованиям. Не раньше: выходить на рынок с пустым портфолио — кормить свою самооценку отказами без пользы.
Год — полтора. Первый оффер. Между «готов к работе» и «получил работу» лежат те самые полгода-год поиска, и это нормальный срок, а не ваша личная неудача. Дальше — junior-зарплата 50 000–80 000 ₽ по медиане hh.ru за 2026 год, а через год-два роста в middle вилка прыгает до 140 000–250 000 ₽. Переход из junior в middle даёт самый резкий скачок дохода во всей карьере — но это уже следующая история, после первого оффера.
Главное правило, на котором держится весь план: учите слоями снизу вверх и никогда не перепрыгивайте. HTML и CSS, потом JavaScript до автоматизма, потом один фреймворк, потом — реальные проекты в портфолио. Если ловите себя на том, что копаете React, а блочную модель CSS объяснить не можете, — остановитесь и вернитесь на слой ниже. Сэкономите месяцы.
Конкретно на ближайшее время — три шага.
Начните с HTML и CSS и сверстайте одну адаптивную страницу до конца. Бесплатных интерактивных тренажёров по вёрстке хватает, платить на этом этапе не за что. Цель первой недели — не выучить все теги, а почувствовать вечер за кодом: затягивает или нет.
Заведите GitHub в первый же день и выкладывайте туда каждый проект, даже кривой и маленький. Портфолио не собирают в конце — его наращивают с первого шага. Пустой профиль в день собеседования собрать невозможно, а живой за полгода набирается сам.
И прежде чем покупать курс, проверьте, что frontend — действительно ваше направление, а не первое, что попалось в зарплатных обзорах. Профтест на этом сайте за пять минут сопоставит ваш склад ума, бэкграунд и бюджет с подходящими направлениями в веб-разработке и покажет, стоит ли вам именно во frontend — или соседняя ветка веб-разработки ляжет лучше. Это самый дешёвый способ не повторить путь Кирилла, который восемь месяцев строил третий этаж без фундамента.
Кирилл, кстати, не бросил. Он закрыл React, вернулся к самому началу — к блочной модели, которую раньше счёл скучной мелочью, — и за месяц понял про вёрстку больше, чем за предыдущие полгода. Через четыре месяца JavaScript перестал быть магией. Фреймворк, на котором он застрял на восемь месяцев, со второго захода дался за шесть недель — потому что теперь под ним был фундамент. Первый оффер он получил спустя год с небольшим от того дня, когда начал заново. Восемь месяцев он потерял не на сложности frontend. На неправильном порядке.
