FrontEndDev
27.6K subscribers
2.39K photos
23 videos
7.6K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

Читать на парковке: https://max.ru/front_end_dev

Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
4 функции CSS, которые должен знать каждый фронтенд-разработчик в 2026 году.

Под кликбейтным заголовком спрятаны фичи управления анимацией на основе состояния соседних элементов, инструменты для точного выравнивания текста и безопасной передачи данных из HTML-атрибутов в CSS.

https://nerdy.dev/4-css-features-every-front-end-developer-should-know-in-2026
🔥11👍31
Состояние HTML 2025

Результаты ежегодного опроса о возможностях веб-платформы. Результаты охватывают формы, графику, производительность, API и доступность.

https://2025.stateofhtml.com/en-US/
❤‍🔥5👍5
Стилизация с учетом направления прокрутки с помощью scroll-state

Новая CSS-функция позволяет применять стили в зависимости от последнего направления прокрутки пользователя. Она открывает возможности для создания адаптивных элементов интерфейса, таких как автоматическое скрытие/появление навигации, и реализации направленных анимаций.

https://una.im/scroll-state-scrolled
🔥92
Аутентификация с React Router v7: полное руководство

React Router v7 предлагает унифицированный подход к роутингу, позволяя создавать защищенные маршруты и реализовывать двухфакторную аутентификацию. Он также поддерживает новый "data mode" для эффективной загрузки данных вне компонентов.

https://blog.logrocket.com/authentication-react-router-v7/
👍11🔥4👎1
Набор инструментов для тестирования, отладки и анализа вебхуков.

Он позволяет захватывать, проверять и повторять запросы в реальном времени, не требуя использования локальных туннелей. Инструмент поддерживает мокинг API, валидацию JSON-схем и идеально подходит для отладки рабочих процессов со Stripe, GitHub и Shopify.

https://github.com/ar27111994/webhook-debugger-logger
5👍3
Отладка с помощью сил древнего зла.

Этот устаревший HTML-элемент <plaintext> полностью останавливает парсинг страницы, отображая весь последующий контент как простой текст. Хотя его не стоит использовать в продакшене, он может помочь в быстрой отладке серверного вывода, но стоит быть внимательным к его взаимодействию с различными HTML-санитайзерами.

https://habr.com/ru/companies/ruvds/articles/981920/
1👍11🌚2👻1🎃1
Детектируем тряску мобильного устройства

Реализуем обнаружение встряхивания смартфона без использования сторонних библиотек, опираясь на нативный API devicemotion

https://slicker.me/javascript/shake/shake.htm
😁11👍5🔥1
Веб-стандарты: выпуск 509

Антивебные API для веба, LLM помогает и убивает Tailwind, нездоровая зависимость от бандлеров

https://web-standards.ru/podcast/509/
5👍4🥱1
JavaScript: прощай, Date, здравствуй, Temporal.

Встроенный объект Date давно доставлял неудобства разработчикам из-за своей нелогичности и изменяемости, что приводило к ошибкам и сложностям в работе со временем. Новый API Temporal призван решить эти проблемы, предлагая современный, более последовательный и функциональный подход к манипуляциям с датами и временем.

https://habr.com/ru/articles/984884/
1👍185🔥1
Анимация переходов адаптивного макета сетки с помощью GSAP Flip

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

https://tympanus.net/codrops/2026/01/20/animating-responsive-grid-layout-transitions-with-gsap-flip/
❤‍🔥5👍1
CSS в 2026 году: новые возможности, меняющие фронтенд-разработку

Современный CSS становится достаточно мощным для обработки сложных анимаций и пользовательских взаимодействий, которые ранее требовали JavaScript. Использование таких функций, как appearance: base-select, sibling-index() и улучшенного attr(), позволяет создавать интерактивные элементы с меньшим количеством кода, сохраняя при этом нативную доступность.

https://blog.logrocket.com/css-in-2026/
👍72
Я усвоил первое правило ARIA сложным путем

Семантический HTML по умолчанию выполняет много работы по доступности и ARIA легко использовать неправильно. Его следует применять только для передачи недостающего состояния или для по-настоящему кастомных виджетов, не переопределяя встроенные роли HTML-элементов.

https://css-tricks.com/i-learned-the-first-rule-of-aria-the-hard-way/
👍3🔥2