Разобраться с этими тремя основными компонентами любого начинающего веб-разработчика, очень просто! Каждый из них имеет свои собственные правила и синтаксис, которые необходимо изучать шаг за шагом.
Программирование в веб-разработке
Представим, что вы сотрудник it-компании. Вам дали задание сверстать и сделать живую веб станицу с интересными эффектами в пользовательском интерфейсе - начнем!
Для начала мы должны изучить макет сайта, что он из себя представляет, что нам надо для того, чтобы на нем все работало - декомпозиция задач.
Чтобы перенести весь наш макет в интернет, нам потребуются языки, такие как HTML ("HyperText Markup Language" - язык гипертекстовой разметки) и CSS ("Cascading Style Sheets" - каскадные таблицы стилей). Благодаря которым браузер сможет читать наш макет и отобразить его в точности как сделал дизайнер.
HTML
Ниже можно увидеть структуру: в самом верху (Header) далее идет основа (Main), там мы можем видеть два блока справа и слева. Видим четкое разделение между обычным текстом и заголовками, все эти изменения достигаются благодаря тегам, которые достаточно логичные и легко запоминаются, если часто начать верстать.
Например: <p> Это абзац. </ p>- это обычный абзац, которые расположены под заголовками,<h1>Заголовок 1</h1> - это заголовок первого порядка (для валидной верстки нужно правильно соблюдать иерархию заголовков, так же есть еще разные правила, касающиеся заголовков, например: обязательное размещение заголовка внутри секции и т п.)
CSS
CSS - это каскадные таблицы стилей. Этот язык определяет, как HTML-элементы веб-сайта будут отображаться в интерфейсе страницы. Цвета, интересные шрифты и фоновые изображения – CSS. Также позволяет веб-сайтам адаптироваться к различным размерам экрана и типам устройств.
Ниже пример страницы без стилей и с ними.
Но на самом деле все описанное выше лишь структура страницы и информация о стиле. Прежде чем перейти к JavaScript и другим языкам программирования, необходимо знать основы HTML и CSS, поскольку они находятся на клиентской части каждой веб-страницы и приложения.
Для чего JavaScript в веб-разработке?
JavaScript - это логический язык программирования, который можно использовать для изменения содержимого веб-сайта и заставить его вести себя по-разному в ответ на действия пользователя. Использование JavaScript включает в себя различные модальные формы, всплывающие окна, призывы к действию и добавление новых идентификаторов(id) к существующей информации. Благодаря JS - страницы становятся интерактивными.
Это первая статья - для ознакомления с азами фронтенд разработки, надеюсь эта информация будет полезной для новичков.