Каждый день виртуальный мир становится объемнее на 550 новых сайтов и веб-приложений. Это дело рук и мозговых извилин фронтенд-девелоперов, которые создают все, что мы видим в браузерах.
По словам экспертов из справочника ПВТ «ИТ-абитуриент 2022», Frontend-разработчик остаётся одной из топовых IT-профессий. Кроме того, знания JavaScript позволяют быстро войти в другие направления: например, в Back-End или в мобильную разработку. А в рейтинге популярности языков TIOBE JavaScript занимает 7 место.
Как Frontend-разработка выглядит сегодня, какие знания нужны начинающим фронтендерам и как проходит обучение на курсах по Front- End — об этом и не только пообщались с Юрием Семененко, Front-End Engineer в компании Monterosa и тренером курсов по разработке сайтов и веб-приложений в IT-Academy.
— Юрий, чем занимается Frontend-разработчик?
— Обычно я привожу в качестве простой аналогии автомобиль. Все, что под капотом машины: двигатель, аккумулятор, радиатор, подвеска и т. д. — это back-end. А то, что снаружи: кузов, салон, интерьер — это front-end.
Front-End — видимая часть продукта, его обертка. Но он тесно связан с бэкендом: если обертка красивая, а внутренняя часть сделана некачественно, продукт работать не будет; но и при отлично реализованной внутренней составляющей продукт продаваться не будет, если у него нет красивой обертки. Поэтому бэкендеры и фронтендеры всегда работают сообща.
— Бытует мнение, что Front-End намного проще Back-End. Это правда?
— 7 – 8 лет назад, возможно, так и было. Тогда фронтендом занимались верстальщики, которые просто превращали в код макеты дизайнеров. Они использовали HTML, CSS и немножко JavaScript в слайдерах и плагинах, а добавлением, обработкой и отображением данных занимался бэкендер. Сейчас все изменилось: бэкенд только присылает данные, которые обрабатываются, сортируются и отображаются уже фронтендом.
Не так давно я наткнулся на технический спор в Twitter о том, что появились раздельные вакансии Frontend Developer (HTML, CSS) и Frontend Developer (JavaScript). То есть наша работа стала еще более программистской, и связь с бэкендерами теперь теснее.
— Куда можно расти во Frontend-разработке?
— Front-End — гибкая область, где можно развиваться в разных направлениях. На занятиях я обычно показываю студентам сайт roadmap.sh. Это очень обширная карта, которая демонстрирует, в каких областях разработки ты можешь себя реализовать, стартуя с базы Front-end, и какие дополнительные знания для этого нужны. Пойти можно куда угодно, все зависит от желания. У меня были студенты, которые после курса развивались как верстающие UI\UX специалисты и тестировщики. Были те, кто ушел в бэкенд, что тоже позволяет база JavaScript (работа с node.js). Даже есть примеры студентов, которые поняли, что создавать код — это не их путь, и выбрали направление управления проектами.
А если брать градацию: Junior, Middle, Senior и так далее, то здесь все зависит от отдельной компании и от того, какой у человека опыт. Бывают случаи, когда на собеседовании кандидат, который до этого работал на позиции Senior, демонстрирует знания уровня Junior. Возможно, он просто лет 5 работал только в одном узком направлении и просел во многих вопросах. А бывает и наоборот, когда человек был недооценен и, придя собеседоваться на Middle вакансию, показывает крепкие знания, которые присущи Senior-позиции. Поэтому эти градации условны.
— Какие технологии нужно знать сегодня, чтобы стать хорошим Frontend-разработчиком?
— Я всегда за хорошую базу. Не нужно бросаться в изучение фреймворков, не зная верстки и программирования. Такие люди будут очень долго расти в зарплате и тратить время на то, чтобы наверстать базовые знания. Поэтому я за то, чтобы сначала выучить HTML, CSS, JavaScript, а потом уже приступать к изучению фреймворков. В последние годы рынок особо не меняется и все так же остаются востребованы такие библиотеки и фреймворки, как React, Vue и Angular. Если кого-то интересуют детали, то я всегда советую смотреть на хорошо реализованную статистику на сайте https://stateofjs.com/ru-ru/.
— Чем фреймворк отличается от библиотеки?
— Фреймворк — это инструментарий, который предоставляет четкие правила создания хорошего проекта с использованием базовых элементов (HTML, CSS, JavaScript). Если ты знаешь базовые принципы, то изучить любой фреймворк будет не так уж и сложно.
Библиотека — это просто набор хороших функций, объектов и классов, из которых ты можешь собрать проект. В отличие от фреймворка, здесь нам не навязывают, какая архитектура должна быть у проекта.
React позиционирует себя как библиотека, а Angular и Vue— как фреймворки. Проекты на React могут отличаться архитектурой и построением файловой системы, а на фреймворках строятся практически одинаковые в этом плане проекты. Конечно, они выглядят по-разному, но структура и код очень похожи из проекта в проект.
Так, Angular, будучи фреймворком, навязывает свои правила создания фронтенда, то есть там четко прописано, какие компоненты нужно создавать и как они должны быть взаимосвязаны. Это иногда бывает преимуществом, особенно для начинающих разработчиков.
— А как сейчас обстоят дела с вакансиями по Front-End?
— Понятно, что на сегодняшний день бизнесу тяжело и набор приостановлен или снижен. Но, если у вас есть возможность получать доход на текущем месте работы и параллельно еще прокачиваться в новой сфере, обучайтесь и ждите своего часа. Всегда найдется какая-нибудь вакансия и откроется новый проект. Этот застой не может длиться вечно. В начале пандемии тоже был спад, но все осознали, что можно эффективно работать удаленно, и начался подъем. Опять же, бизнес — это очень живой организм, который адаптируется ко всему. Рано или поздно наступит момент, когда начнут открываться проекты и понадобятся новые люди. Что-то спрогнозировать я не могу, но нужно хвататься за то время, какое есть. Если у тебя есть желание развиваться, развивайся и учись прямо сейчас. Ты найдешь свою работу, даже если сначала будешь делать проекты на фрилансе. Но, когда снова наступит рост, тебе будет проще найти работу и выделиться на фоне остальных благодаря своим pet-проектам.
— А в процессе обучения Frontend-разработке в IT-Academy студенты тоже создают свои проекты?
— Да. Многие мои студенты выкладывают свои портфолио с проектами, сделанными на курсе, и потом эти портфолио уже обрастают новыми проектами. Также никто не мешает развивать дальше свой итоговый проект: выучил после курса что-то новое — добавил туда новую фишку.
Проект на курсе — это отправная точка. Я очень радуюсь, когда вижу, что у моих выпускников стоят в резюме эти начальные проекты как то, с чего они начали и чему научились после.
— Вы ведете 2 курса «Разработка веб-сайтов на HTML, СSS и Javascript» и «Разработка веб-приложений на JavaScript». Что изучается на каждом курсе?
— Есть три кита, на которых стоит фронтенд, — HTML, CSS и JavaScript. Первый курс я сравниваю со школой, где тебя учат основам — циферкам и буковкам, т. е. как считать и читать. Сначала ты изучаешь HTMLи СSS, дальше идет небольшой ознакомительный блок с JavaScript. Это, так сказать, начальная программа до 5 класса включительно. Затем идет старшая школа, когда только появляются страшные геометрия, биология, физики и химия и становится немного сложнее. Т.е. на втором курсе уже идет изучение программирования: структуры данных, общий объектно-ориентированный подход, архитектурные паттерны, как работает браузер и т. д. Это уже программа по 11-й класс. Получается, что Front-end 1 + Front-end 2 — это ваше школьное образование. Это образование дает возможность поступить в любой университет, то есть выбрать любой фреймворк и любое направление: бэкенд-разработку, тестирование или фронтенд на Reactили Angular, да хоть уйти в мобильную разработку (React-native и Flutterмогут с этим помочь). Поэтому, если нет структурированных знаний по верстке, начинай с базового курса «Разработка веб-сайтов на HTML, СSS и Javascript» (Front-end 1), где идет обучение с нуля. Данный курс дает полное представление о том, как работают сайты и из чего они состоят. На нем ты сможешь сверстать свой первый сайт. Если уже есть крепкие знания верстки, тогда можно идти на «Разработку веб-приложений на JavaScript» (Front-end 2). Но здесь некоторые слушатели сталкиваются с проблемой: как правильно оценить свои знания. Потому что иногда приходят студенты, которые утверждают, что уже знают верстку. Но после первых занятий я понимаю, что они знают её плохо и им нужно еще дочитывать и разбираться в нюансах. Есть и такие студенты, которые, чтобы сэкономить, идут сразу на профессиональный курс и после 2-3 занятий осознают, что не могут потянуть этот курс и уходят, не осознавая, что заняли чье-то место.
— А как студенту оценить свои возможности максимально адекватно, прежде чем идти на курс «Разработка веб-приложений на JavaScript» ?
— Я подготовил небольшой тест с каверзными вопросами для тех студентов, кто хочет попасть сразу на Front-end 2. Если человек набирает определенное количество баллов, это значит, что нужные базовые знания есть. Может, и не глубокие, но их можно использовать на профессиональном курсе и двигаться дальше.
— Сколько в среднем нужно заниматься самостоятельно, помимо занятий с тренером, чтобы успешно освоить программу курсов?
— Все свободное время. Все три месяца, если говорить об одной части курса, нужно максимально отдавать себя обучению. Помимо занятий я всегда даю много дополнительной информации, которую студенты могут освоить самостоятельно. Как бы это банально ни звучало, я параллельно стараюсь научить своих студентов учиться, чтобы они после окончания курса не ждали, что еще что-то произойдет и кто-то направит, а продолжали самостоятельно развиваться. Они должны научиться находить информацию и вычленять нужную, искать полезные ресурсы и так далее. Самостоятельное непрерывное обучение — это очень важный процесс, без которого не будет карьерного роста. Поэтому минимум времени — это занятия + часа 2-4 в неделю на домашние задания. Но вы должны быть готовы уделять все свободное время учёбе, и тогда эффект будет феноменальный.
Когда мои студенты заканчивают курс и смотрят на то, что они в итоге сделали за весь процесс обучения, часто удивляются, как они смогли это сделать сами, и понимают, что все было не зря. Я стараюсь поддерживать связь с выпускниками и мне радостно видеть, как они развиваются и двигаются дальше. Это то приятное чувство, ради которого я и нахожусь на курсах.
Сделать первые шаги в одно из самых топовых направлений разработки можно на курсах по Front-End в IT-Academy.
#frontend #фронтенд #вебразработка #айтикурсы #программированиеснуля