Шаблон сайта (Layout) с нуля глазами профессионала.

[@iam-the-teacher]

Создадим с нуля HTML шаблон сайта (Layout). Вы узнаете как этот процесс видит и реализует профессиональный разработчик. Используем Flexbox. Учтем React, BEM, Mobile Friendly и Continuous improvements подход. #webdevelopment ГИТХАБ: github.com/the-teacher ТЕЛЕГА: t.me/prostocoding ИНСТА: zykin.ilya LINKEDIN: ilya-zykin 00:00 - Приветствие 01:06 - План лекции 01:46 - Для кого 04:09 - Тех задание 05:20 - Дисклеймер 06:40 - Об авторе 08:02 - Первый шаг 09:51 - Сайт как пазл 11:46 - Reset css 14:05 - Margin / Paddings 14:32 - Margins 15:05 - Paddings 15:34 - Borders 16:30 - box-sizing 16:40 - HTML разметка 17:05 - Блочное восприятие программиста 18:00 - Ошибка в разметке (пересечение блоков) 19:10 - Первый результат 19:40 - Как работает разработчик 21:25 - Подготовка к React 23:06 - display: contents 24:10 - Can I use 25:44 - Базовые стили 27:58 - Стили блоков 28:58 - Визуализация блоков 30:05 - BEM методология 32:22 - BEM и SCSS/SASS 33:05 - Мои правила работы с BEM 36:29 - Continuous Improvements 38:09 - Исключение из правил 39:00 - Широкие экраны 40:20 - Блок обертка и ограничения ширины 41:41 - Финальная чистка кода 42:15 - Готовое решение и прощание