Senior за 2 года? собеседование frontend | live coding
Полное mock-собеседование frontend-разработчика с техническими вопросами по TypeScript, JavaScript и React, а также практической React-задачей с API. В конце интервьюеры разбирают решение и дают кандидату обратную связь.
Запись учебного live-coding собеседования frontend-разработчика: кандидат с его слов имеет около двух лет коммерческого опыта и рассказывает о командной работе, спринтах, оценке задач, тестировании и архитектуре текущего продукта. Далее интервьюеры проверяют TypeScript, JavaScript и React: generics, utility types, Event Loop, Babel, hoisting, иммутабельность, throttle/debounce, тестирование и инфраструктуру. В практической части кандидат реализует React-запрос к API с состояниями загрузки и ошибки, после чего обсуждает рефакторинг через кастомный хук и переиспользуемый компонент. В финале интервьюеры дают положительную оценку и советуют углубить знания в tooling и тестировании; это мнение участников mock-интервью, а не результат реального найма.
Подготовьте связный рассказ о проекте: состав команды, двухнедельные спринты, декомпозиция задач, оценка, feature-ветки, регрессия на Stage и путь до production.
Повторите TypeScript на практических примерах: generics, type guards, utility types вроде Pick, Record и Exclude, declaration merging интерфейсов и компромиссы enum.
Умейте объяснить Event Loop через call stack, очереди microtask и macrotask, а также привести рабочий пример requestAnimationFrame — в интервью обсуждали отрисовку и прокрутку связей в широкой таблице или диаграмме Ганта.
Чётко различайте throttle и debounce: первый ограничивает частоту вызовов, второй ждёт паузы во вводе; примерами здесь служат скролл и поиск с запросом к серверу.
Для live coding сначала обозначайте состояния data, loading и error, типизируйте ответ API и отдельно обрабатывайте ошибочный HTTP-ответ и JSON-данные.
После работающего минимального решения обсудите рефакторинг: вынесение запроса и состояний в кастомный хук, а условного рендеринга загрузки и ошибки — в переиспользуемую обёртку.
Повторите React-вопросы о reconciliation и Virtual DOM, lazy loading, Context, forwardRef, useRef и кастомных хуках; в ответах важно называть ограничения Context по лишним перерендерам.