Ховер близости в CSS для сетки без JavaScript
Показываем эффект hover proximity: при наведении на элемент в CSS grid, элемент масштабируется и также стили применяются к соседним ячейкам с учетом их координат. Реализация опирается на современные возможности CSS, включая view-timeline, кастомные свойства и условное применение стилей, сохраняя отзывчивость сетки.
https://blog.master.dev/hover-proximity-using-modern-css/
Показываем эффект hover proximity: при наведении на элемент в CSS grid, элемент масштабируется и также стили применяются к соседним ячейкам с учетом их координат. Реализация опирается на современные возможности CSS, включая view-timeline, кастомные свойства и условное применение стилей, сохраняя отзывчивость сетки.
https://blog.master.dev/hover-proximity-using-modern-css/
❤8👍3😱3❤🔥2🔥1
Эра инженерной зрелости
Как выглядит стек JS-разработки в 2026 году глазами сообщества
https://habr.com/ru/companies/kaspersky/articles/1074966/
Как выглядит стек JS-разработки в 2026 году глазами сообщества
https://habr.com/ru/companies/kaspersky/articles/1074966/
👍3❤2🔥1
FrontEndDev
⚡️⚡️HolyjS снова собирает JS-разработчиков. Уже 10-ый год подряд! Уже десять лет мы вместе с JS-сообществом следим за тем, как меняется экосистема, разбираемся в новых технологиях и собираем инженеров, которым интересно копать глубже и смотреть на разработку…
Привет!
Этим воскресным вечером мы подводим итоги розыгрыша онлайн-билета на HolyJS и поздравляем @fivefiftyeight с победой! 🎉🎉
Все остальные могут купить билет на сайте по старой цене до 1 сентября. Всем добра! ✌️
Этим воскресным вечером мы подводим итоги розыгрыша онлайн-билета на HolyJS и поздравляем @fivefiftyeight с победой! 🎉🎉
Все остальные могут купить билет на сайте по старой цене до 1 сентября. Всем добра! ✌️
🎉6
Рефракция фоновых изображений в CSS без фиксированного подхода
Для эффекта жидкого стекла можно отказаться от
https://blog.master.dev/background-image-refraction-in-css/
Для эффекта жидкого стекла можно отказаться от
background-attachment fixed и вместо этого использовать view(x) и view(y) на фоне элемента внутри контейнера с overflow hidden. Фон карточки наследует фон контейнера и анимируется по background-position в зависимости от видимости внутри контейнера, а затем можно добавить смещение, blur, тени и искажения для усиления рефракции.https://blog.master.dev/background-image-refraction-in-css/
❤5👍3❤🔥2🤣2
toast-queue для доступных toast-уведомлений
Лёгкая framework-agnostic библиотека для toast-уведомлений с нормальной доступностью, очередью и прогрессивным улучшением. Она берёт на себя показ, скрытие, позиционирование, лимит видимых тостов и объявления для screen reader, так что в приложении остаётся только вызвать add(). На практике удобно, что можно отправлять как простой текст, так и объект с title, description и action, а поведение настраивается и глобально для очереди, и точечно для каждого тоста.
https://toast-queue.js.org
Лёгкая framework-agnostic библиотека для toast-уведомлений с нормальной доступностью, очередью и прогрессивным улучшением. Она берёт на себя показ, скрытие, позиционирование, лимит видимых тостов и объявления для screen reader, так что в приложении остаётся только вызвать add(). На практике удобно, что можно отправлять как простой текст, так и объект с title, description и action, а поведение настраивается и глобально для очереди, и точечно для каждого тоста.
https://toast-queue.js.org
⚡7❤5
Как не сломаться на датах и таймзонах
Разбор того, почему работа с датами и временем в фронтенде и бэкенде регулярно ломается, если считать таймзону просто смещением от UTC. На практике одна и та же зона меняет offset со временем, а сутки в локальном времени могут быть не 24 часа из-за переходов на летнее и зимнее время. Ключевой вывод: хранить и передавать стоит абсолютное время, а для отображения и расчётов использовать идентификаторы таймзон и библиотеку, которая знает их историю.
https://habr.com/ru/companies/ispring/articles/1053384/
Разбор того, почему работа с датами и временем в фронтенде и бэкенде регулярно ломается, если считать таймзону просто смещением от UTC. На практике одна и та же зона меняет offset со временем, а сутки в локальном времени могут быть не 24 часа из-за переходов на летнее и зимнее время. Ключевой вывод: хранить и передавать стоит абсолютное время, а для отображения и расчётов использовать идентификаторы таймзон и библиотеку, которая знает их историю.
https://habr.com/ru/companies/ispring/articles/1053384/
👍5❤2👀2
Реалистичный свет для 2D-изображений в Three.js
Связка depth maps, TSL и WebGPU позволяет превратить плоскую картинку в поверхность, на которую можно динамически накладывать свет, рельеф и тени. За счёт карты глубины изображение начинает вести себя как псевдо-3D сцена, а не как обычный спрайт. Такой приём даёт более живую визуализацию без полноценного 3D-моделинга и может пригодиться для hero-блоков, промо и интерактивных эффектов в интерфейсе.
Демо | Github
https://tympanus.net/codrops/2026/08/19/relighting-images-with-depth-maps-and-three-js/
Связка depth maps, TSL и WebGPU позволяет превратить плоскую картинку в поверхность, на которую можно динамически накладывать свет, рельеф и тени. За счёт карты глубины изображение начинает вести себя как псевдо-3D сцена, а не как обычный спрайт. Такой приём даёт более живую визуализацию без полноценного 3D-моделинга и может пригодиться для hero-блоков, промо и интерактивных эффектов в интерфейсе.
Демо | Github
https://tympanus.net/codrops/2026/08/19/relighting-images-with-depth-maps-and-three-js/
❤7🔥2
Дашборды, которые ведут к решению
UX-подход к дашбордам помогает сделать визуализацию не просто точной, а управляемой для принятия решений. Проблема обычно не в данных, а в том, что график строили от доступных метрик, а не от конкретного вопроса и нужного действия. Практический вывод простой: до выбора типа графика нужно зафиксировать контекст, аудиторию и ожидаемое изменение после просмотра, иначе даже аккуратный дашборд останется набором цифр без эффекта.
https://smashingmagazine.com/2026/08/rethinking-data-visualisation-ux-approach-dashboards/
UX-подход к дашбордам помогает сделать визуализацию не просто точной, а управляемой для принятия решений. Проблема обычно не в данных, а в том, что график строили от доступных метрик, а не от конкретного вопроса и нужного действия. Практический вывод простой: до выбора типа графика нужно зафиксировать контекст, аудиторию и ожидаемое изменение после просмотра, иначе даже аккуратный дашборд останется набором цифр без эффекта.
https://smashingmagazine.com/2026/08/rethinking-data-visualisation-ux-approach-dashboards/
👍5❤3
3 сентября(в четверг!) в 19:00 по мск приходи онлайн на открытое собеседование, чтобы посмотреть на настоящее интервью на Middle Frontend-разработчика.
Как это будет:
Это бесплатно. Эфир проходит в рамках менторской программы от ШОРТКАТ для Frontend-разработчиков, которые хотят повысить свой грейд, ЗП и прокачать скиллы.
Переходи в нашего бота, чтобы получить ссылку на эфир → @shortcut_front_bot
Реклама.
О рекламодателе.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5💩3