Список самых главных вещей, которые нужно знать для успешного прохождения интервью для фронтенд разработчика.

Технические фронтенд интервью — сложные и это факт. Вам не только нужно иметь полное понимание основ компьютерной науки, но и понимать такие вещи, как производительность веб-страниц, системы сборки и CSS фреймворки.

Существуют различные ресурсы на эту тему, но я понял, что немногие из них могут полноценно помочь вам подготовиться к фронтенд интервью. Поэтому я решил написать пошаговую статью в надежде, что она поможет вам получить высшую оценку на вашем следующем интервью.

Перед интервью

Итак, перед интервью уточните у вашего рекрутера о его формате. Некоторые собеседования могут быть основаны на использовании доски, в то время, как другие — на использовании текстовых онлайн редакторов, типа CoderPad. Это важно знать для того, чтобы вы могли тренироваться в таких же условиях, в которых будет проходить интервью.

Понятия, связанные с фронтендом

HTML и CSS

HTML и CSS, Javascript, и шаблоны проектирования на Javascript являются ключевыми понятиями, которые будут проверяться на интервью. Пройдитесь по списку и убедитесь, что вы чувствуете себя уверенно относительно каждой темы.

HTML и CSS — как хлеб с маслом для клиентской разработки. В течении интервью, вас скорее всего спросят о нюансах HTML и CSS. Также, будьте готовы создать разметку на основе данного макета.

На всякий случай вам нужно освежить в памяти HTML и CSS, просмотрите следующие основные понятия:

• CSS анимации
• CSS спрайты
• Псевдоклассы
• Система сетки
• Семантическая вёрстка

В дополнении к этим понятиям, повторите CSS препроцессоры, такие как SASS или LESS, и их преимущества. Также ознакомьтесь с соглашениями о наименованиях CSS, такими как BEM и OOCSS.

Я уже упоминал, что некоторые интервьюеры будут просить вас создавать разметку в HTML и CSS. На практике это происходит на такой онлайновой платформе, как CodePen. Зайдите на Dribbble, там есть множество простых, но красивых проектов, которые интересно было бы воссоздать.

Наконец, насчет фронтенда, мы очень привыкли вносить изменения в нашем редакторе и затем проверят изменения в нашем браузере. Часто, в течение интервью, вы не сможете этого сделать. Когда вы готовитесь к интервью, постарайтесь создавать разметку, не проверяя результат до конца.

JavaScript

Если HTML и CSS — это хлеб с маслом фронтенд разработки, то Javascript – это нож. Компании будут уделять много времени в течение интервью на проверку ваших знаний Javascript. Многие вопросы будут основаны на следующих понятиях:

• Прототипное наследование
• Область видимости
• Замыкания
• Цикл событий
• Цепочка событий
• Методы: apply, call и bind
• Обратные вызовы и промисы
• Поднятие переменных и функций
• Каррирование

Когда задан вопрос по Javascript, поймите, на каком из этих понятий он основан и тогда будет проще найти верное решение. Если вы уверены в ваших знаниях Javascript, проверьте их здесь, здесь и здесь.

Шаблоны проектирования на Javascript предоставляют вам повторные решения общих проблем. Есть несколько шаблонов проектирования, которые важно знать:

• Декоратор
• Фабрика классов
• Синглтон
• Открытый модуль
• Фасад
• Наблюдатель
• MVC, MVP, MVVM

Кроме шаблонов проектирования на Javascript, важно быть ознакомленным с фреймворками Javascript. Это не значит, что вам нужно пойти изучать очередной фреймворк перед интервью. Вместо этого, поймите, когда и где команда фронтенд разработчиков использует фреймворки. Также, если ваше интервью основано на чем-то типа React + Flux или Angular, просмотрите некоторые материалы по архитектуре фреймворка заранее.

Понятия из компьютерной науки

Некоторые компании нанимают прежде всего разработчиков программного обеспечения, а уже потом фронтенд разработчиками. Это значит то, что эти компании ожидают от вас хорошей базы знаний в таких темах, как принципы проектирования программного обеспечения, масштабируемая архитектура кода и тестирование.

Если ваш рекрутер предлагает проверить ваши знания структуры данных и алгоритмов, этот раздел для вас. В ином случае, вы можете пропустить данный раздел. Если у вас нет основных знаний компьютерной науки, это нормально. Большинство из этих понятий хорошо поддаются изучению.

Есть основные структуры данных, которые я бы порекомендовал к изучению на зубок. Не просто читайте о них, потратьте время на их реализацию на Javascript. Если вы не знакомы с модульным тестированием, проверяйте структуру данных с помощью такой библиотеки, как Mocha.

• Связные списки
• Хеш таблицы
• Стеки и очереди
• Деревья (бинарные деревья и куча)
• Графы

Примечание: Для графов, также знайте, как реализовать обход в глубину и ширину.

Для реализации этих структур данных, вы можете зайти на SanFoundry. Все представленные там примеры — для Java, но преобразовать их для Javascript довольно просто.

После того, как вы будете уверены в своих знаниях структур данных, вы можете перейти к сортировке. Пройдитесь по списку, реализуйте его в Javascript и затем составьте список по временной сложности и использованию памяти.

• Двоичный поиск
• Пузырьковая сортировка
• Сортировка методом вставок
• Сортировка методом слияния
• Быстрая сортировка
• Сортировка методом выбора

После просмотра структуры данных и алгоритма, проверьте свои знания на Leetcode и с помощью этих вопросов.

Подводя итоги

Я знаю, что это много материала для изучения, особенно, если вы новичок в фронтенд разработке. Начните готовиться к интервью заранее, в таком случае вы сможете двигаться в подходящем для вас темпе.

Также помните, что интервью не являются показателем вашей ценности как программиста. Некоторые люди хороши в интервью, другие нет. Иногда интервью проходит успешно, иногда нет.

Другие статьи по теме

Собеседование на должность программиста: вопросы по алгоритмам

Как легко пройти собеседование

Удачи!

Перевод: Софья Лепёхина

Источник