«Тяп - ляп и в production» — шуточное высказывание, бродившее на страницах Confluence первой компании, в которой я работал. Оно как никогда кстати подходит под описание моего начального пути развития в Frontend разработке.
Интро
Хочу поделиться своим опытом вхождения в профессию frontend developer.
Имел диплом преподавателя информатики и работал в школе, но всегда хотел стать программистом. Привлекала работа с интерфейсами, получение новых знаний в IT, да и в целом подобная романтика. Во время обучения в колледже даже баловался вёрсткой, но совсем немного.
В декабре 2017 года родилась дочка, денег в семье стало не хватать, и я решил, что пришло время менять профессию.
Процесс обучения
Когда у тебя есть основная работа и грудной ребёнок дома, сложно найти свободное время, но выхода у меня не было. Тут как в пословице — что посеешь, то и пожнёшь. С улыбкой на лице вспоминаю заголовки некоторых статей и видео курсов на YouTube: «Весь HTML за час», «JS за 2 часа. Урок от профессионала» и так далее. Хотелось, конечно, отделаться малой кровью, но как? За плечами минимальные знания вёрстки и Pascal.ABC на уровне того, что преподают в школах.
Была поставлена цель — к лету найти стажировку, дабы получить опыт коммерческой разработки и после трудоустроиться на позицию верстальщика. Дальше начать учить JavaScript и по нарастающей. Начал с базового интенсива по вёрстке от HTML-академии, попутно проходил их интерактивные курсы по HTML и CSS.
Около 5 месяцев ночами по 2-4 часа, с кружкой кофе в обнимку, я верстал по макетам странички. В общей сложности осилил где-то 5 или 6 макетов. За окном была весна, апрель. Я решил, что пришло время поисков работы.
Поиск работы
Составил резюме на HH и «Мой круг». Написал про себя как есть: «Ищу подработку/стажировку с минимальной оплатой, можно и без, если будете кормить». Скилами резюме не отличалось: HTML, CSS, да и всё. Даже адаптивно верстать на тот момент не умел, куда уж там остальное!
Нашел вакансию на позицию джуна в организацию, работавшую на «Госуслуги». Постучался, рассказал свою ситуацию. На личное собеседование не позвали, так как искал работу ближе к лету, но решили, что сделаю тестовое удалённо, чтобы был какой-то результат от переговоров. Сверстал форму с кучей полей и кнопок, прикрутил плагин-валидатор из библиотеки Jquery. Как он работает, толком не понял, что-то сделал, завелось, да и ладно. Отправил. Ответили, что готовы позвать на работу после личного собеседования. Первая небольшая победа!
Дальше работа уже начала сама меня искать. Позвонили и позвали на собеседование из компании, занимающейся оформлением деловых командировок под ключ: перелёт, отель, трансфер, ЖД билеты. Им требовался junior-frontend разработчик на 2 проекта: лендинг и back-office. Оба на React. На собеседовании разговаривали в основном про вёрстку. Из вопросов были: поток, блочные/строчные элементы, позиционирование, построение сеток — всё в таком духе. По итогам собеседования дали тестовое задание — сверстать лендинг по макету, сделать его адаптивным под планшет и телефон. Последнее я как раз делать не умел. С адаптивом разобрался быстро: сделал тестовое примерно за 4 дня и отправил на проверку. Спустя неделю получил приглашение на финальное собеседование — общение с командой.
Бородатые дядьки в очках и свитерах
Пришёл в офис разработки, поздоровался, HR показала, куда можно присесть. Я плюхнулся в компьютерное кресло и начал ждать начала собеседования. Постепенно в комнату начали на креслах въезжать программисты: бородатые, в очках, бородатые в очках, без очков. Если совместить всех, получится как раз тот собирательный образ, который возникает у большинства в голове при слове «программист».
Когда все были в сборе, мы начали общение. Этот на первый взгляд не самый важный этап собеседования, но на самом деле он определяет по большей части твою дальнейшую судьбу в компании. Если ты выполнил техническое задание, тебя готовы взять на работу. Остаётся выяснить, что ты за человек.
Тебе задают много вопросов из разных областей, в том числе и по программированию и твоей будущей должности. Но тут они больше общего характера, для проверки того, насколько ты в теме, а не для того, чтобы узнать насколько глубоки твои знания. В основном спрашивают про прошлую работу, любимую музыку, фильмы, книги, личную жизнь. Узнают твои интересы.
По результатам этого собеседования я получил оффер с условием, что первое время у меня будет обучение JS с плавным входом в профессию. Вот это уже была большая победа!
Hello World
Начались трудовые будни. К слову, программировать я не умел на тот момент от слова «совсем». Поэтому около двух недель я штудировал материалы по базовому JS, смотрел бесплатные курсы Hexlet и читал доку по React. Информация не хотела оседать в голове.
«Нет времени объяснять, по ходу разберешься», — примерно с таким посылом я начал писать на React. Учился на ходу в рантайме, пробелы в знаниях заполнялись по мере их обнаружения. Первым заданием было как раз сделать адаптив для лендинга. Хорошая возможность, чтобы познакомиться с React и проектом в целом. После были задачи разной степени сложности: над некоторыми сидел неделями, разбираясь в коде, попутно изучая необходимый материал и прокачивая скилы. В общей сложности около 3 или 4 месяцев понадобилось для того, чтобы более или менее втянуться в происходящее вокруг. Очень повезло с тем, что слева сидел более опытный коллега, который постоянно выручал и помогал во многом.
Next Level
Чем больше скилов в твоем аккаунте на «Мой круг» или HH, тем привлекательнее твое резюме для других компаний. Я не был исключением. Проработав около 6 месяцев, почувствовал в себе силы и начал ходить по собеседованиям, на которые приглашали.
Первое собеседование провалил с треском. Примерный список вопросов, на которые не ответил: замыкания, prototype, метод reduce, все вопросы по DOM, как работает сервер, что такое AJAX.
К слову, я неплохо справлялся с большим количеством задач на своей работе, но писал на языке, основ которого не знал. И самое страшное, что было для меня на тот момент — я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения.
Далее было 3 успешных собеседования с примерно одинаковыми тестовыми заданиями:
- Приложение на React, эмулирующее голосование в режиме реального времени.
- Приложение на Vue. Нужно было забрать данные с сервера и отрисовать 2 странички, настроив роутинг.
- Приложение на VanillaJS. Нужно было отрисовать около трёх страничек и написать свой Router, основанный на hash-навигации. Это самое интересное ТЗ из всех, так как пришлось писать на чистом JS.
Каких- то жестоких экзаменов про языку мне не устраивали. Во всех трёх случаях я получил оффер. Пошёл туда, где были лучше условия. Устроился в достаточно крупную компанию на тяжелый проект со стеком React/Redux/Pixi.
Специфика проекта была в корне другая, стало, мягко говоря, сложновато. Не было привычных HTML, CSS, зато появилась куча незнакомых библиотек, а вдобавок ко всему не совсем крепкие знания языка, на котором пишу. Любой шаг влево или вправо проявлял пробелы в знаниях и вводил в ступор. Проработал 4 месяца, втягиваясь в стек технологий, на котором приходилось писать и приступил к систематизации и закреплению того багажа знаний, который успел получить. К этому моменту опыт разработки составлял примерно 10 или 11 месяцев.
Важно: «И самое страшное, что было для меня на тот момент — я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения».
Go to Back. Hello Hexlet
Искал какие-то курсы по JS с возможностью проходить их в удобном для меня режиме, без спешки. Выбор пал на Hexlet. Сел я за обучение с лицом эксперта, но после первых уроков решил, что повременю пока с этим титулом для себя.
Голова кипела от количества информации. Удивляло большое количество вещей, на которые раньше не обращал внимание или просто не знал. Мозг взрывался при решении практических заданий к урокам, а потом взрывался снова от осознания решения учителя.
Практические задания в Hexlet — очень крутая штука, так как теория по сути даёт не так много пользы, как время проведенное в ярости при поиске ответа на вопрос: «Почему, мать вашу, эта дрянь не работает?»
Ты меняешь свой образ мышления в программировании, начинаешь видеть несколько решений для задачи, их плюсы и минусы. Лезешь в тесты, разбираешь их долго и муторно, добираясь до той самой «эврики». Пишешь свой map, filter, reduce, удивляясь тому, как это работает под капотом. И вот настает тот день, когда ты можешь открыть любой капот (и увидеть там другой капот… Шутка!) уже в боевом проекте на работе и понять, как там что работает. Покопаться в тестах, отрефакторить легаси и сделать этот мир чуточку лучше.
Весь процесс обучения — это трудности, преодолевая которые ты становишься сильнее! Тут я научился думать, самостоятельно решать проблемы, писать красивый и понятный код.
Спасибо всем, кто сделал этот ресурс! Самые крутые и интересные курсы, которые я встречал. Почти закончил профессию «Фронтенд JavaScript», но останавливаться не собираюсь. В планах пройти несколько проектов и освоить «Бэкенд JavaScript».
Для тех, кто только начинает свой путь программиста, большой вам совет: начните с основ, получите крепкую базу и только потом двигайтесь дальше. А самое главное, не учите язык, учитесь программировать!
