HTML Diff
0 added 0 removed
Original 2026-01-01
Modified 2026-02-26
1 <p>"Тяп - ляп и в production" - шуточное высказывание, бродившее на страницах Confluence первой компании, в которой я работал. Оно как никогда кстати подходит под описание моего начального пути развития в Frontend разработке.</p>
1 <p>"Тяп - ляп и в production" - шуточное высказывание, бродившее на страницах Confluence первой компании, в которой я работал. Оно как никогда кстати подходит под описание моего начального пути развития в Frontend разработке.</p>
2 <h2>Содержание</h2>
2 <h2>Содержание</h2>
3 <ul><li><a>Интро</a></li>
3 <ul><li><a>Интро</a></li>
4 <li><a>Процесс обучения</a></li>
4 <li><a>Процесс обучения</a></li>
5 <li><a>Поиск работы</a></li>
5 <li><a>Поиск работы</a></li>
6 <li><a>Бородатые дядьки в очках и свитерах</a></li>
6 <li><a>Бородатые дядьки в очках и свитерах</a></li>
7 <li><a>Hello World</a></li>
7 <li><a>Hello World</a></li>
8 <li><a>Next Level</a></li>
8 <li><a>Next Level</a></li>
9 <li><a>Go to Back. Hello Hexlet</a></li>
9 <li><a>Go to Back. Hello Hexlet</a></li>
10 </ul><h2>Интро</h2>
10 </ul><h2>Интро</h2>
11 <p>Хочу поделиться своим опытом вхождения в профессию frontend developer.</p>
11 <p>Хочу поделиться своим опытом вхождения в профессию frontend developer.</p>
12 <p>Имел диплом преподавателя информатики и работал в школе, но всегда хотел стать программистом. Привлекала работа с интерфейсами, получение новых знаний в IT, да и в целом подобная романтика. Во время обучения в колледже даже баловался вёрсткой, но совсем немного.</p>
12 <p>Имел диплом преподавателя информатики и работал в школе, но всегда хотел стать программистом. Привлекала работа с интерфейсами, получение новых знаний в IT, да и в целом подобная романтика. Во время обучения в колледже даже баловался вёрсткой, но совсем немного.</p>
13 <p>В декабре 2017 года родилась дочка, денег в семье стало не хватать, и я решил, что пришло время менять профессию.</p>
13 <p>В декабре 2017 года родилась дочка, денег в семье стало не хватать, и я решил, что пришло время менять профессию.</p>
14 <h2>Процесс обучения</h2>
14 <h2>Процесс обучения</h2>
15 <p>Когда у тебя есть основная работа и грудной ребёнок дома, сложно найти свободное время, но выхода у меня не было. Тут как в пословице - что посеешь, то и пожнёшь. С улыбкой на лице вспоминаю заголовки некоторых статей и видео курсов на YouTube: "Весь HTML за час", "JS за 2 часа. Урок от профессионала" и так далее. Хотелось, конечно, отделаться малой кровью, но как? За плечами минимальные знания вёрстки и Pascal.ABC на уровне того, что преподают в школах.</p>
15 <p>Когда у тебя есть основная работа и грудной ребёнок дома, сложно найти свободное время, но выхода у меня не было. Тут как в пословице - что посеешь, то и пожнёшь. С улыбкой на лице вспоминаю заголовки некоторых статей и видео курсов на YouTube: "Весь HTML за час", "JS за 2 часа. Урок от профессионала" и так далее. Хотелось, конечно, отделаться малой кровью, но как? За плечами минимальные знания вёрстки и Pascal.ABC на уровне того, что преподают в школах.</p>
16 <p>Была поставлена цель - к лету найти стажировку, дабы получить опыт коммерческой разработки и после трудоустроиться на позицию верстальщика. Дальше начать учить JavaScript и по нарастающей. Начал с базового интенсива по вёрстке от HTML-академии, попутно проходил их интерактивные курсы по HTML и CSS.</p>
16 <p>Была поставлена цель - к лету найти стажировку, дабы получить опыт коммерческой разработки и после трудоустроиться на позицию верстальщика. Дальше начать учить JavaScript и по нарастающей. Начал с базового интенсива по вёрстке от HTML-академии, попутно проходил их интерактивные курсы по HTML и CSS.</p>
17 <p>Около 5 месяцев ночами по 2-4 часа, с кружкой кофе в обнимку, я верстал по макетам странички. В общей сложности осилил где-то 5 или 6 макетов. За окном была весна, апрель. Я решил, что пришло время поисков работы.</p>
17 <p>Около 5 месяцев ночами по 2-4 часа, с кружкой кофе в обнимку, я верстал по макетам странички. В общей сложности осилил где-то 5 или 6 макетов. За окном была весна, апрель. Я решил, что пришло время поисков работы.</p>
18 <h2>Поиск работы</h2>
18 <h2>Поиск работы</h2>
19 <p>Составил резюме на HH и "Мой круг". Написал про себя как есть: "Ищу подработку/стажировку с минимальной оплатой, можно и без, если будете кормить". Скилами резюме не отличалось: HTML, CSS, да и всё. Даже адаптивно верстать на тот момент не умел, куда уж там остальное!</p>
19 <p>Составил резюме на HH и "Мой круг". Написал про себя как есть: "Ищу подработку/стажировку с минимальной оплатой, можно и без, если будете кормить". Скилами резюме не отличалось: HTML, CSS, да и всё. Даже адаптивно верстать на тот момент не умел, куда уж там остальное!</p>
20 <p>Нашел вакансию на позицию джуна в организацию, работавшую на "Госуслуги". Постучался, рассказал свою ситуацию. На личное собеседование не позвали, так как искал работу ближе к лету, но решили, что сделаю тестовое удалённо, чтобы был какой-то результат от переговоров. Сверстал форму с кучей полей и кнопок, прикрутил плагин-валидатор из библиотеки Jquery. Как он работает, толком не понял, что-то сделал, завелось, да и ладно. Отправил. Ответили, что готовы позвать на работу после личного собеседования. Первая небольшая победа!</p>
20 <p>Нашел вакансию на позицию джуна в организацию, работавшую на "Госуслуги". Постучался, рассказал свою ситуацию. На личное собеседование не позвали, так как искал работу ближе к лету, но решили, что сделаю тестовое удалённо, чтобы был какой-то результат от переговоров. Сверстал форму с кучей полей и кнопок, прикрутил плагин-валидатор из библиотеки Jquery. Как он работает, толком не понял, что-то сделал, завелось, да и ладно. Отправил. Ответили, что готовы позвать на работу после личного собеседования. Первая небольшая победа!</p>
21 <p>Дальше работа уже начала сама меня искать. Позвонили и позвали на собеседование из компании, занимающейся оформлением деловых командировок под ключ: перелёт, отель, трансфер, ЖД билеты. Им требовался junior-frontend разработчик на 2 проекта: лендинг и back-office. Оба на React. На собеседовании разговаривали в основном про вёрстку. Из вопросов были: поток, блочные/строчные элементы, позиционирование, построение сеток - всё в таком духе. По итогам собеседования дали тестовое задание - сверстать лендинг по макету, сделать его адаптивным под планшет и телефон. Последнее я как раз делать не умел. С адаптивом разобрался быстро: сделал тестовое примерно за 4 дня и отправил на проверку. Спустя неделю получил приглашение на финальное собеседование - общение с командой.</p>
21 <p>Дальше работа уже начала сама меня искать. Позвонили и позвали на собеседование из компании, занимающейся оформлением деловых командировок под ключ: перелёт, отель, трансфер, ЖД билеты. Им требовался junior-frontend разработчик на 2 проекта: лендинг и back-office. Оба на React. На собеседовании разговаривали в основном про вёрстку. Из вопросов были: поток, блочные/строчные элементы, позиционирование, построение сеток - всё в таком духе. По итогам собеседования дали тестовое задание - сверстать лендинг по макету, сделать его адаптивным под планшет и телефон. Последнее я как раз делать не умел. С адаптивом разобрался быстро: сделал тестовое примерно за 4 дня и отправил на проверку. Спустя неделю получил приглашение на финальное собеседование - общение с командой.</p>
22 <h2>Бородатые дядьки в очках и свитерах</h2>
22 <h2>Бородатые дядьки в очках и свитерах</h2>
23 <p>Пришёл в офис разработки, поздоровался, HR показала, куда можно присесть. Я плюхнулся в компьютерное кресло и начал ждать начала собеседования. Постепенно в комнату начали на креслах въезжать программисты: бородатые, в очках, бородатые в очках, без очков. Если совместить всех, получится как раз тот собирательный образ, который возникает у большинства в голове при слове "программист".</p>
23 <p>Пришёл в офис разработки, поздоровался, HR показала, куда можно присесть. Я плюхнулся в компьютерное кресло и начал ждать начала собеседования. Постепенно в комнату начали на креслах въезжать программисты: бородатые, в очках, бородатые в очках, без очков. Если совместить всех, получится как раз тот собирательный образ, который возникает у большинства в голове при слове "программист".</p>
24 <p>Когда все были в сборе, мы начали общение. Этот на первый взгляд не самый важный этап собеседования, но на самом деле он определяет по большей части твою дальнейшую судьбу в компании. Если ты выполнил техническое задание, тебя готовы взять на работу. Остаётся выяснить, что ты за человек.</p>
24 <p>Когда все были в сборе, мы начали общение. Этот на первый взгляд не самый важный этап собеседования, но на самом деле он определяет по большей части твою дальнейшую судьбу в компании. Если ты выполнил техническое задание, тебя готовы взять на работу. Остаётся выяснить, что ты за человек.</p>
25 <p>Тебе задают много вопросов из разных областей, в том числе и по программированию и твоей будущей должности. Но тут они больше общего характера, для проверки того, насколько ты в теме, а не для того, чтобы узнать насколько глубоки твои знания. В основном спрашивают про прошлую работу, любимую музыку, фильмы, книги, личную жизнь. Узнают твои интересы.</p>
25 <p>Тебе задают много вопросов из разных областей, в том числе и по программированию и твоей будущей должности. Но тут они больше общего характера, для проверки того, насколько ты в теме, а не для того, чтобы узнать насколько глубоки твои знания. В основном спрашивают про прошлую работу, любимую музыку, фильмы, книги, личную жизнь. Узнают твои интересы.</p>
26 <p>По результатам этого собеседования я получил оффер с условием, что первое время у меня будет обучение JS с плавным входом в профессию. Вот это уже была большая победа!</p>
26 <p>По результатам этого собеседования я получил оффер с условием, что первое время у меня будет обучение JS с плавным входом в профессию. Вот это уже была большая победа!</p>
27 <h2>Hello World</h2>
27 <h2>Hello World</h2>
28 <p>Начались трудовые будни. К слову, программировать я не умел на тот момент от слова "совсем". Поэтому около двух недель я штудировал материалы по базовому JS, смотрел<a>бесплатные курсы Hexlet</a>и читал доку по React. Информация не хотела оседать в голове.</p>
28 <p>Начались трудовые будни. К слову, программировать я не умел на тот момент от слова "совсем". Поэтому около двух недель я штудировал материалы по базовому JS, смотрел<a>бесплатные курсы Hexlet</a>и читал доку по React. Информация не хотела оседать в голове.</p>
29 <p>"Нет времени объяснять, по ходу разберешься", - примерно с таким посылом я начал писать на React. Учился на ходу в рантайме, пробелы в знаниях заполнялись по мере их обнаружения. Первым заданием было как раз сделать адаптив для лендинга. Хорошая возможность, чтобы познакомиться с React и проектом в целом. После были задачи разной степени сложности: над некоторыми сидел неделями, разбираясь в коде, попутно изучая необходимый материал и прокачивая скилы. В общей сложности около 3 или 4 месяцев понадобилось для того, чтобы более или менее втянуться в происходящее вокруг. Очень повезло с тем, что слева сидел более опытный коллега, который постоянно выручал и помогал во многом.</p>
29 <p>"Нет времени объяснять, по ходу разберешься", - примерно с таким посылом я начал писать на React. Учился на ходу в рантайме, пробелы в знаниях заполнялись по мере их обнаружения. Первым заданием было как раз сделать адаптив для лендинга. Хорошая возможность, чтобы познакомиться с React и проектом в целом. После были задачи разной степени сложности: над некоторыми сидел неделями, разбираясь в коде, попутно изучая необходимый материал и прокачивая скилы. В общей сложности около 3 или 4 месяцев понадобилось для того, чтобы более или менее втянуться в происходящее вокруг. Очень повезло с тем, что слева сидел более опытный коллега, который постоянно выручал и помогал во многом.</p>
30 <h2>Next Level</h2>
30 <h2>Next Level</h2>
31 <p>Чем больше скилов в твоем аккаунте на "Мой круг" или HH, тем привлекательнее твое резюме для других компаний. Я не был исключением. Проработав около 6 месяцев, почувствовал в себе силы и начал ходить по собеседованиям, на которые приглашали.</p>
31 <p>Чем больше скилов в твоем аккаунте на "Мой круг" или HH, тем привлекательнее твое резюме для других компаний. Я не был исключением. Проработав около 6 месяцев, почувствовал в себе силы и начал ходить по собеседованиям, на которые приглашали.</p>
32 <p>Первое собеседование провалил с треском. Примерный список вопросов, на которые не ответил: замыкания, prototype, метод reduce, все вопросы по DOM, как работает сервер, что такое AJAX.</p>
32 <p>Первое собеседование провалил с треском. Примерный список вопросов, на которые не ответил: замыкания, prototype, метод reduce, все вопросы по DOM, как работает сервер, что такое AJAX.</p>
33 <p>К слову, я неплохо справлялся с большим количеством задач на своей работе, но писал на языке, основ которого не знал. И самое страшное, что было для меня на тот момент - я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения.</p>
33 <p>К слову, я неплохо справлялся с большим количеством задач на своей работе, но писал на языке, основ которого не знал. И самое страшное, что было для меня на тот момент - я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения.</p>
34 <p>Далее было 3 успешных собеседования с примерно одинаковыми тестовыми заданиями:</p>
34 <p>Далее было 3 успешных собеседования с примерно одинаковыми тестовыми заданиями:</p>
35 <ol><li>Приложение на React, эмулирующее голосование в режиме реального времени.</li>
35 <ol><li>Приложение на React, эмулирующее голосование в режиме реального времени.</li>
36 <li>Приложение на Vue. Нужно было забрать данные с сервера и отрисовать 2 странички, настроив роутинг.</li>
36 <li>Приложение на Vue. Нужно было забрать данные с сервера и отрисовать 2 странички, настроив роутинг.</li>
37 <li>Приложение на VanillaJS. Нужно было отрисовать около трёх страничек и написать свой Router, основанный на hash-навигации. Это самое интересное ТЗ из всех, так как пришлось писать на чистом JS.</li>
37 <li>Приложение на VanillaJS. Нужно было отрисовать около трёх страничек и написать свой Router, основанный на hash-навигации. Это самое интересное ТЗ из всех, так как пришлось писать на чистом JS.</li>
38 </ol><p>Каких- то жестоких экзаменов про языку мне не устраивали. Во всех трёх случаях я получил оффер. Пошёл туда, где были лучше условия. Устроился в достаточно крупную компанию на тяжелый проект со стеком React/Redux/Pixi.</p>
38 </ol><p>Каких- то жестоких экзаменов про языку мне не устраивали. Во всех трёх случаях я получил оффер. Пошёл туда, где были лучше условия. Устроился в достаточно крупную компанию на тяжелый проект со стеком React/Redux/Pixi.</p>
39 <p>Специфика проекта была в корне другая, стало, мягко говоря, сложновато. Не было привычных HTML, CSS, зато появилась куча незнакомых библиотек, а вдобавок ко всему не совсем крепкие знания языка, на котором пишу. Любой шаг влево или вправо проявлял пробелы в знаниях и вводил в ступор. Проработал 4 месяца, втягиваясь в стек технологий, на котором приходилось писать и приступил к систематизации и закреплению того багажа знаний, который успел получить. К этому моменту опыт разработки составлял примерно 10 или 11 месяцев.</p>
39 <p>Специфика проекта была в корне другая, стало, мягко говоря, сложновато. Не было привычных HTML, CSS, зато появилась куча незнакомых библиотек, а вдобавок ко всему не совсем крепкие знания языка, на котором пишу. Любой шаг влево или вправо проявлял пробелы в знаниях и вводил в ступор. Проработал 4 месяца, втягиваясь в стек технологий, на котором приходилось писать и приступил к систематизации и закреплению того багажа знаний, который успел получить. К этому моменту опыт разработки составлял примерно 10 или 11 месяцев.</p>
40 <p><em>Важно: "И самое страшное, что было для меня на тот момент - я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения".</em></p>
40 <p><em>Важно: "И самое страшное, что было для меня на тот момент - я мыслил на React. Так вышло, что моё мышление замкнулось внутри этой библиотеки, и мозг отказывался воспринимать то, что под капотом это JavaScript. React и JS были для меня двумя разными вещами. Так начали проявляться первые минусы несистемного обучения".</em></p>
41 <h2>Go to Back. Hello Hexlet</h2>
41 <h2>Go to Back. Hello Hexlet</h2>
42 <p>Искал какие-то курсы по JS с возможностью проходить их в удобном для меня режиме, без спешки. Выбор пал на Hexlet. Сел я за обучение с лицом эксперта, но после первых уроков решил, что повременю пока с этим титулом для себя.</p>
42 <p>Искал какие-то курсы по JS с возможностью проходить их в удобном для меня режиме, без спешки. Выбор пал на Hexlet. Сел я за обучение с лицом эксперта, но после первых уроков решил, что повременю пока с этим титулом для себя.</p>
43 <p>Голова кипела от количества информации. Удивляло большое количество вещей, на которые раньше не обращал внимание или просто не знал. Мозг взрывался при решении практических заданий к урокам, а потом взрывался снова от осознания решения учителя.</p>
43 <p>Голова кипела от количества информации. Удивляло большое количество вещей, на которые раньше не обращал внимание или просто не знал. Мозг взрывался при решении практических заданий к урокам, а потом взрывался снова от осознания решения учителя.</p>
44 <p>Практические задания в Hexlet - очень крутая штука, так как теория по сути даёт не так много пользы, как время проведенное в ярости при поиске ответа на вопрос: "Почему, мать вашу, эта дрянь не работает?"</p>
44 <p>Практические задания в Hexlet - очень крутая штука, так как теория по сути даёт не так много пользы, как время проведенное в ярости при поиске ответа на вопрос: "Почему, мать вашу, эта дрянь не работает?"</p>
45 <p>Ты меняешь свой образ мышления в программировании, начинаешь видеть несколько решений для задачи, их плюсы и минусы. Лезешь в тесты, разбираешь их долго и муторно, добираясь до той самой "эврики". Пишешь свой map, filter, reduce, удивляясь тому, как это работает под капотом. И вот настает тот день, когда ты можешь открыть любой капот (и увидеть там другой капот… Шутка!) уже в боевом проекте на работе и понять, как там что работает. Покопаться в тестах, отрефакторить легаси и сделать этот мир чуточку лучше.</p>
45 <p>Ты меняешь свой образ мышления в программировании, начинаешь видеть несколько решений для задачи, их плюсы и минусы. Лезешь в тесты, разбираешь их долго и муторно, добираясь до той самой "эврики". Пишешь свой map, filter, reduce, удивляясь тому, как это работает под капотом. И вот настает тот день, когда ты можешь открыть любой капот (и увидеть там другой капот… Шутка!) уже в боевом проекте на работе и понять, как там что работает. Покопаться в тестах, отрефакторить легаси и сделать этот мир чуточку лучше.</p>
46 <p>Весь процесс обучения - это трудности, преодолевая которые ты становишься сильнее! Тут я научился думать, самостоятельно решать проблемы, писать красивый и понятный код.</p>
46 <p>Весь процесс обучения - это трудности, преодолевая которые ты становишься сильнее! Тут я научился думать, самостоятельно решать проблемы, писать красивый и понятный код.</p>
47 <p>Спасибо всем, кто сделал этот ресурс! Самые крутые и интересные курсы, которые я встречал. Почти закончил профессию "Фронтенд JavaScript", но останавливаться не собираюсь. В планах пройти несколько проектов и освоить "Бэкенд JavaScript".</p>
47 <p>Спасибо всем, кто сделал этот ресурс! Самые крутые и интересные курсы, которые я встречал. Почти закончил профессию "Фронтенд JavaScript", но останавливаться не собираюсь. В планах пройти несколько проектов и освоить "Бэкенд JavaScript".</p>
48 <p>Для тех, кто только начинает свой путь программиста, большой вам совет: начните с основ, получите крепкую базу и только потом двигайтесь дальше. А самое главное, не учите язык, учитесь программировать!</p>
48 <p>Для тех, кто только начинает свой путь программиста, большой вам совет: начните с основ, получите крепкую базу и только потом двигайтесь дальше. А самое главное, не учите язык, учитесь программировать!</p>