Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 11–17 июля.
🧬 HTML
📔 Создадим табы на веб-компонентах. Для создания потребуется хорошо знать разметку, ариа-роли и UX.
📔 Самый высокий сайт в мире!
📔 Как создать сайт... в 1997 году.
📔 Почему хлебные крошки так назвали? А почему радио-кнопки радио? Чтобы людям было проще переходить из реального мира в цифровой.
🖌️ CSS
📔 Визуальные эффекты на CSS. Несколько потрясающий эффектов, которые можно достичь с помощью mix-blend-mode.
📔 CSS становится всё сложнее и сложнее.
📔 Как вырываться из центровщика. Все мы центрируем наш контент, но как сделать так, чтобы какие-то блоки были шире центровщика?
🏗️ JavaScript
📔 VITE 3.0. Новая документация. Повышена версия node.js до 14.18+. Изменение архитектуры. API импорта WebAssembly был пересмотрен для совместимости с будущим стандартом.
📔 Испытание производительности и совместимости Bun c node.js.
📔 Statements Vs. Expressions. Разберитесь в чём разница между «оператором» и «выражением» в JavaScript?
🚀React
📔 Тщательно подобранный список React-компонентов и библиотек.
📔 История о том как Yelp переезжала с Styleguidist на Storybook.
📔 А хуки были хорошей идеей? Принципы SOLID не возникли из вакуума и кажется хуки поощряют разработчиков нарушать эти принципы.
📔 Применение SOLID-принципов в Реакте.
📔 Как рефакторить большое React-компоненты. Следуйте и не игнорируйте лучшим практикам начиная с создания компонента.
💽 Node.js
📔 Кастомные ESM-загрузчики: кто, что, когда, где, почему, как? Кастомные загрузчики мощный механизм обеспечивающий контроль над загрузкой модулей, который можно протестировать в node.js 18.6.0.
📔 Вышла новая версия node.js 18.6.0 с ESM Loader Hooks.
📔 Как настроить GraphQL API сервер в node.js. Практическое пошаговое руководство.
🟩 Vue
📔 Начинаем работать с компоновщиками.
🛠️ Инструменты
📔 Putout. Что если бы ESLint мог исправлять ошибки в рантайме?
📔 Aspect. Позволяет копировать React-component прям с сайта.
📔 React render tracker 0.7.0. Инструмент для обнаружения проблем с производительностью, связанных с непреднамеренным повторным рендерингом.
📔 Ember 4.5.
🕸️Браузеры
📔 10 советов по работе с DevTools для эффективной работы.
📔 В Safari 16 появится возможность анимировать гриды.
🎓Общее
📔Золотое сечение в UX-дизайне — почему это важно? Помните, 1,618 … это не просто число. Золотое сечение — это движущая сила хорошего дизайна.
📔 Как сделать текст более удобным. Коллекция советов от небольших надписей, уведомлений навигационных подсказок и так далее.
📔 Должен ли я нажимать "Разрешить использовать cookie" на каждом сайте? Коротко: да, для сайтов, которым вы доверяете и которые часто используете.
📔 Наглядное сравнение более 100 шрифтов для программирования.
Как читать статьи на английском языке
В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.
