RUDE

С чего начать изучение фронтенд разработки под веб в 2022 году

CoderStudio, 26.04.2022 11:33
С чего начать изучение фронтенд разработки под веб в 2022 году
Фото Daniel Korpai на Unsplash

Существует огромное количество ресурсов, на которых можно изучать веб-разработку в 2022 году. Однако большинство из них - это куча неполных или быстро проходящих ресурсов, которые я, честно говоря, не рекомендую. Если вы еще не читали мою предыдущую статью о ресурсах, с которых можно начать работу, пожалуйста, прочитайте ее.

Сегодня я предлагаю вам полное руководство по веб-разработке. Это путеводитель, который я бы хотел иметь, когда сам был новичком.

  • HTML: Это язык Интернета, поэтому вы должны изучить его в первую очередь, чтобы иметь возможность отображать информацию на сайте. Здесь вы можете изучить такие элементы Html, как якорь, заголовок, тело, статья, раздел, div, asides, footer, main, nav, img, span, list, audio, video, формы, кнопки и т. д. Вам не нужно перегружать себя изучением всего, потому что по мере создания проектов вы будете учиться по ходу дела. Это займет максимум неделю, но вы можете изучать его в своем собственном темпе.
  • CSS: Как только вы освоите Html, вы сможете погрузиться в основы CSS. CSS действительно интересен, пока он не становится немного сложным. Переход от одной сложности к другой может сбить вас с толку, но просто продолжайте. Вы также можете обратиться к Stackoverflow или каналу Кевина Пауэлла на Youtube, если у вас возникнут проблемы. В CSS начните с таких ключевых понятий, как единицы CSS (px, em, vh, vw, rem и т.д.), селекторы, модель блока, макеты (Flexbox, Grid), позиционирование, сокращенные свойства, базовая анимация и медиа-запросы. С этими знаниями вы будете готовы к работе и сможете изучать остальное в процессе создания проектов. Этап изучения CSS может занять 3-4 недели, но учитесь в своем собственном темпе и чувствуйте себя комфортно, прежде чем переходить к JavaScript.
  • JAVASCRIPT: Переход от CSS к Javascript настолько ошеломляющий, что 70% новичков готовы сдаться, но не стоит. Вы можете начать с изучения переменных ES6, функций, классов, типов данных, операторов, циклов, объектов, методов, массивов, прототипов, обработки ошибок и затем DOM. Я настоятельно рекомендую вам изучать их на сайте javascript.info, поскольку он является всеобъемлющим. Уделите этому столько времени, сколько сможете, изучайте в своем собственном темпе и создавайте простые проекты. Не позволяйте себе зацикливаться на просмотре учебников, потому что этот этап очень сложный.
  • CSS-ФРЕЙМВОРКИ ИЛИ ПРЕПРОЦЕССОРЫ: CSS-фреймворки позволяют ускорить разработку фронтенда. Вместо темы по умолчанию или встроенных компонентов пользовательского интерфейса вы получаете классы для создания сайта. У каждого фреймворка есть свои плюсы и минусы, вам остается выбрать наиболее предпочтительный. К таким фреймворкам относятся Tailwind CSS, Bootstrap, Foundation, Bulma, UI Kit, Materialize, Skeleton, Semantic UI, Tacit и Pure. Самые популярные из них - Bootstrap и Tailwind, и я советую вам начать с любого из них. Препроцессор CSS - это отдельный язык таблиц стилей с расширенными возможностями, которые разработчики могут использовать для создания более компактных и быстрых продуктов с большим количеством функций, тратя при этом меньше времени на весь процесс, чем при использовании обычного CSS. SASS, LESS и Stylus - самые популярные из них, но мой любимый - SASS. Вы можете изучить SASS, просто посмотрев краткий курс на Youtube.
  • ФРЕЙМВОРКИ JAVASCRIPT: JavaScript-фреймворки - это инструменты, которые облегчают и упрощают работу с JavaScript. Эти фреймворки также дают возможность программисту написать приложение с учетом особенностей устройства. Эта отзывчивость - еще одна причина, по которой JavaScript-фреймворки довольно популярны, когда речь заходит об использовании машинного языка высокого уровня. К таким фреймворкам относятся Angular JS, React JS, Vue JS, Svelte, Ember, Meteor, Mithril, Node JS, Polymer и Backbone.js. Самые популярные из них, с которых вы можете начать, - React, Angular и Vue.

Овладев вышеперечисленным, вы можете перейти к Back-end, изучив Node JS, API, SQL, MongoDB и т. д.