FrontEndDev
27K subscribers
2.44K photos
23 videos
7.65K 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
Деструктуризация в JavaScript: учимся разбирать данные удобно и лаконично

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

https://css-tricks.com/javascript-for-everyone-destructuring/
👍9🔥31
Flex vs Grid: объяснение разницы на практике

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

https://habr.com/ru/companies/timeweb/articles/1004986
👍52🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Асинхронные переходы между страницами в Vanilla JS — настоящий crossfade без фреймворков

Собераем лёгкий SPA-router на History API с анимацией переключения страниц: текущая и следующая страницы одновременно живут в DOM, клонируются и плавно перетекают друг в друга

Демо | Github

https://tympanus.net/codrops/2026/02/26/building-async-page-transitions-in-vanilla-javascript/
👍61🤔1
OAuth 2.0 во фронтенде

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

https://www.youtube.com/watch?v=oGktdQ45bTg
👍51🔥1
ESLint v10.0.3: патч-апдейт для точнее проверок кода

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

https://eslint.org/blog/2026/03/eslint-v10.0.3-released/
👍102🥱1
This media is not supported in your browser
VIEW IN TELEGRAM
NoJS 3 — рассвет Flappy Bird

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

https://blog.scottlogic.com/2026/03/09/noJS-3-flappy-bird.html
5🤯5🔥2
Тестируйте доступность в реальном времени прямо во время написания кода

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

https://www.browserstack.com/accessibility-testing/accessibility-devtools
5😍3🔥1
Вышел 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
👍176🔥5❤‍🔥1
Как frontend-разработчику получить оффер в Big Tech?

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

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

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

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

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


В своем канале:
👉Разбираю самые популярные и каверзные вопросы на собесах
👉Рассказываю как пройти фильтр HR
👉Борюсь с убеждениями, которые мешают развиваться
👉Делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров

Регулярно публикую полезные материалы:

▪️60 вопросов, которые точно помогут тебе на собеседовании
▪️
Подборка из 100+ каналов с вакансиями для разработчиков

▪️
10 задротских вопросов про JavaScript, после которых ты усомнишься, что вообще знаешь JS. Часть 1
▪️Чек лист проверки своего резюме

Подписывайся, нас уже 4500 🤓: ссылка

Реклама, erid: 2W5zFFyGMxd ИП Галактионов Тихон Витальевич, ИНН 771618975809
💩6🤡6👍3🤮31
Одно CSS-свойство, которое мгновенно улучшает вид цифр

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

https://frontendfoc.us/link/181899/web
🔥12🍌32👌2
Делегирование фокуса в Shadow DOM с delegatesFocus

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

https://frontendmasters.com/blog/shadow-dom-focus-delegation-getting-delegatesfocus-right/
6🔥3👌1
Модульная система Sass с use и forward: как уйти от устаревшего import

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

https://habr.com/ru/articles/1013818
7💩3👎2😁1🤔1🤡1
Руководство для новичков по ручному тестированию доступности с клавиатурой

Проверьте доступность интерфейса для пользователей скринридеров с помощью пяти базовых команд Tab, Shift+Tab, Enter, Space и стрелок, чтобы быстро найти проблемы навигации и взаимодействия.

https://www.sitepoint.com/accessibility-testing-with-keyboard-navigation/
👍2🔥2
Утечки памяти во фронтенде: что нашли в 500 репозиториях и как это быстро исправить

Статический анализ 500 публичных React, Vue и Angular репозиториев показал, что 86% проектов содержат паттерны без cleanup, а бенчмарки дают около 8 KB удерживаемой памяти на цикл навигации при пропущенной очистке

https://stackinsight.dev/blog/memory-leak-empirical-study/
👍4🤮1