BulatikПривет! ⚡️
Этот пост - начало моего личного мини курса, который даст основы верстки страниц.
Пару слов про верстку
Верстка сайтов - это создание внешнего вида страницы сайта. Например, текст, который ты сейчас читаешь - это часть пользовательского интерфейса. Я могу сделать этот текст жирным, курсивным,
В целом, примеры выше - это даже не 1% всего, что можно делать со страницей.
Сайты - из чего состоит?
Современный сайт, будь то сайт-визитка или крупный интернет магазин - что угодно - состоит из двух частей: бэкенд и фронтенд. В связке получается интерактивный сайт. Вкратце про оба направления...
Ванильный фронтенд (наш случай) - это, как я сказал ранее, пользовательская сторона. Кнопки, формы, поля для заполнения, блоки, заголовки страниц, текст, таблицы, картинки... Для этого используются языки разметки: HTML, CSS. И язык для "магии" - JS.
Бэкенд - это всё, что не видно пользователю. Там происходят операции с базами данных, работа с другими сервисами, связка компонентов воедино. В общем - другая вселенная. Крупная, и не менее интересная. Языки: PHP, Go, C#, Python.
Начнем?
Я разделю курс на 4 части. Первые три части - это основы HTML, CSS, JS. По отдельности эти языки практически бесполезны. Не стоит пугаться, что их сразу три: HTML и CSS учатся быстро, за несколько вечеров можно понять многое. JS - это про логику. Он несложный, но требует чуть больше работы головой и усидчивости. Четвертая часть - это часть с практикой. Безусловно, в каждой части будет своя практика. В последней части мы будем объединять все полученные знания в несколько проектов.
Проходить все части нужно по порядку. HTML - CSS - JS - практика. Почему так? Потому что при изучении CSS/JS мы будем брать HTML как язык, который нам уже известен. То есть, учить CSS без HTML бесполезно.
Поехали!
HTML
1. Первая страница
<img src="https://cdn.bulatik.website/files/6a849a18e373d_798883f0.webp">