Как стать frontend-разработчиком: план обучения, портфолио, первая работа

План обучения

Frontend — профессия программиста, и на подготовку уходят месяцы. Разумный порядок:

1. HTML и CSS — вёрстка по макету, адаптивность. Курс «HTML и CSS».
2. JavaScript — основы языка, работа с DOM и событиями. Курс «Основы JavaScript».
3. Запросы к API — fetch, JSON, загрузка и ошибки (урок 5).
4. Git и GitHub — история кода и публикация. Курс «Git и GitHub».
5. Фреймворк — React или Vue (урок 6).
6. TypeScript и тестирование — уже ближе к первой работе.

Каждый шаг закрепляйте небольшим проектом — так знания превращаются в навык.

Портфолио

Портфолио frontend-разработчика — это работающие сайты и их код. Хватит 3–4 проектов, если они сделаны аккуратно:

Проект	Что показывает
Лендинг по готовому макету из Figma	Точная вёрстка, адаптивность, внимание к деталям
Приложение с открытым API: поиск, фильтры, состояния загрузки и ошибки	Работа с данными и JavaScript
То же приложение или новое на React	Владение фреймворком
Свой проект на интересную вам тему	Самостоятельность и мотивация

Макеты для тренировки можно найти в открытых сообществах Figma, а открытые API — в публичных каталогах. Важно, чтобы хотя бы один проект был не повторением видеоурока: работодатель видит такие проекты сразу.

Публикация

У каждого проекта должна быть ссылка, по которой его можно открыть. Для статических сайтов подойдёт GitHub Pages: код лежит в репозитории, а сайт публикуется по адресу вида имя.github.io/проект. В описании репозитория (файл README) напишите, что это за проект, какие технологии использованы и что было самым сложным.

Первая работа

Вакансии для начинающих называют junior frontend-разработчик. Что обычно ждёт на пути:

• Отклик с портфолио — ссылки на 3–4 проекта и GitHub в резюме.
• Тестовое задание — сверстать страницу или сделать небольшое приложение. Проверяют аккуратность кода, адаптивность, обработку загрузки и ошибок, понятный README.
• Техническое собеседование — вопросы по HTML, CSS, JavaScript, иногда задача на написание кода. Не страшно чего-то не знать: важно показать, как вы рассуждаете.

От джуниора не ждут знания всего. Ждут, что он умеет разбираться сам, задаёт хорошие вопросы и не боится сказать «не знаю, сейчас выясню». Актуальные требования удобно смотреть в вакансиях на hh.ru — ссылка есть на странице курса.