Привет, если ты начинающий разработчик и хочешь устроиться на позицию джуна, то эта статья для тебя.
Frontend разработчик - человек который разрабатывает интерфейсы сайтов и веб приложений. В отличии от верстальщика, frontend обладает более глубокими знаниями и навыками работы с JavaScript.
До недавнего времени, меня интересовал тот же вопрос, однако внятных и исчерпывающих материалов по данной теме немного, особенно на русском языке.
Стек технологий
Для получения информации о навыках, необходимых начинающему разработчику стоит обратиться на платформу для поиска работы, например headhunter. Там вы найдете актуальные навыки.
Сейчас я перечислю минимальный набор технологий, необходимый для трудоустройства, актуальный на момент написания статьи. Позже пройдемся по каждой из технологий подробнее.
- HTML5, CSS3
- JavaScript
- Препроцессоры (Sass, Less)
- Сборщики frontend (Gulp или Webpack)
- Системы контроля версиями, в частности git
- Актуальный JS фреймворк/библиотека построения интерфейсов (React, Vue, Angular)
1) HTML5 - самый базовый навык, необходимый любому веб разработчику. Не нужно заучивать все теги - это просто бессмысленно. Найдите самые применяемые (h1-6, div, p, a) и закрепляйте на практике.
Лучший вариант - это зайти на популярный сайт, открыть панель разработчика и посмотреть какие теги используются на нем.
Обязательно используйте семантические теги (header, footer и т.д.)!
2) CSS3 - необходимо знать типы селекторов и большинство свойств. Дам совет - учите CSS на практике, как и все остальное в этой статье :).
Обязательно знание flexbox и желательно CSS grid. Сюда же добавляется и адаптивная/отзывчивая верстка.
3) JavaScript - основной навык frontend разработчика. Без него - никуда.
Лучший источник для изучения JS в русскоязычном сегменте интернета - learn.javascript.ru (ни в коем случае не реклама). Лично я учился по статьям с этого сайта.
Пройдемся по необходимым разделам:
Часть 1:
- Основы JavaScript
- Объекты: основы
- Типы данных
- Продвинутая работа с функциями
- Промисы, async/await
Часть 2:
- Документ
- Введение в события
Часть 3:
- Сетевые запросы
Это необходимый минимум того, что вы обязаны знать, претендуя на позицию джуна. Также обязательно освойте стандарт ES6 и выше.
4) Препроцессоры - позволяют ускорить процесс написания стилей и улучшают поддерживаемость кода. Также необходимо узнать о методологиях разработки, например БЭМ. Изучить можно прочитав документацию, ее вполне достаточно.
5) Сборщики - инструмент, который также позволяет ускорить процесс разработки и сборки проекта. Позволяет минифицировать css и js, оптимизировать изображения создавать спрайты и т.д.
Желательно владение хотя бы одним из них. Изучить можно в документации и по урокам на ютубе.
6) Системы контроля версиями - обязательный навык для командной разработки и не только. Очень удобный инструмент для хранения кода.
7) Актуальный JS фреймворк/библиотека построения интерфейсов .
Необходимо уверенное владение основами фреймворка/библиотеки. Выбор инструмента - это разговор для отдельной статьи. На данный момент лидирующими являются React и Vue.
Что нужно еще?
Для того, чтобы овладеть технологиями выше, нужно создавать учебные проекты. Именно практическая работа лучше всего закрепляет пройденный материал.
Перед составлением резюме, создайте свой собственный сайт портфолио, в котором будут показаны ваши навыки и проекты.
Для портфолио будет достаточно:
- 5 сайтов, которые вы сверстали,
- 5 примеров небольших проектов на чистом JS,
- Несколько проектов на JS фреймворке/библиотеке.
Все ваши проекты желательно хранить в github репозиториях. Специалистам будет намного проще оценивать ваши навыки и качество вашего кода.
После того, как все готово - составляйте резюме. Статей в интернете по этой теме хватает.
Не расстраивайтесь, если первое время вам будут прилетать отказы - это нормально.
Если данная статья вам понравилась и оказалась полезной, лучшей благодарностью для меня будет ваш лайк и подписка!