Front-End Engineer Blog
4.99K subscribers
36 photos
101 links
Hi, my name is Evgenii Ray. I'm SWE at Meta. Here is my place for posting notes about UI, career and personal development

Welcome on board 🚀
Contact: @evgeniiray
Languages: English, Russian
Download Telegram
День 162 - Молчания рекрутят

Небольшой апдейт по ситуации с собесами и небольшие советы тем, кто подается.

Amazon AWS
Я подавался в проект Contact Center в Ванкувер. Рекрутер связалась со мной и назначила интервью, затем на след неделе связалась опять, и сказала, что придется отложить собес на сентябрь из-за того, что в Ванкувере до сентября стоп hire для иностранных кандидатов.

Ну ок 💁‍♂️

Apple
Подавался через реферала. Вакансия тоже в Ванкувере. Заполнил профиль. Ожидаю, что свяжутся на следующей неделе. Ждем 🤔

Facebook London
Рекрутер связалась и спросила даты для phone call. Написал, что всю следующую неделю, можем говорить. В пн пингану ее. Ожидаю фон кол на следующей неделе.

Google
Знакомый рекрутер сказал - набираем только в Варшаву. По всем офисам сейчас пока лимитированный hire. Так что пока пролет 🛸

Microsoft
Нужная мне вакансия в Ванкувере, к сожалению закрылась. В Мюнхене тоже, пока грустно. И тут пролет

Electronic Arts
Отписались, что пока не рассматривают иностранных кандидатов. Пролет 🛸

Итого, в гонке остаются Amazon, Facebook и Apple и это еще даже phone call не было 😁

ℹ️ Советы
Благодаря нашим властям, иностранные компании не могут процессить данные россиян, если не имеют серверов в России. Поэтому, если вы начнете стандартный процесс заполнения профиля на внутренних сайтах компаний, вас попросят послать ваше резюме почтой или факсом, в далекую Индию и непонятно, что случится потом с ним.

Заходим под VPN и наши проблемы решены. Как не странно, компании спокойно все процессят 😁 Для Microsoft не выбирайте регион Россия на внутреннем сайте, иначе вернетесь к тому с чего начали.

Следующие шаги

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

1. Решаю 2-3 Leetcode задачки в день
2. Изучаю книгу Design Data Intensive Applications
3. Немного прорабатываю behavioral questions.
4. Прохожу моки

Всем теплого лета ☀️
👍1
День 163 - Привет из FB
Рекуртер назначил на завтра phone call. Ну, вздрогнем.
День 164 - Привет из FB, часть 2

Успешно прошёл первый phone call. На самом деле, был просто разговор с очень милой HR, без технических вопросов.

Рекрутер сказала - литкода не будет, не трать время.

Стоит ожидать практические вопросы по JS. В общем, feels like frontend.

Планирую засетапить технический скрин через неделю - две.

Сейчас буду разбирать основные задачи, которые могут встретиться на тех скрине. Буду делиться в канале.

Бомбим дальше 👍
День 171 - Привет из FB, часть 3

Назначил тех скрин на 4 августа. К сожалению, рекрутер не дал назначить раньше - сказал готовься. Но она то не знает, что я уже почти пол года этим занимаюсь 😁. Тех скрин, как я понимаю, будет не очень сложный. Ожидаю базовые JS вопросы и несколько задачек на фронт. Но лучше готовиться к худшему

Все задачи разобрал во фронтенд доке в Notion

Советую сделать мемори карды и уметь в Notepad за 10 минут решить каждую . На тех. скрине у ФБ есть большая вероятность, что будут именно они.

Кстати попробовал связаться с Gainlo, по поводу платного мок интервью с ФБ инженером, мне ответили что у них нет фронтендеров из ФБ 🙁

Следующие шаги
Неопределенность, немного напрягает. Но пока в планах сделать следующее:

1. Поревьювить весь фронт материал
2. Подготовить ответы на Behave вопросы
3. Тренировать мемкарды 🤷🏻‍♂️
4. Поработать с DOM API

Stay tuned 👍
1
День 182 - Phone Call is coming 📞

Давно не писал, на самом деле не было апдейтов. В основном занимался повторением уже написанного материала и общением с ребятами из ФБ в Linkedin.

По Phone Call - есть ощущение, что я готов к нему 😁 Полный экспириенс положительный и негативный я конечно же распишу в канале, а также выложу все вопросы.

Хайринг на E4 позиции зафрижен, так что я иду на E5. Это означает, что нужно очень сильно напречься, особенно с System Design и бехейв частью. Поэтому, принял решение, если успешно прохожу фоун кол - записываю серию видео по System Design для фронтендера с разбором типовых задач. Материала такого в интернете нет абсолютно, а готовиться нам как то нужно.

Эти видосы отправлю везде где можно, включая ребят из ФБ в Линкеде, чтобы получить комментарии. Бладогаря этому у нас будет материал, на что можно опираться во время подготовки и всем станет немного легче.

Phone Call завтра в 18.00 по мск 🙈

Всем теплого августа ☀️
День 185 - Привет из ФБ часть 4

Прошел успешно технический скрин в ФБ 💪

Следующий этап - онсайт. Для онсайта придется очень сильно напречься. Планы следующие:

1. Готовлюсь System Design, записываю видосы, получаю фид-бек. Шарю в канале эти видео.
2. Готовлюсь к Behave части, да тут придется тоже поработать.
3. Mock Interview с FB инжинером. Планирую провести несколько платных сессий. Если интервьвер разрешит, я их запишу и поделюсь

Всем спасибо за поддержку.

Надеюсь, все только начинается 🙏
День 195 - Начинаю подготовку к on-site | 72 дня до онсайта 💪

Последнюю неделю занимался в основном рабочими и семейными вопросами. Сейчас начинаю готовиться к on-site с ФБ. Онсайт пройдет в 2 дня, что однозначно плюс.

26 октября - 2 Coding Round + HR interview
27 октября - Behavioral and Motivation interview + System Design

👨‍💻 Coding Round

1 раунд - фокус на HTML, CSS, JS и использование браузерного апи
2 раунд - алгозадачка адаптированная под фронт, рекрутер сказала, что много задач на DOM деревья дают

System Design

Я попросил рекрутера подробно рассказать, что стоит ожидать от этого раунда. Все как и ожидалось - Grokking System Design нам тут не поможет. Рекрутер привела пример вопроса - Design Netflix. Вот как должен выглядить дизайн раунд:

0-5ая Минута - выяснение требований, обсуждение понимания задачи

Самые важные 5 минут, нам нужно понять требования поставленные перед нами, выделить фичи продукта, о которых будем говорить. Остальное интервью будет посвящено high-level имлементации этих фичей.

🔥 5-30ая минута - проектирование

Основной фокус:
1. Архитектура компонентов, как мы разбиваем сайт на компоненты
2. Выделение наиболее важных частей приложения
3. Как загружаем данные, продумываем API поиска, фильтрации, протокол
4. Accesibility - делаем сайт доступным для пользователей с ограниченными возможностями, основные принципы, правильное использование цветовой палитры, адаптирование для Screen Readers
5. UX консерны - пагинация или infinite scroll. Обсудить трейдофы и паттерны. Где какой применять и почему.
6. Оптимизация - critical render path, lazy loading, asset gzipping и тд

🚀 30-35ая минута - final thoughts

Тут как я понял, если остается время, можно спустится немного на сервер и обсудить базовый System Design.

35-45 минута - Вопросы

Задаем интересующие нас вопросы.

⚠️ Важное замечание: в этом интервью говорить должен ТЫ, у тебя будет 5 минут на выяснение требований, остальные 80-90% времени, ты драйвишь дискуссию, интервьювер должен молчать - рекрутер сделал огромный акцент на этом.

Начал работу над System Design. К сожалению, понял, что продакшен этого дела займет у меня значительное время. Ближайший месяц планирую посвятить именно этому. Пока что, делаю большой документ с различными дизайн топиками. Хочу получить что то вроде "Grokking System Design" для фронтенда и по готовому материалу записать 5-6 видосов.

Работы ждет очень много, заправляем бензобаки друзья 🚀, мы зашли очень далеко, чтобы уже остановиться

Женя. Конец связи.
День 213 - System Design | Part 1

Небольшой апдейт по работе над систем дизайн докой. Печь горит на полную. Информации получается очень много. Думаю в сумме выйдет ~ страниц 100. Далее буду паковать это в формат 40минутного видео.

Сейчас работаю над систем дизайн PinInterest

Едем дальше 🚀
День 228 - System Design | Part 2

Небольшой апдейт. Закончил дизайн Netflix и PinInterest. Дал отревьювить написаные 3 топика ФБ инженерам. Были даны неплохие комментарии, которые учтены.

Следующие на очереди уже попроще
1. Facebook Messenger
2. Typeahead Widget
3. Poll Widget

Если у вас есть знание о том, какой сис диз вопрос задают в ФБ, пишите в личку. Я добавлю его в пайплайн. На следующей неделе планирую закончить продакшен документа и перейти к видео.

Увидимся 💪
День 233 - System Design | Part 3

Закончил писать док по System Design. Отнял сил он достаточно. Разобрал следующие топики:

- Facebook News Feed
- Facebook Messenger
- Facebook Poll Widget
- PinInterest
- Netflix
- Typeahead Widget

Начинаю продакшен видосов в качестве тренировки перед System Design.
Планирую завершить все на этой неделе, так как остальное время хотел бы потратить на кодинг и бехейв.

Док и видосы опубликую позже, по готовности всего )

Едем дальше 💪
День 249 - System Design | Part 4

Небольшой апдейт по видео с систем дизайном. Закончил записывать следующие топики:

- Netflix
- Facebook News Feed
- Pinterest
- Chat App

Осталось дозаписать Poll Widget. На самом деле, очень необычный опыт и рад, что сделал это в качестве тренировки. Ощущение, что это очень сильно помогло. Также я подготовил схемы в draw.io, которые планирую использовать в реальном интервью. Библиотеку всех схем отдам тоже в паблик, но уже после моего интервью, чтобы избежать курьезных ситуаций 😂

Следующие шаги:
1. Записать видео по Poll Widget
2. Обновить список возможных on-site задач. За последние 2 недели, я собрал много интересных задачек с реальных интервью. Обновлю фронтенд доку.
3. Начинаю готовиться к Behavioral раунду.

Весь материал опубликую по готовности.
Осталось ждать недолго. Спасибо, что читаете ☺️
День 261 - Финишная прямая

Небольшой апдейт, перед важным днем 🙈

1. Закончил продакшен всех видео по System Design 🍻

Component Design:
- Data Table
- Search Suggestion
- Poll Widget

Product Design:
- Netflix
- PinInterest
- Chat Application

System Design:
- Facebook News Feed

2. Задачки

Все накопленные фронт задачки, собрал в список с решениями.

3. Бехейв

Был бесплатный и платный мок с двумя Engineering Manager из ФБ. Я был напуган, что много людей валят бехейв и решил перестраховаться со своими историями. Оба сказали - strong hire. Стало немного легче, но страшно все-равно 🙈

⚠️ Че, когда публикуешь то видео и задачки?

27 Октября, после финального интервью, буду начинать публикацию всех материалов выше. Задачку выложу сразу, видео будут публиковаться раз в 2 дня. Подходит конец истории, в которую было вложено 8 месяцев, увидим, что получилось.

🍁Всем теплой осени 🍁
День 267 - Начало и конец 🤔

Вот и закончился процесс интервью с Facebook и скорее всего и весь общий забег в 8 мес. К сожалению, COVID_19 внес коррективы и из запланированных компаний, получилось поинтервьювироваться нормально только с ФБ. Мы прошли долгий путь, начали алгоритмов, закончили фронтовым систем дизайном. Этим постом, я хочу просуммировать, какая работа была проделана.

👨‍🏫 Алгоритмы

Пожалуй это самый интенсивный этап в моей подготовке. Подъем в 6 утра до работы, учеба 5 часов в день алгоритмов и затем работа. Было сложно, но мы прошли через это.

1. Algorithms and Data Structures Part 1, 2 - великолепный курс дяди Сенджвика, с ним мы погрузились глубоко в изучение структур данных, выполнили все домашки, написали куча конспектов

2. Замечательный канал Абдула Барри, лучший материал по Time Complexity, а также алгоритмам.

3. Leetcode - сколько боли в этом слове. Здесь я прорешал 304 задачи. И, это совершенно мне не понадобилось ::troll:: .

👨‍💻Фронтенд

После мы переключились на более прияную часть, фронтенд. Здесь мы разобрали самые коварные части JS и фронта. Так родился фронт-док, который очень мне помог в процессе собесов

1. Фронт док: https://www.notion.so/Front-End-Preparation-a0ac842415a04ddf9319718ea6ba22a4

2. Было прорешано и найдено куча фронтенд задач. Которые действительно мне попались на интервью. Все задачи из 6, которые были у меня на интервью есть в доке, кроме одной. Но она там скоро окажется 🙂

3. Видео по систем дизайну, трудно было представить, что для тренировки я буду записывать видео по нему. Вышло неплохо и очень близко к тому, что было на реальном интервью.

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

Как и обещал, ниже сейчас опубликую первое видео по System Design. Микрофона у меня нет, поэтому за кровь из ушей и русский акцент не ручаюсь 😀 Первый блин комом.

Автор канала уходит в ретроспективу и думки о будущем. В ближайшее время опубликую опыт интервью.

Всем желаю удачи с подготовке 🍻 and may the force be with you
4
День 279 - Интервью бесконечности, Часть 2

Сегодня был телефонный разговор с рекрутером по систем дизайну. В общем, все оказалось до жути забавно и грустно. Систем дизайн прошел очень хорошо и я в целом полностью meet the bar, но из-за того, что я использовал готовые формочки для мокапа компонентов, у интервьювера появилась мысль, что у меня конспект и я мог делать все не самостоятельно - what a shame ::harold_hide_the_pain::.

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

Интервью назначу через 3 недели - не будьте мной 😑
День 299 - Интервью бесконечности, Часть 3

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

Небольшие заметки, которые я сделал по своим ошибкам 🤔 :

Смотреть в камеру, первые несколько записей мой взор устремлялся вдаль и с точки зрения интервьювера, это полное отсуствие eye-контакта, что ощущается странно. Старайтесь смотреть в объектив, запись видео сильно помогает исправить эту ошибку 🙂

Место не бесконечное, на draw.io, все просто, бесконечный канвас, рисуй и не переживай. На доске, нужно заранее планировать распределение места. Особенно, если она маленькая. Я приобрел доску 150х100 и места все-равно не хватает. Если не хватает места, просите интервьювера сделать скриншот и дальше уже стирайте.

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

Несколько цветов. Получается на много понятнее, если использовать сразу несколько цветов. Я довольно быстро наловчился. Заранее запомните, какой цвет для чего будете использовать. это помогает следовать плану

Фокус на самом главном. На draw.io я мог рассказывать больше аспектов, на доске, без готовых форм, я планирую фокусироваться на наиболее важных вещах, перфоманс, доступность и тд. Планируйте свой рассказ не в 45 минут, а в 30-35. Так как в процессе, будут вопросы от интервьювера, которые съедают время.

⚠️ Небольшая особенность System Design интервью в ФБ
Исходя из моего опыта и опыта коллег, систем дизайн в ФБ, это не совсем диалог. В Амазоне, ожидали активную дискуссию, в ФБ это больше похоже на рассказ Сеньора-Помидора юным падаванам. То есть - монолог. Задавайте движение интервью, внимательно читайте намеки интервьювера. Вы драйвите это интервью, вопросы должны быть в начале, на этапе выяснения требований, далее, не спрашивайте что рассказывать, наоборот, говорите то, что сами считаете важным. Если интервьювер делает тонкий намек, читайте его и направляйте дискуссию.

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

С наступающей зимушкой вас ❄️
Получен оффер от Facebook - Frontend Engineer 🎉🎉🎉
🔥11👍1
Теперь без счетчика дней ☺️

Дорогие подписчики, спасибо за Вашу поддержку и доброту. Это было большой мотивацией для меня на всем пути. Я планирую и дальше вести канал и выкладывать полезные вещи в будущем. Ниже я приложу примерный план того, что я хочу рассказать в дальнейшем. Просьба, напишите в комментах, что еще Вам бы было Вам интересно ☺️

Планы по материалам

🔧 System Design
1. Закончу выкладывать видео по сис дизу
2. Базовые заметки и опыт моего систем дизайна

👨‍💻Coding
1. Видео - разбор самых сложных интервью кодинг вопросов для фронтов
2. Видео разборы дизайна различных виджетов ( рейтинг, табы и тд ), которые часто спрашивают на интервью

🏋🏻‍♂️ Hardest Parts of Front-End
Самые сложные и продвинутые части фронта
- имлементация инфинит скролла ( vanila / react )
- имлементация masonry layout ( vanila / react )
- real-life использование продвинутого API - Intersection Observer, Mutation Observer, Resize Observer

🚀 Performance
На реальных примерах, хочу разобрать все детали перфоманса и оптимизации.

А также, просто личные заметки про релокацию, Лондон и т.д.
Автор уходит в небольшой отпуск. Видео по сис дизу продолжу выпускать раз в неделю.
———

Всем морозной и снежной зимушки ❄️

#alert
👍2
Front-End Engineer Blog pinned «https://telegra.ph/Kak-polzovatsya-materialom-kanala-12-15»