Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры | Занимательное
Медиа
• Подкаст CSSSR: Автоматизация рефакторинга, миграция на TS, TypeScript 3.9 RC, Redis 6, релизы NodeJS и RoR
• Подкаст «Веб-стандарты» №227: Сайт Веб-стандартов, cssunderhood, Chrome, цвета, кастомные свойства, Brotli, цена фреймворков
• RWPod Кафе 15: Andrey Sitnik
• Подкаст CSSSR. Argumentarium – Место верстки во Вселенной
• Я.Субботник по разработке интерфейсов 2020
Веб-разработка
• Opium.Fill — стандартизация цветовой схемы глазами программиста
• Современные архитектуры фронт-энда
• Современное SEO: AMP-истории
• Что каждый разработчик должен знать о https
• Немного невинных забав с HTML-видео и Progress
• Хранилище для веба. Существует много разных вариантов хранения данных в браузере. Какой из них лучше всего подходит для ваших нужд?
• Как не попасть в ловушку браузерного кэша
- Производительность
• Как уменьшить размер бандла — стратегия однобуквенных классов в css-modules
• Мониторинг производительности CSS-анимации
• Автоматизация тестирования веб-производительности с помощью Puppeteer
- Доступность
• Комбинации в ARIA: role=checkbox и aria-checked=mixed
• Избегайте aria-roledescription
- Эффекты
• Эффект морфинга при наведении на текст
• Руководство по воссозданию эффекта погружения при скроллинге
CSS
• Полностью отзывчивый дизайн — это больше, чем просто медиа-запросы
• Гибкая разметка без медиа-запросов: функции min(), max(), clamp()
• Мои любимые вопросы о CSS с детальными ответами
• Atomic CSS-in-JS
• Selection в CSS
• Фейковые трехмерные элементы с помощью CSS
• Мысли по поводу реализации Container Queries в браузерах
• Свойство CSS «content» принимает альтернативный текст
• Как решить проблему Z-index в течение 1 минуты
• 3 безумно простых способа переключить ваш сайт в темный режим
• Создайте красивый input range только с CSS
• Что мы упускаем при обучении CSS?
JavaScript
• Дорога в ад JavaScript-зависимостей
• Я перехожу на JavaScript
• Продвинутый TypeScript
• Цена JavaScript-фреймворков
• Неироничная ненависть к JavaScript
• Alpine.js: JavaScript Framework, который используется как jQuery, написан как Vue и вдохновлен TailwindCSS
• Продолжительный рефакторинг 100000 строк кода — TinyMCE на TypeScript
• Шпаргалка по window.location
- React
• Создаём веб-приложение с бэкендом на Django и фронтендом на React
• Разработка реактивного гамбургер-меню с помощью React-хуков, TypeScript, и styled-components.
• Улучшение производительности загрузки страниц Next.js и Gatsby с помощью чанков
• Демистификация React Redux
• Что бы я хотела знать о React
• Должен ли я использовать делегирование событий в React?
• Интеграционное тестирование в React: больший охват, меньше тестов
• Реализация темного режима в приложениях React с использованием styled-components
• Визуальное руководство по ментальным моделям React
• Сравнение Next.js и After.js для приложений c SSR React
- Angular
• Русскоязычная документация по Angular
• Angular CLI flows. Big picture.
• Плохие практики Angular: свежий взгляд
• Лучший способ передать данные в ваши Angular компоненты
- Ember
• Рекурсия в шаблонах Ember.js, case factorial(n)
• Превью деплойментов с с ember-cli-deploy и Github actions
- Svelte
• Почему стоит попробовать Svelte
• Хотите изучить Svelte? Вот наш бесплатный курс из 16 частей от Svelte Master
• Обработка инпутов в Svelte
- Libs & Plugins
• Cupertino Pane — современная слайд-панель с использованием тач-технологий
• 10 JavaScript библиотек для манипуляций с изображениями на 2020 год
• quotable-toolbar — TypeScript плагин, который реализует цитирование текста на веб-страницах
• Определение токсичности текста с помощью React и Tensorflow
• Hero Generator: Создайте красивый hero image для своего сайта или приложения
• jExcel это плагин для создания электронных таблиц в вебе, совместимых с Excel и другими таблицами
• utfu: заменяет непонятные символы из старых кодировок на правильные символы UTF-8.
Браузеры
• Браузеры. Вольный перевод статьи Джереми Кейта “User agents”
• Доступен Firefox Preview 5.0 для Android
Занимательное
• Mozilla тестирует сервис анонимных email-адресов Firefox Private Relay
• Microsoft открыл свою реализацию протокола QUIC, применяемого в HTTP/3
• С 2006 года Google закрыла 200 проектов: 23 приложения, 16 устройств и 161 сервис
• Новое платье капитализма. Как IT-компании превратились в надзирателей
• LinkedIn добавила инструмент для репетиций собеседований: программа находит слабые места в речи и даёт рекомендации
• Google сделали доступными старые мини-игры, посвященные разным событиям
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort