Вернуться в видеотеку

Собеседование Frontend разработчика. ЗП до 300к

Разбор технического собеседования Frontend-разработчика с live coding на React и вопросами по JavaScript и TypeScript. Автор показывает задачи на состояние, валидацию формы, асинхронный запрос, эффекты и типизацию вариантов данных.

Источник: Software developer

Открыть на YouTube

Таймлайн

Коротко о видео

Автор показывает запись недавнего собеседования на позицию Senior Frontend-разработчика; по его мнению, вопросы оказались сравнительно несложными, хотя вакансия предполагала самостоятельную разработку проекта с нуля. В интервью кандидат реализует React-счётчик с задержкой и форму логина, а затем отвечает на вопросы о debounce и throttle, React Hooks, областях видимости JavaScript, TypeScript и коллекциях Set/Map. В конце разбирают моделирование взаимоисключающих вариантов данных через union types и дискриминирующее поле в TypeScript.

Затронутые темы

Что взять на заметку

  • Для задания со счётчиком нужно заранее уточнить семантику быстрых кликов: блокируются ли новые действия, отменяется ли предыдущий таймер или все изменения должны накопиться; при отложенных обновлениях состояния важно избегать stale closure и применять функциональную форму setState.
  • Для debounce полезный прикладной пример — поиск или фильтрация: запрос отправляется после паузы во вводе, чтобы не обращаться к API на каждый символ. Throttle, напротив, ограничивает частоту обработки события.
  • В React-форме следует хранить значения email и password в state как controlled inputs, блокировать кнопку при пустом email или пароле короче шести символов и отдельно учитывать состояние загрузки.
  • Асинхронный login-обработчик должен ожидать ответ сервера, отключать кнопку во время запроса, условно показывать текст ошибки и очищать его при следующей попытке или изменении данных.
  • Нужно уметь объяснить useEffect: callback эффекта не должен быть async и возвращать Promise; асинхронную операцию запускают из обычного callback, а cleanup возвращают отдельной функцией. Также проверяются массив зависимостей, делегирование событий, event.target и event.currentTarget.
  • Для TypeScript важны discriminated unions: отдельные типы вариантов с общим полем-дискриминатором позволяют запретить невозможные сочетания свойств. В JavaScript два разных массива с одинаковым содержимым остаются разными ключами Map, поскольку объекты сравниваются по идентичности.

Рекомендуем посмотреть

46 мин
Frontend

СОБЕСЕДОВАНИЕ НА FRONTEND РАЗРАБОТЧИКА ЗП 250К. LIVE CODING

Запись интервью на Middle+ frontend-позицию: от обсуждения опыта кандидата до вопросов по браузеру, CSS, JavaScript, React, TypeScript и практических задач. Автор проходит его под вымышленной легендой для демонстрации процесса зрителям.

55 мин
FrontendSenior

Прохожу СОБЕСЕДОВАНИЕ НА SENIOR FRONTEND. ЗП 400к и Live coding

Запись собеседования на senior frontend-вакансию с разбором ответов кандидата, технических вопросов и двух live-coding задач. В конце автор показывает полученный оффер и названную сумму компенсации.

50 мин
Frontend

НЕУДАЧНОЕ СОБЕСЕДОВАНИЕ на FRONTEND РАЗРАБОТЧИКА. Live coding

Разбор неудачного для автора фронтенд-собеседования с live coding и вопросами по JavaScript, React и TypeScript. Во второй части собеседники рассказывают о монорепозитории, Context/RxJS, собственном UI kit и миграции проектов на Next.js.