Рассказываю о том, как выстроить работу со стилями при помощи компонентного подхода, методологии BEM и SCSS так, чтобы это не доставляло проблем. Рассказываю о достоинствах SCSS по сравнению с обычным CSS и о том, почему технология всё ещё актуальна, а также как из неё выжать максимум пользы. Таймлайн: 00:00 | Вступление, что к чему 00:57 | Перечисление ингредиентов нашей организации 01:31 | О компонентном подходе 01:56 | Самый важный совет о расположении стилевых файлов и структуре компонентов 02:50 | А как структурировать по-другому и зачем? 04:40 | Про однофайловые компоненты и отдельные файлы 05:52 | Чуть-чуть про расширение Alternate File 06:41 | Про SASS-нестинг и его искусственное ограничение 07:21 | Что не так с SASS-нестингом? Сравнение процесса при работе с SCSS и CSS. Конкретный пример неправильной организации. 11:29 | Как сделать правильный SASS-нестинг при использовании БЭМ 12:53 | Про то, как SASS добавляет уверенности и контроля 18:06 | Вступление про media-запросы 19:05 | 4 способа работы с media-запросами 21:55 | Правильный вариант работы с media-запросами 22:37 | Пара исключений из общего правила 25:10 | Внешние модификации элемента - внутри самого элемента 27:30 | Костыль ( :( ) для псевдоэлементов 29:20 | Про дополнительные инструменты, доступные в SASS 30:08 | Миксины в SASS 34:09 | Отступление про вертикальное пространство и лаконичность 34:47 | Про функции и миксины в нативном CSS 35:17 | Недостатки миксинов 37:37 | SASS Variables vs CSS Custom Properties 39:25 | Итоги материала, повторение ключевых вещей 41:11 | Призыв к действию и беда с диваном :) Ссылки из видео: Gitlab UI:
Расширение Alternate File для VSCode:
Плагин stylelint-order:
Библиотека миксинов more-sass:
Про миксины и функции в нативном CSS:
Автор: Github:
Telegram:
