Frontend-разработчик — это специалист, который занимается созданием пользовательского интерфейса веб-приложений. Он отвечает за то, чтобы веб-сайт или веб-приложение выглядело хорошо и функционировало безупречно для пользователей.
Frontend-разработчик обеспечивает взаимодействие пользователей с веб-приложением, создавая удобный, интуитивно понятный интерфейс, который обеспечивает приятный опыт использования.
Введение. Теоретическая база
В первую очередь необходимо изучить теорию. Рассмотрим такие вопросы, как:
Как работает интернет?
Что такое HTTP?
Что такое DNS? И как он работает.
Как работают браузеры?
Как работает интернет?
Изучение: MDN, Хабр, YouTube.
Что такое HTTP?
Изучение: MDN, Хабр, YouTube.
Что такое DNS?
Изучение: MDN, Хабр, YouTube.
Как работают браузеры?
Изучение: MDN, Хабр, Youtube.
Перейдем к основам Frontend разработки
HTML
HTML (HyperText Markup Language) - это стандартизированный язык разметки, который используется для создания веб-страниц. Он представляет собой набор тегов и атрибутов, которые определяют структуру и содержание веб-документа. HTML используется для описания структуры текста, изображений, ссылок и других элементов, которые отображаются в браузере. Браузеры интерпретируют HTML-код и отображают содержимое страницы с учетом заданной разметки. HTML также часто используется в сочетании с CSS (Cascading Style Sheets) и JavaScript для создания интерактивных и стильных веб-страниц.
Как изучить HTML?
W3C School на русском языке.
Уроки на YouTube.
MDN.
Книги по HTML:
«Изучаем HTML, XHTML и CSS». Эрик и Элизабет Фримен
«HTML5 + CSS3. Основы современного WEB-дизайна». Кириченко А.В. и Хрусталев А.А.
«Справочник HTML. Кратко, быстро, под рукой». Дубовик Е.В. и Кириченко А.В.
CSS
CSS (Cascading Style Sheets) - это язык стилей, который используется для определения внешнего вида и форматирования веб-страниц. С помощью CSS можно задавать различные стили для элементов HTML, такие как цвета, шрифты, размеры, отступы, рамки и многое другое. CSS позволяет разделять содержимое веб-страницы (HTML) и ее представление (стили), что облегчает поддержку и изменение внешнего вида веб-сайта без изменения его структуры. CSS используется в паре с HTML для создания эстетичного и профессионального внешнего вида веб-страниц.
Как изучить CSS?
W3C School на русском языке.
Уроки по CSS на YouTube.
MDN.
Книги по CSS:
«Новая большая книга CSS». Дэвид Макфарланд
«Сила CSS3. Освой новейший стандарт веб-разработок». Зои Джилленуотер
«CSS. Подробное руководство». Эрик Мейер
JavaScript
JavaScript - это высокоуровневый, интерпретируемый язык программирования, который применяется в основном для создания интерактивных веб-страниц. Он обеспечивает возможность добавления динамического поведения к веб-сайтам, включая функции, такие как анимации, изменение содержимого страницы без перезагрузки, валидацию форм, обработку событий, общение с сервером и многое другое.
Как изучить JavaScript?
W3C School на русском языке.
Уроки на YouTube.
JavaScript.ru - Лучший учебник по JS
CodeWars
LeetCode
Книги по JavaScript:
JavaScript для детей. Самоучитель по программированию. Ник Морган
Изучаем программирование на JavaScript. Эрик Фримен, Элизабет Робсон
JavaScript. Полное руководство. Седьмое издание. Дэвид Флэнаган
Выразительный JavaScript. Современное веб-программирование. Третье издание. Марейн Хавербеке
Как устроен JavaScript. Дуглас Крокфорд
Контроль версий
Без контроля версий сегодня никуда. Вдруг у нас возникнет баг, который нужно будет откатить? А вдруг мы полностью сломаем нашу верстку? Тогда нам на помощь придет система контроля версий, в этой статье мы будем рассматривать Git.
Познакомиться с Git на YouTube.
Изучить Git на Хабр.
Официальная документация.
На этом 1-ая часть подходит к концу. Во 2-ой части мы рассмотрим сервисы для хостинга, пакет менеджеры, js-фреймворки (React, Vue, Angular), css-фреймворки (TailWind, Radix), BEM архитектуру и css препроцессоры (Sass, PostCSS)
Желаем успехов в изучении!
Если вас заинтересовала статья, приглашаем в наш телеграм-канал WebWeavers, в котором мы изучаем frontend и дизайн с нуля. В нём мы выкладываем интересные и поучительные посты.
