FrontEndDev

27 March 2026 15:30

Модульная система Sass с use и forward: как уйти от устаревшего import

Переход на use решает глобальное загрязнение, конфликты имён и дублирование кода, давая изолированные пространства имён для переменных, миксинов и функций. Разбираемся с подключением модулей, встроенными sass::math и организацией SCSS, чтобы код оставался масштабируемым и удобным для IDE.

https://habr.com/ru/articles/1013818

FrontEndDev

27 March 2026 08:30

Одна CSS-свойство, которое мгновенно улучшает вид цифр

font-variant-numeric: tabular-nums делает все цифры одинаковой ширины, убирая «прыжки» и перекосы в таймерах, счетчиках и дашбордах. Идеально для таблиц и анимированных чисел: меньше layout shift — приятнее UX.

https://frontendfoc.us/link/181899/web

FrontEndDev

26 March 2026 15:30

Вышел Vite 8: Rolldown как единый бандлер

Vite 8 переводит сборку на Rolldown, один Rust бандлер вместо связки esbuild и Rollup, что ускоряет сборки в 10–30 раз и сохраняет совместимость с плагинами. Появляются новые возможности вроде bundle mode, гибкого chunk splitting, persistent caching на уровне модулей и поддержки Module Federation.

https://vite.dev/blog/announcing-vite8

FrontEndDev

26 March 2026 09:54

NoJS 3 — рассвет Flappy Bird

Клон Flappy Bird без JavaScript: только HTML и CSS. Разбираем, как организовать игровую логику (движение, препятствия, столкновения) средствами современного CSS

https://blog.scottlogic.com/2026/03/09/noJS-3-flappy-bird.html

FrontEndDev

25 March 2026 08:30

OAuth 2.0 во фронтенде

Работа с OAuth 2.0 на клиенте это не только логин, но и работа с токенами: разбираем типичные «дыры», правильные flow для веб-приложений и практики, которые снижают риск утечек и подмены.

https://www.youtube.com/watch?v=oGktdQ45bTg

FrontEndDev

24 March 2026 08:30

Flex vs Grid: объяснение разницы на практике

Flex и Grid решают разные задачи: Flex — про раскладку в одном направлении, Grid — про контроль и строк, и колонок. Разберём типовые кейсы (например, карточки в ряд) и покажем, как выбирать нужный инструмент, а не верстать по привычке.

https://habr.com/ru/companies/timeweb/articles/1004986

FrontEndDev

17 March 2026 08:30

Переход от Moment.js к Temporal API

Хотя Moment.js был популярен, его недостатки, такие как большой размер и изменяемость объектов, привели к появлению нового стандарта. Современный Temporal API в JavaScript решает эти проблемы.

https://smashingmagazine.com/2026/03/moving-from-moment-to-temporal-api/

FrontEndDev

16 March 2026 08:30

Улучшаем производительности анимаций с помощью requestAnimationFrame

requestAnimationFrame — это браузерный API, разработанный специально для визуальных обновлений, который позволяет планировать их прямо перед следующей перерисовкой, обеспечивая плавность и отзывчивость.

https://www.debugbear.com/blog/requestanimationframe

FrontEndDev

15 March 2026 15:30

О специфике разработки приложений под Smart TV: личный опыт перехода от веба к ТВ

В отличие от привычного веба, здесь нужно учитывать линейную навигацию, принципы 10-foot UI и аппаратные ограничения.

https://habr.com/ru/companies/vk/articles/1008506

FrontEndDev

13 March 2026 15:34

Прощай innerHTML, привет setHTML

Новый метод .setHTML() в JavaScript, входящий в состав Sanitizer API, является прямой заменой для .innerHTML(). Это значительно усиливает защиту от XSS-атак, эффективно устраняя все риски DOM-XSS и повышая безопасность сайтов.

https://frontendmasters.com/blog/goodbye-innerhtml-hello-sethtml/

FrontEndDev

11 March 2026 10:28

Друзья!

Стартует новый сезон Podlodka React Crew: «Продвинутый React». Podlodka React Crew — онлайн-конференции для React-разработчиков.
По традиции иду сам и зову вас с собой 😊

Разработчики регулярно сталкиваются с проблемами производительности, утечками памяти и архитектурными вызовами. Поэтому в этот раз программа будет очень технической — от внутренней работы V8 до React Server Components и профилирования производительности.

С 23 по 27 марта ее участники:

⚙️ узнают, как устроен рендер и внутренние механизмы в современном React
🧠 познакомятся с архитектурой приложений, где применяются React Server Components
📊 научатся профилировать React-приложения и выявлять медленные рендеры, memory leak
🛠познакомятся с дополнительными инструментами, которые помогут упростить отладку и выявить сложные проблемы

👉 Формат уже знакомый: несколько дней живых Zoom-сессий утром и вечером, закрытое комьюнити в Telegram и возможность пообщаться со спикерами.

Если хотите углубить свои знания про React в компании крутых экспертов, присоединяйтесь к Podlodka React Crew👇

🎟 Забрать early-bird билет можно до 16 марта

🎁 По традиции разыгрываем один билет. Для участия заполните форму. Итоги подведем в ближайшее время!

Для подписчиков FrontEndDev есть промокод на скидку 500р 🥳: FrontEndDev

FrontEndDev

10 March 2026 08:30

Popover API или Dialog API: что выбрать?

Popover API упрощает создание всплывающих элементов, предлагая встроенные функции доступности. В то время как Dialog API лучше подходит для модальных окон, автоматически изолируя контент.

https://css-tricks.com/popover-api-or-dialog-api-which-to-choose/

FrontEndDev

09 March 2026 08:30

На подходе стандартная ленивая загрузка HTML-видео и аудио!

Эта функция позволит отложить загрузку медиа-ресурсов до момента их появления в области видимости браузера, значительно снижая вес страницы и улучшая производительность. Используя loading="lazy" для <video> и <audio>, разработчики смогут оптимизировать загрузку медиа, что уже доступно для тестирования в Chrome Canary.

https://scottjehl.com/posts/lazy-media/

FrontEndDev

07 March 2026 15:30

GitLab CI/CD для фронт разработчиков: от 0 до задеплоено

Настройте автоматизированное тестирование, сборку и развертывание на GitLab Pages. Подробное руководство с реальными примерами и практическими советами.

https://www.sitepoint.com/git-lab-ci-cd-for-frontend-developers

FrontEndDev

03 March 2026 08:30

Как фронтенд получает данные с сервера: лучшие практики 2026.

Ключевые подходы к получению данных: от классического REST и GraphQL до паттерна Backend for Frontend (BFF) и реактивных методов.

https://habr.com/ru/companies/otus/articles/994238

FrontEndDev

27 March 2026 13:50

Делегирование фокуса в Shadow DOM с delegatesFocus

delegatesFocus: true убирает ручную логику focus() в обёртках, автоматически прокидывает фокус на первый фокусируемый элемент и корректно включает :focus и :focus-within для стилизации без классов. Это закрывает проблемы с мёртвым фокусом при кликах по padding и декоративным зонам, особенно в простых компонентах вроде button input select.

https://frontendmasters.com/blog/shadow-dom-focus-delegation-getting-delegatesfocus-right/

FrontEndDev

26 March 2026 17:01

Как frontend-разработчику получить оффер в Big Tech?

Платят как джуну, а спрашивают как с лида 🙄 Зарплата не растёт, задачи скучные.

Пробуешь откликаться, но на резюме клюют только ноунейм компании, а на собесах валят на алгоритмах? При этом вокруг кто-то постоянно получает офферы в Яндекс или VK...

Стабильность с маленькой зп, или дестрой рынка и выход на максимальную? Синяя или красная таблетка, Нео?! 👾

Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор.

Помогаю устроиться на хорошие позиции в Big Tech и сопровождаю на испытательном сроке.

FrontEndDev

26 March 2026 13:50

Тестируйте доступность в реальном времени прямо во время написания кода

На ходу подсвечиваются нарушения WCAG и выпадают предупреждения в IDE/CLI с AI-подсказкам для исправлений

https://www.browserstack.com/accessibility-testing/accessibility-devtools

FrontEndDev

25 March 2026 15:30

ESLint v10.0.3: патч-апдейт для точнее проверок кода

Вышла ESLint v10.0.3 — релиз, который исправляет баги предыдущей версии и обновляет зависимость minimatch до ^10.2.4, чтобы ESLint корректно распознавал файлы. Также добавлены точечные фиксы в сообщениях правил и обновлена документация/гайд по миграции.

https://javascriptweekly.com/link/181821/web

FrontEndDev

24 March 2026 15:30

Асинхронные переходы между страницами в Vanilla JS — настоящий crossfade без фреймворков

Собераем лёгкий SPA-router на History API с анимацией переключения страниц: текущая и следующая страницы одновременно живут в DOM, клонируются и плавно «перетекают» друг в друга. Без Barba и без React/Vue — ванильный JavaScript + аккуратная архитектура.

https://frontendfoc.us/link/181897/web

FrontEndDev

23 March 2026 15:30

Деструктуризация в JavaScript: учимся разбирать данные удобно и лаконично

Деструктурирующее присваивание помогает “распаковывать” массивы и объекты прямо в параметрах и переменных — особенно когда структура вложенная. Разберём, как это работает и почему синтаксис кажется коротким, но делает много работы.

https://css-tricks.com/javascript-for-everyone-destructuring/

FrontEndDev

16 March 2026 15:30

5 операторов RxJS в Angular, которые решают 80% проблем

Эти операторы упрощают работу с асинхронными данными, помогая отменять устаревшие запросы, объединять данные из нескольких источников, реагировать на изменения множества фильтров и корректно обрабатывать ошибки.

https://habr.com/ru/companies/ruvds/articles/1008646

FrontEndDev

15 March 2026 19:44

Итак!

Бесплатная проходка на Podlodka React Crew рандомным образом достается @m_hodeneva

Поздравляем!🎉🎉🎉
У всех остальных еще есть шанс урвать early-bird билет!

Всем хорошей недели 😊

FrontEndDev

15 March 2026 14:53

Друзья! Мои коллеги пишут выпускную работу и проводят исследование "о важности аспектов бренда работодателя для IT-специалистов поколения Z при выборе компании".

Если у вас есть свободные 6 - 8 минут и вы родились позже 1996, ответьте пожалуйста на несколько вопросов.

Всем добра ✌️

PS: сегодня подведем итоги розыгрыша билета на Podlodka React Crew. Следите за постами 😊

FrontEndDev

13 March 2026 13:34

CSS-свойство corner-shape: новые горизонты для интерфейсов

Новое свойство corner-shape в связке с border-radius наконец позволяет легко создавать скошенные, вогнутые, скругленные и другие формы, делая ваш интерфейс выразительнее и чище

https://www.smashingmagazine.com/2026/03/beyond-border-radius-css-corner-shape-property-ui/

FrontEndDev

10 March 2026 15:30

Переосмысление тестовых заданий для фронтендеров. Методология, включающая короткое тестовое задание, совместное ревью кода и рефакторинг легаси, которая позволяет выявить реальные навыки работы с кодом и принятия решений

https://habr.com/ru/companies/doubletapp/articles/1005810

FrontEndDev

09 March 2026 15:30

Подробное руководство по настройке списков с помощью CSS

Разбираем свойства list-style-type, псевдоэлемент ::marker для базовой кастомизации и правило @counter-style для создания собственных систем нумерации

https://frontendfoc.us/link/181162/web

FrontEndDev

08 March 2026 15:30

Спрайты в вебе

Используйте технику спрайтов, чтобы создавать эффективные покадровые анимации на веб-страницах с помощью современных CSS-свойств, таких как object-fit, object-position и функции steps().

https://www.joshwcomeau.com/animation/sprites/

FrontEndDev

07 March 2026 13:50

Главный подвох якорного позиционирования в CSS

Якорное позиционирование в CSS имеет важные ограничения по расположению элементов в DOM. Якорный элемент должен быть полностью отрисован до того, как к нему будет привязан другой элемент, что требует внимания к порядку их следования и структуре DOM.

https://frontendmasters.com/blog/the-big-gotcha-of-anchor-positioning/

FrontEndDev

26 February 2026 15:30

Пишем систему частиц и физику на чистом JS для создания Canvas-конфетти

Посмотрим, как построить собственную архитектуру на Canvas для анимаций: от базовых примитивов до сложных систем частиц с реализацией физики и эффектов вращения.

https://habr.com/ru/articles/1001462