Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
• Подкаст «CSSSR» — Telegram разблокирован, WWDC 2020, DX, фичи NodeJS 14, Webpack 5 beta 18, VPN от Mozilla
• Подкаст «Веб-стандарты» №235: Евангелист Safari, Bootstrap 5, content-visibility, гриды, чекбоксы, forms, API для PWA
• Подкаст «Фронтенд Юность (18+)» №143: Жизни разработчиков важны
• Как верстать веб-интерфейсы быстро, качественно и интересно
• Как заработать на веб-скрапинге
• Как стать тимлидом фронтендеров и как жить после этого — расшифровка эфира
• Оглядываясь назад на пять лет существования AMP
• Обзор техник прокрутки страниц
• Эмуляция различных медиа выражений в Chrome и отладка темного режима
• Несоответствия рендеринга шрифтов в браузерах
• Стилизация Layout Wrappers в CSS
• Эффект смятого постера на CSS
• Проверка поддержки анимации с помощью “prefers-reduced-motion”
• Основы CSS: анимация
• Отладка HTML с помощью продвинутых селекторов CSS
• Использование пользовательского свойства «Stacks» для укрощения каскада
• Что JavaScript-разработчику следует знать о Curl
• Обход капч с помощью Headless Chrome
• Симуляция роста кристаллов: ограниченная диффузией агрегация на Javascript
• Память в JavaScript — без утечек
• Туториал. Список задач с drag & drop
• Как получить размеры экрана, окна и веб-страницы в JavaScript
• Новые функции в TypeScript 3.9
• Концепты JavaScript, которые нужно освоить перед изучением React
• В Chrome предложен новый интерфейс PDF-просмотрщика и добавлена поддержка AVIF
• Chrome, Firefox и Safari ограничат время жизни TLS-сертификатов 13 месяцами
• Приветствуем Safari в сообществе WebExtensions
• Safari, Web, и Authentication
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
• Подкаст «CSSSR» — Telegram разблокирован, WWDC 2020, DX, фичи NodeJS 14, Webpack 5 beta 18, VPN от Mozilla
• Подкаст «Веб-стандарты» №235: Евангелист Safari, Bootstrap 5, content-visibility, гриды, чекбоксы, forms, API для PWA
• Подкаст «Фронтенд Юность (18+)» №143: Жизни разработчиков важны
Веб-разработка
• Как верстать веб-интерфейсы быстро, качественно и интересно
• Как заработать на веб-скрапинге
• Как стать тимлидом фронтендеров и как жить после этого — расшифровка эфира
• Оглядываясь назад на пять лет существования AMP
• Обзор техник прокрутки страниц
- Инструменты
• Что нового в DevTools (Chrome 85)
• Как организовывать и внедрять стандарты написания кода
• npm v7 — Зачем хранить `package-lock.json`?
- Производительность
• Клиентский мониторинг производительности
• Синтетический мониторинг производительности
• Что нужно знать о метриках Core веб Vitals в Google
• WebP действительно лучше, чем JPEG?
• Как установить бюджет производительности для вашего сайта
• Как увеличить скорость вашего сайта и набрать 100 баллов на Google PageSpeed ??Insights
- Доступность
• Доступность для некоторых
• Доступное и удобное для клавиатуры гамбургер-меню + выдвижная навигация
- Эффекты
• Подборка креативных концептов «Awesome Demos Roundup #16»
• A Glitchy Grid Layout Slideshow
• Подборка креативных сайтов «Inspirational Websites Roundup #16»
• Custom Shape Dividers — инструмент для генерации разделителей страниц нестандартной формы на SVG
CSS
• Эмуляция различных медиа выражений в Chrome и отладка темного режима
• Несоответствия рендеринга шрифтов в браузерах
• Стилизация Layout Wrappers в CSS
• Эффект смятого постера на CSS
• Проверка поддержки анимации с помощью “prefers-reduced-motion”
• Основы CSS: анимация
• Отладка HTML с помощью продвинутых селекторов CSS
• Использование пользовательского свойства «Stacks» для укрощения каскада
JavaScript
• Что JavaScript-разработчику следует знать о Curl
• Обход капч с помощью Headless Chrome
• Симуляция роста кристаллов: ограниченная диффузией агрегация на Javascript
• Память в JavaScript — без утечек
• Туториал. Список задач с drag & drop
• Как получить размеры экрана, окна и веб-страницы в JavaScript
• Новые функции в TypeScript 3.9
• Концепты JavaScript, которые нужно освоить перед изучением React
- React
• Создаем прогрессивное веб-приложение на ReactJS и размещаем его в Netlify и PWA Store
• 15 вопросов для интервью по React с решениями
• Визуальные редакторы React в 2020 году
• Введение в SWR: Хуки React для удаленной выборки данных
• Практическое руководство по тестированию React-приложений с помощью Jest
• Проблемы и возможности создания приложений на React и React Native — обсуждение с Wix.com
• Создание документов с помощью MDX: Markdown для эпохи компонентов
• Как скопировать интерфейс Zelda BOTW с React, Tailwind и Framer-motion: Часть 1
• Что нового в Next JS 9.4
• Релиз React Query 2.0
- Vue
• Vue.js: The Documentary (Русская Версия)
• Установка вашего PWA на Vue.js
• Как сделать localStorage реактивным во Vue
- Angular
• Используем DI в Angular по максимуму — концепция частных провайдеров
• Что нового в Angular 10
• Стал доступен Angular 10
• RxJS: неожиданное
• Вот что вы должны знать при создании гибких и повторно используемых компонентов в Angular
- Ember
• The Ember Times — Issue No. 154
• Работа с кодовой базой Ember с точки зрения дизайнера
• Ускорение производительности Ember: поисковая оптимизация
• Как интегрировать Netlify-CMS с Empress-блогом
- Libs & Plugins
• keen-slider — легкий слайдер без зависимостей с отличной производительностью, поддержкой typescript, мультитач и совместимостью со всеми браузерами, включая IE 10.
• Checkboxland — JavaScript библиотека для рендеринга всего что угодно в виде HTML-чекбоксов.
• SolidJS: реактивный рендеринг интерфейсов
• tragopan — минималистичная библиотека без зависимостей для реализации pan/zoom
• Rando.js — простая и мощная функция для вывода случайного значения
• Noact — минимальная библиотека для отрисовки Virtual DOM
Браузеры
• В Chrome предложен новый интерфейс PDF-просмотрщика и добавлена поддержка AVIF
• Chrome, Firefox и Safari ограничат время жизни TLS-сертификатов 13 месяцами
• Приветствуем Safari в сообществе WebExtensions
• Safari, Web, и Authentication
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
aio350
спасибо за подборку