Демо для видеоблога

youtube.com/pepelsbey

• Как тестировать на ☎️ телефонах и эмуляторах, и почему фронтендеру никуда без макбука
• 🥨 Попап вместо селекта: ✨новые HTML-элементы✨ наконец-то решат старую проблему
• 6+5 способов сделать две колонки ✌️ От таблиц и флоатов до гридов и полной дичи 😱
• Табы или пробелы? ➡️ Почему мы повернули не туда и как табы помогают
• Переключатель 🌓 цветовой схемы: радиокнопки, CSS-фильтры и инверсия, SVG-иконки, JS и localStorage
• Тёмная 🌑 и светлая 🌕 темы на CSS: кастомные свойства, подключение, фолбэк для старых браузеров
• Новый image-set как 🖼 тег picture в CSS: не только ретина, но и WebP и AVIF
• Цветные вкладки 🌈 на theme-color для Safari, Vivaldi и Chrome. Бонусом ES-импорты, сервер на Node.js
• :has в CSS — псевдокласс из будущего 👽 на примере карточки новости
• Мой VS Code ⚙️ Светлая тема, удобный поиск, полезные расширения и настройки
• Веб-сервер на Ubuntu 20 с нуля: nginx, HTTPS, Brotli и HTTP/2
• 📦 CSS Container Queries, или Адаптация по новому: контейнер вместо вьюпорта
• Цветовые функции в CSS 🎨 Мечты сбываются: смешивание, прозрачность, контраст
• Верстать как в 2020, или Трюки на SVG: маски, трансформации и calc
• Верстать как в 2008, или Флэшбеки олдфага: IE6, таблицы и JS в CSS
• Где использовать флексы, а где гриды? 🤨 Спойлер: да где хотите
• Декларативный Shadow DOM для изоляции стилей
• Хороший и плохой focus, полифил focus-visible и Open Prioritization
• Автотесты и деплой на GitHub Actions: npm-скрипты, EditorConfig и настройка ssh-ключа
• Свежий взгляд на Gulp: функции и ES-модули
• Адаптивная шапка с выпадающим меню на гридах
• Веб-сервер на Ubuntu с нуля: nginx, HTTP/2, brotli и HTTPS
• Направляющие для адаптивной сетки на градиентах и кастомных свойствах
• Шапка на гридах и флексах с гэпами и БЭМ
• Кастомные свойства или честный Sass вместо CSS-переменных на PostCSS
• Звёздный рейтинг ⭐️⭐️⭐️⭐️⭐️
• ✅ Кастомные чекбоксы правильно
• Как вставить двадцать видео с Ютуба и не скачать слона
• Прототип изоляции стилей для Shower на веб-компонентах
• Skillbox, оптимизация графики, Squoosh и элемент picture
• Кто такие дивелоперы, ручной SVG и волнительное подчёркивание
• Погружение в object-fit: cover с полифилом и без
• Политех, магический JPEG, ненужная форма и object-fit на SVG
• Навигация, дизайнеры и код, актуальность, личинки фронтендера и фреймворки