В ожидании aspect-ratio: «хаки» для пропорциональных боксов

Дело в том, что padding в процентах рассчитывается относительно ширины родительского элемента, поэтому можно получить совсем не те пропорции, если задать его на самом элементе

В ожидании aspect-ratio: «хаки» для пропорциональных боксов

Какой жёлтый заголовок.

На самом деле это не все варианты. Можно было бы рассмотреть способы с использованием canvas, svg в качестве распорок, способ с CSS Grid. Неплохо бы прояснить для начинающих, почему важно делать padding-распорку на внутреннем элементе, а не на самом элементе.

Несмотря на широкую поддержку @supports я бы инвертировал правило, потому что браузеров, способных отобразить то, что внутри правила, больше, чем браузеров, поддерживающих @supports. Хотя при вашем способе нужно будет проще удалять/рефакторить код.

Минимальный размер контента в CSS grid

проблема с макетом сетки CSS

CSS Grid лучше не переводить, а оставлять англоязычный вариант

Что такое @font-face на самом деле

Вроде бы в IE8 нельзя было подключать больше 4-x @font-face c одним font-family.

Углублённое руководство по JavaScript: генераторы. Часть 2, простой пример использования

Тогда ещё не было async/await, поэтому генераторы использовались для имитации "плоского асинхронного кода"

Свободно стилизируемый outline DOM элементов

заголовок поправьте

А затем перемещаем, наши 4-e div, каждый в свой угол

Не проще ли задавать размеры родительскому контейнеру, а уголки изначально спозиционировать с помощью CSS?

React Server Components — что это?

можно получать полный доступ к окружению сервера…
Только для доступа к окружения сервера, требуются обертки для реакта...

Смущает то, что нужно использовать/писать такие обертки да ещё и в синхронном виде. То есть нельзя просто так взять и использовать Node.js API.

Делаем схему выбора мест в кинозале на React: о canvas, красивом дизайне и оптимизации

Вставляйте код текстом, пожалуйста!

Модули в JavaScript

Подробнее об этом процессе можно прочитать в статье «Глубокое погружение в ES-модули в картинках».

Так же статья, но грузится быстрее и меньше весит.

CSS var в rgba или удобное использование цветов в Sass

Не знаю, зачем именно вам hex-формат, но hsl видится гораздо удобнее (например, статья 1 и статья 2). Функции rgba и hsla в том виде, в котором SASS их использует, не работают в CSS.

CSS var в rgba или удобное использование цветов в Sass

Небольшая проблема – функция color уже есть в спецификации (хоть и черновике) W3C, поэтому придется переименовать, чтобы не было конфликтов.

А вообще задача уже решается на одном лишь CSS c хорошей поддержкой:

:root {
  --primary: 240deg 100% 70%; /* hsl format */
}

body {
  background-color: hsl(var(--primary) / 0.36);
}

Прозрачность тоже можно задать через пользовательское свойство:

body {
  --opacity: 1;
  background-color: hsl(var(--primary) / var(--opacity));
}

Статический генератор сайтов Hugo. Фронтенд реалии

Преимущество Hugo – в скорости сборки. Но его перевешивает тот факт, что frontend-разработчикам привычнее и проще работать с JavaScript. А что если нужно сделать самому какое-то расширение для шаблонизации, сборки и пр., тогда нужно изучать Go. Что-то готовое из NPM уже не возьмешь.

Сборка JavaScript в Hugo, похоже, появилась не так давно и связана с относительно новым инструментом ESBuild (бандлером JavaScript, написанным на Go).

Генератор статики Eleventy кажется куда более функциональным и гибким. Например, можно создать статический сайт, используя данные из json Wordpress Rest API.

Роутинг и рендеринг страниц на стороне клиента с помощью History API и динамического импорта

<a data-url="home">Home</a>

const { url } = target.dataset

Тут ломается веб: ссылку нельзя скопировать, нельзя открыть в новой вкладке, нельзя добавить в закладки и нельзя многое другое, к чему привык пользователь с его браузером.

Современный стартовый HTML-шаблон

CSS3 нет и не будет. Может, лет 10 назад еще так можно было говорить для поддержки разговора, но уже заканчивается 2020-ый.

Современный стартовый HTML-шаблон

А зачем в коде сервера нужно задание заголовка res.setHeader('Accept-Encoding', 'gzip, compress, br')? Несмотря на наличие в Node.js средств для работы с gzip и brotli в модуле zlib, ни встроенный http-сервер, ни express из коробки не умеют кодировать-декодировать такие форматы.

Современный стартовый HTML-шаблон

Пример использования CSS3-свойств

Что такое CSS3?

TailwindCSS – очередной фреймворк или новый шаг эволюции?

Какие есть у TailwindCSS средства для темизации? Светлые, темные, контрастные темы.

DagazServer: Как всё устроено

Запросы передаваемые через IPv4 обрабатывались нормально, а передаваемые через IPv6 — отбрасывались с ошибкой авторизации (403).

В nginx включили обработку IPv6?

listen [::]:80;
listen [::]:443 ssl;

React: слоты как у сына маминой подруги

Там замена целых компонентов. Слоты же — для частей компонентов.

React: слоты как у сына маминой подруги

с поддержкой параметризации слотов.

Получить доступ к дефолтному содержимому слота тоже можно? Что-то типа:

<MySlot>
  {params => (<div>Param is {params.myParam} and {params.defaultSlotContent}</div>)}
</MySlot>

P.S.: о том, какими должны быть слоты, неплохо рассказал Константин Лебедев в этой статье.