В этой статье вы узнаете все подробности о профессии фронтенд-разработчика: что нужно знать, где и как обучаться, где можно работать и за какие деньги.
Также в этой публикации мы подготовили для вас подборку онлайн, офлайн курсов и вузов, которые помогут добиться совершенства во фронтенде. А на десерт вас ждет большая подборка полезных бесплатных материалов.
Не забудь подписаться на наш Телеграм канал! Каждый день мы публикуем бесплатные лекции, уроки, мастер-классы, интенсивы.
Кто такой фронтенд-разработчик? Обязанности, чем занимается
То есть интерфейсом (users/ using interface) и юзабилити: менюшками, фильтрами, кнопками, анимацией, формами, галереями, интерактивом, рекламными блоками и т.д. Он отвечает за корректную работу всех этих элементов веб-ресурса.
Результат работы этого специалиста играет одну из ключевых ролей в SEO продвижении сайтов и их популярности у ЦА. Он отвечает за верстку, реализацию функционала — все то, что напрямую влияет на пользовательский опыт и привлекательность площадки.
Иногда фронтенд-разработчик занимается и первичной структурой сайта. Результат его работы — удобный, быстрый сайт с тем самым интуитивным интерфейсом и ярким оформлением, соответствующим ожиданиям и потребностям пользователя.
Обязанности специалиста направлены на создание функционального интерфейса, который обеспечит положительный пользовательский опыт:
- верстка сайта и шаблонов под CMS;
- работа со скриптами для визуализации и анимации, их оптимизация;
- настройка всех блоков страниц (кнопок, галерей и остальных элементов сайта или приложения);
- проверка, тестирование функционала, устранение багов, автоматизация проекта.
F.D. закладывает костяк веб-ресурса по макетам веб-дизайнера, прорабатывает оформление, занимается организацией и отладкой программного кода, устраняет неточности и баги, автоматизирует проект. Он отвечает за соответствие результата задумке, за то, чтобы во всех браузерах ресурс выглядел одинаково презентабельно и работал как надо. В целом, фронтенд-разработчику нужно иметь представление о веб дизайне и верстке.
Что нужно знать
Условно выделяют два вида:
- core frontend developers. Хорошо разбираются в ядре JavaScript, создают новые функции на сайте, но не сильны в дизайн-аспекте.
- UX/UI frontend developers. Больше занимаются красотой и удобством интерфейса и не так сильны в бизнес-логике.
Независимо от этой классификации, чтобы добиться успеха в этой отрасли, нужно уметь очень много.
Что нужно знать:
- основы структур данных, операционных систем, алгоритмов;
- препроцессоры и сборщики LESS, SASS, GRUNT, GULP, Stylus;
- методология адаптивной, отзывчивой верстки, в том числе кроссбраузерной и кроссплатформенной;
- мобильная разработка;
- веб-шрифты;
- библиотеки и фреймворки jQuery, Bootstrap, Angular, React, Vue, Backbone и т.д.;
- система Git, GitHub, CVS и т.д.;
- базовое понимание адаптивного дизайна;
- популярные CMS (WordPress, Drupal, Joomla и другие) и варианты плагинов к ним;
- Photoshop и другие графические редакторы;
- шаблонизаторы, системы сборки и бандлеры;
- английский язык на уровне не ниже Intermediate, чтобы быть в состоянии читать спецификации;
- UI/UX-проектирование;
- основы SEO-оптимизации.
Если прямо углубляться, желательно знать OOCSS / BEM / SMACSS, Python, пригодится работа с объектами DOM, API, AJAX и CORS, понимание SVG, HTML5 API, ECMAScript 6, инструментов дебаггинга в духе Chrome Dev Tools и Firebug, баз данных и языков запросов MongoDB, SQL, MySql и т.д.
Это в идеале. Основное, что должен знать f.d. — конечно, HTML, CSS и JavaScript. Дополнительные инструменты и сервисы, которые нужно изучить, зависят от ниши фронтенда, которую вы выбрали.
Если разбить требования к знаниям по уровням:
- Стажеру достаточно знать JavaScript, HTML, CSS, Typescript и React.js.
- Джуниору — все, что выше, плюс Redux, БЭМ, Git, СУБД и адаптивную верстку.
- Миддлу — все, что знает джуниор, плюс Vue.js и кроссбраузерную верстку.
- Сениору — все, что выше, плюс Angular, Ruby on Rails и управление разработками.
- Лиду (ведущему специалисту) — все вышеперечисленное плюс основы управления персоналом, проектирование архитектуры ресурсов и приложений.
Зарплата и востребованность
Программист — одна из самых востребованных профессий. И фронтенд-разработчик — весьма популярная и хорошо оплачиваемая позиция.
Средняя зарплата на начало ноября 2020 года, по данным портала russia.trud.com, составляет около 92 тысяч рублей.
Средняя зарплата по уровням и скиллам:
- Джуниор — около 40-50 тыс. руб.
- Миддл — около 70-100 тыс. руб.
- Синиор — около 100-170 тыс. руб.
- Лид (ведущий специалист) — около 150-180 тыс. руб. и выше.
Обращаем ваше внимание: требования от вакансии к вакансии разнятся и их спектр довольно широк. Может потребоваться умение работать в командной строке Unix-систем, быстро разбираться в чужом коде и много чего еще. Уровень зарплат варьируется в зависимости от региона, страны и, естественно, ваших навыков и специализации. В России выше всего заработок фронтенд-разработчика в Москве — от 40 тыс. руб. для джуниоров.
В среднем для этой профессии (в рублях):
- в Москве, МО и Пермском крае — около 120 000;
- в СПб, Калининграде, Омске, Новосибирске и ряде других городов — около 100 000;
- в Казани и Екатеринбурге — около 90 000;
- в Краснодаре — около 85 000;
- в Новосибирске — около 60 000.
В регионах — от 50 000 и выше, например, в Екатеринбурге можно найти зарплату от 50 до 100 тыс. руб., во Владивостоке — от 40 до 150 тыс. руб., в Краснодаре — от 50 до 150 тыс. руб.
В целом, в России ЗП фронтенда колеблется в пределах 40-150 тыс. руб., в Москве средняя зарплата — от 100 до 260 тыс. руб. По данным портала Stack Overflow, основанным на опросах за 2019 год, годовая зарплата фронтедрера без опыта работы в РФ составляет от 510 тысяч рублей до 1 млн 300 тысяч рублей, то есть диапазон примерно такой же, как и по данным русских источников: от 42 до 108 тысяч рублей в месяц.
Джуниоры без опыта, как правило, могут рассчитывать в России на доход до 40 тысяч, спустя год — на 50-80 тысяч, миддлы — на 100-130 тысяч в месяц. А для лидов и синиоров зарплата в среднем от 150 тыс. рублей, но есть вакансии и на 350, и на 650 тысяч в месяц. Все зависит от региона, требований и компании, в которую вы устраиваетесь, и, конечно, от результатов собеседования.
Поднять свой доход можно, сотрудничая с зарубежными компаниями, в том числе и через иностранные биржи.
Востребованность профессии
На начало ноября 2020 года количество вакансий составляет:
на Russia.trud — 4496
на hh.ru — 4 900 (более 1 700 в Москве и около 900 вакансий в СПб)
Как всегда, чем больше вы умеете, тем выше вы ценитесь и получаете. К тому же, профессия фронтенд-разработчика — одна из тех, в которых без постоянного самообучения и освоения новых навыков не обойтись. Нужно прокачивать скиллы, следить за трендами, изменениями в требованиях к клиентской стороне сайтов, интерфейсу различных девайсов.
С чего начать и куда податься?
Где учиться на фронтенда и насколько успешным будет поиск работы, зависит от ваших целей и уже имеющихся знаний. Потому что, как и в случае со многими другими IT-профессиями, одних только курсов, самообучения или одной только вышки в вузе недостаточно. Нужен комплексный подход. Кроме того, в вузах РФ профессии фронтенд-разработчика почти не учат.
Если вы абсолютный новичок в программировании, в качестве базы и старта вам пригодится высшее техническое образование, связанное с информационными технологиями. Затем можно пройти пару онлайн или офлайн-курсов, связанных именно со фронтендом. Также важно постоянно заниматься самообучением, ведь эта сфера весьма динамична.
Плюсы и минусы занятий на курсах
Плюсы:
- структурированная, сбалансированная программа, включающая теорию и практику;
- программа актуальна, в большинстве случаев она регулярно обновляется вслед за изменениями в отрасли;
- есть программы, обучающие с нуля, то есть можно войти в ай-ти, минуя университеты (но на это, естественно, потребуется намного больше времени);
- поддержка наставников и коучей;
- проверка домашних заданий;
- возможность обучаться в индивидуальном темпе
- можно подобрать готовый план занятий под ваш текущий уровень знаний;
- сертификат об окончании обучения/повышении квалификации;
- пополнение портфолио выпускными работами;
- прямые контакты с представителями индустрии, в том числе и с потенциальными работодателями;
- также в стоимость часто входит гарантированное трудоустройство, помощь с решением этого вопроса и/или стажировка.
Минусы:
- большинство курсов платные, но стоимость очень разная, плюс многие учреждения предлагают скидки, рассрочки. Есть и бесплатные онлайн-курсы, в том числе и от именитых онлайн-школ и университетов, но в них не предусмотрена ни проверка домашних заданий, ни сертификаты, ни помощь с трудоустройством.
Плюсы и минусы самостоятельного обучения
Плюсы:
- бесплатные курсы и обучающий контент (видео, мануалы, статьи) есть как от рядовых разработчиков, так и от профессиональных гуру;
- Есть бесплатные материалы с хорошей программой и структурой;
- Контент бесплатный.
Минусы:
- самостоятельно подобрать программу, которая отвечает вашему текущему уровню, не всегда получается правильно.
- Занимаясь по бесплатным курсам, вы не получаете обратной связи от преподавателей, правильность выполнения практических упражнений придется оценивать самостоятельно, то есть интуитивно.
- Информация в сфере фронтенд-разработки устаревает со скоростью света, как и во всей IT-индустрии в целом, высок риск «попасть» на неактуальную информацию. И оценить актуальность материалов самостоятельно вы не сможете.
- Для эффективного обучения своими силами нужна железная воля и дисциплина.
- Нет помощи с трудоустройством.
- Многие бесплатные материалы (не все!) поверхностны.
Вывод: чтобы получить данную профессию, нужно комбинировать обучение программированию в вузе и самообучение или подобрать основательные онлайн/офлайн-курсы и сочетать их с самообучением.
Плюсы и минусы профессии
Плюсы профессии:
- обучиться ей могут даже новички в программировании. Есть множество платформ, позволяющих освоить специальность.
- Должность востребована.
- Есть карьерные перспективы, в том числе за рубежом.
- Высокая оплата труда.
- Широкое поле деятельности, множество ниш.
- Возможность работать удаленно, на фрилансе, в офисе.
Минусы профессии:
- необходимость самообучения в нон-стоп режиме по нескольким направлениям. Чтобы быть востребованным специалистом, нужно знать большой стек технологий, в том числе быть знакомым с back end разработкой, http, JSON, роутингом. Путь к успеху и высокой зарплате долог и тернист.
- Нечеткие границы должностных обязанностей — знать и уметь нужно много, особенно из смежных областей, ваши функции и задачи зависят от работодателя.
- Необходимо постоянно взаимодействовать с большим количеством коллег — бэкендерами, дизайнерами, менеджерами, пользователями, тестировщиками, аналитиками. Результат напрямую зависит от эффективности этого взаимодействия.
- Написание программного кода — довольно однообразная работа, что требует усидчивости.
- Оплошности фронтенд-разработчика сразу видны и пользователям, и заказчику — нужно работать филигранно, исправлять ошибки быстро.
Выдающиеся личности в профессии
Джеффри Зельдман. Один из звездных веб-дизайнеров, ведущая фигура в отрасли, автор книг-бестселлеров о веб-дизайне, одна из самых известных — Designing With Web Standards. Основатель компании Happy Cog, сотрудничавшей с Warner Bros. Pictures и другими компаниями мирового уровня.
Его сайт http://www.zeldman.com/.
Его соц. сети @zeldman
Статьи о нем здесь https://www.webmascon.com/personas/zeldman.asp и здесь https://ru.qaz.wiki/wiki/Jeffrey_Zeldman .
Видео-интервью с рассуждениями Джеффри Зельдмана о прошлом и будущем индустрии https://vimeo.com/219302853
Джесси Джеймс Гарретт. Основатель Adaptive Path, первой в мире компании, консультирующей по поводу создания дружественных для пользователя сайтов. Автор книги The Elements of User Experience, первопроходец в отрасли «информационной архитектуры».
Его твиттер @jjg
Статьи о нем здесь https://ru.qaz.wiki/wiki/Jesse_James_Garrett и здесь https://www.webmascon.com/personas/garrett.asp
Рич Харрис. Автор проектов Rollup (сборщик ES6-модулей), Svelte (быстрый фронтенд-фреймворк), Ractive (фронтенд-вреймворк для JS).
Статьи о Харрисе здесь https://www.infoq.com/news/2019/05/svelte-3-interview-rich-harris/ (на английском).
Твиттер Рича Харриса https://twitter.com/Rich_Harris
Дэн Абрамов. Разработчик, автор популярной библиотеки Redux. Статьи о Дэне здесь и здесь.
Твиттер Дэна @dan_abramov
Кайл Симсон. Знаменитость в сфере JavaScript, автор книг по разработке. Одна из них — You Don’t Know JS: Up — стала библией для JavaScript-разработчиков. Больше книг Кайла здесь. Также он автор серии курсов на Frontend Masters.
Статьи о Кайле здесь
Твиттер Кайла @getify
Эван Ю. Автор популярного во всем мире UI-фреймворка — Vue.js. Сотрудничал с Google.
Статьи об Эване https://habr.com/ru/post/350290/ и здесь и еще одна тут.
Твиттер Эвана @youyuxi
Егор Яковишен. Фронтенд-тимлид Setka Editor, Senior Front-end Developer в Look At Media, сооснователь стартапа в туристической сфере, трекер во ФРИИ, Мегафоне, Сбербанке. Автор и преподаватель курсов по JavaScript в Moscow Coding School и Skillbox.
Статьи о Егоре здесь https://skillbox.ru/media/code/v_sostoyanii_dedlayna_sverkhsposobnosti/
Твиттер Егора https://www.facebook.com/yaplusplus
Больше выдающихся веб-дизайнеров и фронтенд-разработчиков вы найдете здесь https://mcocos.ru/blog/design/znamenitye-dizainery/, здесь https://www.webmascon.com/personas/ и здесь https://habr.com/ru/post/140831/.
Где найти работу? Место работы, карьера
Фронтенд-разработчики нужны везде — в приложениях, коммерческих и информационных сайтах, всевозможных сервисах:
- компании, которые занимаются разработкой пользовательского программного обеспечения (CRM, ERP, BPM, корпоративные порталы и т.д.);
- банковские организации;
- рекламные агентства;
- операторы связи;
- ритейлеры, маркетплейсы, интернет-магазины;
- СМИ;
- компаниих, генерирующие развлекательный контент и ПО.
Как видим, поле деятельности для Frontend-разработчика очень широко, можно выбрать десятки направлений: от сферы электронного образования до интернет-банкинга. Работать можно на компании (как в офисе, так и удаленно) или в свободном фриланс-полете, находя заказы через биржи, в том числе и зарубежные (Freelancer, Upwork, Guru, Joomlancers, Gigster, Codeable, YouTeam и т.д.) и русских (Kwork, FL, Freelance и т.д.).
Куда расти в специальности:
- углубляться в кодинг и отладку;
- уходить в работу с интерфейсами, осваивать новые фреймворки и библиотеки;
- двигаться в направлении проектирования и архитектуры;
- уходить в техническую экспертизу и управление другими разработчиками.
Также можно стать full-stack developer, податься в backend, дизайн сайтов, мобильную разработку, тестирование или менеджмент. Но и в самом фронтенде при должном упорстве можно пройти путь от junior специалиста с окладом около 40 тыс. руб. до teamlead, получающего 200 тысяч в месяц и более.
Для начала можно пойти стажером в крупную компанию (при прохождении многих онлайн-курсов выпускникам помогают с трудоустройством и стажировкой). Если пока не уверены в своих силах, начать можно с должности верстальщика (достаточно HTML+CSS), а затем уже, по мере освоения JavaScript и библиотек, рассматривать и должность Frontend-разработчика.
Список онлайн курсов
Frontend-разработчик должен быть универсальным специалистом — верстать, «делать красиво», но и очень важно, чтобы он понял и сам сервер и разбирался в особенностях этого аспекта работы площадки. Каждое из этих направлений нужно освоить на должном уровне — приготовьтесь учиться упорно, ведь интерфейсы усложняются, как и требования к frontend-developer. Упростят задачу курсы с последовательной насыщенной программой, с которыми мы и предлагаем вам ознакомиться.
Skillbox
Skillbox помогает своим выпускникам с трудоустройством, выдает по окончании сертификат. В университете 300 образовательных программ, более 300 преподавателей. Обучение в Skillbox закончило более 63 тысяч студентов.
Преподают студентам эксперты рынка, обучение отличается обилием практических занятий, плотной обратной связью от опытных профильных специалистов, помощью студентам при работе над дипломными проектами. Это один из самых популярных онлайн-университетов.
Предложения обучения от Skillbox:
«Frontend-разработчик»
«Профессия Frontend-разработчик»
«Профессия Frontend-разработчик PRO»
«Веб-разработчик с нуля до PRO»
GeekBrains
На момент создания портал назывался «Школа программирования», что говорит о многом. Также учреждение предлагает более 1000 бесплатных курсов и интенсивов.
После прохождения обучения студентам выдается сертификат, компания помогает выпускникам устроиться на работу, устраивает на стажировку, в том числе и в ведущие в отрасли компании-партнеры GeekBrains. Преподают в этом университете ведущие специалисты, сейчас на сайте зарегистрировано более 3 млн пользователей. За каждым учеником закрепляется личный куратор-наставник.
Образовательные программы от GeekBrains:
«Frontend-разработчик»
«Факультет Frontend-разработки»
«ReactJS. Профессиональная frontend-разработка»
«Интенсив «Открытое онлайн-собеседование со студентом на вакансию junior frontend-разработчика»
Курсы в 2 частях по JavaScript от GeekBrains 1 уровень и 2 уровень
Netology
Представлено несколько популярных профессий, по каждой из которых есть курсы различной интенсивности.
В Нетологии вас ждет более 20 различных обучающих программ для программистов. Компания предлагает помощь с трудоустройством и стажировкой в ведущих IT-компаниях РФ. Программы насыщенные, практики во время обучения, как и в предыдущих двух школах, вас ждет много.
Программы от Нетологии, обучающие профессии:
«Frontend-разработчик с нуля»
«React: библиотека фронтенд-разработки №1»
SkillFactory
В команде — более 50 преподавателей. Компания является крупнейшим провайдером онлайн-образования в сегменте Data Science, сотрудничает с ведущими организациями, среди которых Яндекс, Ростелеком, Рамблер, Сбербанк.
Эти и другие партнеры помогают школе создавать сильные учебные программы, а также выступают работодателями для выпускников.
«Специализация Frontend-разработчик»
HEDU
В программе каждого из них предусмотрен один бесплатный урок, после которого вы сможете определиться, подходит ли вам это направление и заданная интенсивность обучения.
Предложения от HEDU:
«Онлайн-курс по frontend»
Яндекс.Практикум
Предусмотрен диплом об окончании, бесплатный вводный курс, помощь с трудоустройством. Представлено более 10 учебных программ, связанных с программированием.
«Профессия «Frontend-разработчика»
«Как стать middle фронтенд-разработчиком»
Hexlet
Хекслет — портал с практическими программами, который специализируется на обучении программированию. Представлены обучающие материалы для 6 различных профессий из этой отрасли. Всего в школе есть 115 курсов по верстке и программированию, которые уже прошло более 250 000 человек.
Учебные программы от Хекслет:
«Профессия Фронтенд-программист»
itProger
itProger — онлайн-школа IT профессий, которая обучила уже более 4 900 человек. Всего представлено 75 программ обучения, большая часть которых бесплатна. Выбор направлений широк — от геймдева до углубленного изучения языков программирования.
Предложения itProger:
«FRONT-END разработчик»
Mate Academy
Онлайн-школа Mate Academy интересна тем, что студенты оплачивают пройденный курс уже со своей зарплаты, после получения профессии фронтенд-разработчика — компания помогает с трудоустройством и только после него берет оплату за проделанную со студентом работу. Таким образом академия уже трудоустроила более 700 своих выпускников.
«Frontend онлайн-курс с трудоустройством»
FructCode
Онлайн-школа FructCode с помощью своих интерактивных обучающих материалов и уроков обучила программированию и веб-разработке более 77 тысяч человек, в ней есть возможность осваивать новую профессию в режиме 24/7.
«Курс HTML/CSS»
ITVDN
Онлайн-школа ITVDN предлагает более 180 видеокурсов, связанных с популярными языками программирования и информационными технологиями. Каждый месяц компания выпускает 2-3 новых обучающих программы — полученные в ней знания всегда актуальны.
«Frontend Developer»
HTML academy
Html Academy — портал интерактивных IT курсов с подробными тренажерами для оттачивания работы с HTML, CSS и JavaScript, часть из которых бесплатна. Обучение на практике, интенсивы и специализация портала именно на фронтенде — залог успеха.
Предложения от HTML Academy:
«Профессия «Фронтенд-разработчик»
Курсы в 2 уровнях по JavaScript — уровень 1, уровень 2
«Профессия «React-разработчик»
«React. Разработка сложных клиентских приложений»
Mobios School
Mobios School — онлайн-школа, специализирующаяся на обучении всех, кто связал свое будущее с ай-ти индустрией в рамках 6 популярным профессий. По окончании обучения выпускники получают сертификат.
«Front-end разработки»
Студия Oneway
Студия Oneway занимается подготовкой по популярным IT профессиям. Выпускники становятся стажерами в компаниях-партнерах, имея возможность сразу же получить работу и закрепить результат на практике.
Курс «Фронтенд»
beONmax
Школа beONmax — онлайн-платформа, которая обучила более 47 тысяч человек, посвященных IT и веб-разработке. Представлено более 30 авторских программ по 6 направлениям от профильных специалистов в каждой из ниш.
«Веб-программист — быстрый старт!»
Офлайн-курсы для фронтенд-разработчиков в Москве
Если вы хотите получить профессию фронтенд-разработчика очно в Москве, обратите внимание на следующие программы:
- «Специалист по Frontend / Java-разработчик» от Альфа-Банка и израильской высшей школы IT и безопасности HackerU
- «Front-end разработчик» от учебного центра «Специалист» при МГТУ им. Баумана
- «Java Script Junior программист Front-end» на очных IT курсах EasyUM в Москве
- «Разработка и продвижение WEB-проектов» от Компьютерная Академии ШАГ
- «Web-разработка с нуля» от NordicItSchool
Таких офлайн-занятий в Москве, на самом деле, довольно много — выбрать есть из чего.
Вузы Москвы для фронтенд-разработчиков
Выбирайте специальности, связанные с прикладной информатикой, информатикой и вычислительной техникой. Главное, помните: получив «корочку», вам все равно придется постигать тонкости профессии либо самостоятельно, либо проходя курсы (онлайн или офлайн).
Вузы Москвы, в которых вы получите хорошую базу в программировании:
- МГТУ им. Баумана (факультет СУ и информатики) http://iu.bmstu.ru/
- МТУСИ (факультет IT) https://mtuci.ru/about_the_university/departments/304/
- МИФИ (институт интеллектуальных киберсистем) http://icis.mephi.ru/
- Московский финансово-промышленный университет «Синергия» (факультет информационных технологий) https://synergy.ru/lp/vpo-dp1
- Московский открытый институт (факультет прикладной информатики) https://moi.edu.ru/napravleniya-i-speczialnosti/informatika/
- Московский гуманитарный университет, МосГУ
- Профиль «прикладная информатика в экономике» (Факультет экономики, управления и международных отношений) https://www.mosgu.ru/direction/bakalavriat/b-prinform-d/
- Национальный исследовательский технологический университет «МИСиС»
- (Институт информационных технологий и компьютерных наук) https://misis.ru/university/struktura-universiteta/instituty/itasu/
- Национальный исследовательский университет «МЭИ»
- Прикладная информатика в экономике (Инженерно-экономический институт НИУ «МЭИ») https://mpei.ru/Education/educationalprograms/Lists/OPOPlist/DispForm.aspx?ID=30
Также вам могут подойти вузы, перечисленные здесь https://msk.postupi.online/professiya/programmist/vuzi/ (обращайте внимание на блоки «программы для этой профессии», которые есть под названием каждого московского вуза из подборки).
Важные качества в профессии
Чтобы добиться успеха в профессии и не перегореть, вам должно быть интересно программирование, дизайн, английский язык и математика. Также нужно быть готовым к постоянному обучению.
Какими личными качествами должен обладать специалист:
- аналитический склад ума;
- усидчивость;
- коммуникабельность и умение работать в команде;
- чувство художественного стиля;
- ответственность;
- обучаемость;
- креативность;
- любознательность;
- соблюдение дедлайнов;
- стрессоустойчивость.
Часто задаваемы вопросы о профессии
Что должен уметь ф.р.?
Он должен уметь верстать веб-страницы, владеть языком JavaScript, знать языки верстки HTML и CSS, уметь работать с библиотекой jQuery. Большим преимуществом для новичка будет умение работать с одним или несколькими JavaScript-фреймворками (Angular, React, Vue.js), инструментами контроля версий Git, платформой Bootstrap, технологиями DOM, AJAX и JSON, инструментами сборки Gulp/Grunt. Также необходимо знать английский язык.
Что делает ф.р.?
Он создает веб-страницы по макетам дизайнера или сразу разрабатывает функционал сайта/приложения на сверстанной странице — прописывает логику работы различных элементов.
Сколько зарабатывает ф.р.?
В России зарплата варьируется от 40 до 200 тысяч рублей в месяц в среднем — в зависимости от региона, навыков специалиста и его опыта работы. Прокачайте для начала базовые скиллы, затем наращивайте знания, за которые работодатели готовы платить, и выйдете на хороший доход.
В чем преимущество профессии ф.р.?
Это одна из самых востребованных в ай-ти индустрии профессий, при этом порог входа в нее довольно низкий. Эту специальность можно освоить с нуля, даже не имея опыта в программировании, вопрос — только во времени, которое понадобится на обучение. Также профессия имеет большие перспективы для карьерного роста и увеличения зарплаты.
Чем frontend developer отличается от верстальщика?
Верстальщик создает из макета дизайнера веб-страницу с помощью несложных инструментов, достаточно знать HTML и CSS. Фронтендщик наращивает на эту страницу функционал с помощью библиотек и фреймворков JavaScript. Для работы ему нужно понимать принцип работы серверной части сайта. То есть функционал шире и знаний для работы требуется больше.
Чем ф.р. отличается от дизайнера?
Задача дизайнера — придумать, как будет выглядеть интерфейс сайта, фронтендщик претворяет его задумку в жизнь с помощью кода, чтобы доволен был не только заказчик, но и клиент ресурса. Но, также важно разбираться и в дизайне и иметь чувство стиля, уметь находить баланс между удобством и эстетикой.
Как стать ф.р.?
Можно обучиться самостоятельно, пройти курсы, получить профильное образование в вузе. Эффективнее сочетать все три либо какие-то два формата обучения. Набить руку в адаптивной, блочной, кроссбраузерной и кроссплатформенной верстке, в принципе, можно и практикуясь на макетах, которые есть в открытом доступе. Но опытный наставник очень желателен, особенно в начале пути — чтобы подсказать, помочь исправить ошибки.
Полезные ссылки по теме
Бесплатные курсы на Хабре: https://habr.com/ru/company/habr_career/blog/512040/
Книги:
- «Совершенный код» Стива Макконнелла.
- Книги Кайла Симпсона о JavaScript.
- «Выразительный JavaScript. Современное веб-программирование» Хавербеке Марейна.
- Книги по фронтенду издательства O'Reilly.
- «JavaScript — Подробное руководство 6-ое издание» Дэвида Флэнагана.
- «HTML5 и CSS3 — разработка сайтов для любых браузеров и устройств» Бена Фрейна.
- «Выразительный JavaScript: Введение» Марейна Хавербека (в переводе Вячеслава Голованова).
- «HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера» Н.А. Прохоренка (4-е издание).
- «CSS. Каскадные таблицы стилей. Подробное руководство» Эрика А. Мейера.
- «JavaScript. Шаблоны» Стояна Стефанова.
Также рекомендуем подборку учебников и книг по веб-программированию от blkportal http://blkportal.pp.ua/books/index.html
Сайты на английском:
Сайты на русском:
Статьи
- Подборка 70 инструментов для фронтендера от proglib.io https://proglib.io/p/frontend-workflow-instruments
- 34 лучших инструмента для frontend-разработчика от SkillBox https://skillbox.ru/media/code/34_luchshikh_instrumenta_dlya_frontend_razrabotchika/
- Как нетехнарю стать фронтендером https://intalent.pro/interview/lichnyy-opyt-kak-netehnaryu-stat-frontend-razrabotchikom.html
- История начинающего фронтенд-разработчика о его пути в профессии https://ru.hexlet.io/blog/posts/moy-put-front-end-js-developer
- Справочник по HTML http://htmlbook.ru/samhtml/vvedenie-v-html
- Самоучитель CSS http://htmlbook.ru/samcss
- Что должен уметь фронтенд-разработчик https://habr.com/ru/company/netologyru/blog/327294/
- Современный учебник JavaScript https://learn.javascript.ru/
- 50 бесплатных шаблонов сайтов на HTML5 и CSS3 http://www.websovet.com/50-besplatnyx-shablonov-sajtov-na-html5-i-css3
- Статья о начале пути в JavaScript (на английском) https://hackernoon.com/your-first-steps-in-a-front-end-developer-career-8b792771c857
- Интересные мнения о том, где учиться на фронтенда и вообще на ай-ти профессии https://nauchkor.ru/uploads/documents/5708ed735f1be7243036d2ca.pdf
Блоги на английском:
Блоги на русском:
Также внушительная подборка русскоязычных и англоязычных блогов, посвященных профессии, есть здесь https://habr.com/ru/post/468175/
Телеграм-каналы:
Также будет полезно изучить англоязычные телеграм-каналы TheFrontEnd, FrontEnd Development, Front End World.
Ютуб-каналы:
- канал Яндекса о фронтенде https://www.youtube.com/channel/UCMtlICYxr6Dz_PG9_SVqRYQ
- канал Front-end Science c Сергеем Пузанковым https://www.youtube.com/channel/UCmI5YBB9KJ0xLtFtgBX8rfw
Видео:
Группы ВК и ФБ:
- подборка сообществ и групп для разработчиков https://recrutach.ru/60links
Форумы:
- форум itvdn https://forum.itvdn.com/c/frontend-developer/213
При желании освоить профессию фронтенд-разработчика может каждый. Если вас интересует эта специальность, приступайте прямо сейчас — разобраться предстоит во многом, но это путешествие будет увлекательным. Онлайн или офлайн курсы в комплекте с самообучением помогут вам. Успехов!
Реклама. Информация о рекламодателе по ссылкам в статье.
