Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• Подкаст «Веб-стандарты», Выпуск №182. Node.js, npm и JetBrains, сервис-воркеры и WASM, цена JS, современный CSS, доступность
• Подкаст «Веб-стандарты», Выпуск №181. Panda Meetup, Chrome 76, a11y, тост, препроцессоры и jQuery
• Подкаст «Frontend Weekend» #94 – Денис Мишунов о том, почему стоит уезжать в Норвегию и удалённо работать в GitLab
• Подкаст «CSSSR», Новости 512: Vue 3 RFC обновлён, ещё о микросервисах, новый убийца Redux и интересные публикации
• Подкаст «Фронтенд Юность (18+)» #97: Архитектура, которую ты не заслужил
• «Repozitorro» #20 — Портфолио наоборот...
• WSD в Москве 2019, 8 видео
• Amsterdam JSNation 2019, 15 видео
• Подкаст syntax.fm №154: SVGs с Sara Soueidan
Веб-разработка
• Как настроить веб-аналитику на AMP страницах
• Начинаете работать с веб-производительностью? Вот на чем нужно сосредоточиться.
• Создание PWA с помощью Webpack и Workbox
• Spam Detection API
• Имитация относительного позиционирования вложенного SVG внутри SVG
• HTML can do that?. Подборка демок, демонстрирующая возможности «чистого» HTML
- Accessibility:
• Как деревья доступности информируют вспомогательные технологии
• Отчет по судебным искам, связанным с веб-доступностью (ADA Compliance) за первое полугодие. (Спойлер: новый иск каждый час)
• Что такое доступность для веб-приложений и почему это меня волнует?
- Эффектный веб:
• Как правильно делать связанную скролл-анимацию
• Интерактивный сайт для изучения основ синтетической музыки. Работает на Web Audio, WebAssembly и WebGL с использованием three.js, Tone.js, anime.js и React с TypeScript
• useAnimations: анимированные иконки с помощью фреймворка Lottie и After Effects для использования в приложениях и веб-сайтах
CSS
• 10 PostCSS плагинов, которые сэкономят время вашему верстальщику
• 18 советов по CSS, которые сделают жизнь разработчика проще
• Три прогноза из State of CSS 2019 Survey
• Полное руководство по центрированию с помощью Flexbox
• a11y-css-reset
• Создание расписания конференции на CSS Grid
• Drag-n-drop sticky, без JS!
• Вариативные шрифты для разработчиков
• Думаем о БЭМ как о философии пользовательского интерфейса вместо именования CSS классов
JavaScript
• Стоимость JavaScript в 2019 году by Addy Osmani
• RxJS: простое введение
• Мгновенный поиск на ванильном JavaScript
- Теория:
• Функциональный JavaScript: пять способов нахождения среднего арифметического элементов массива и метод .reduce()
• 5 функций ES2019, которые вы можете использовать сегодня
• Как настроить полифилл globalThis в универсальном JavaScript
• Разбираемся с Async/Await в JavaScript на примерах
• Коллекции JavaScript – Set, Map, WeakMap и WeakSet
- Mongo/Node:
• Шаблоны проектирования в Node.js: практическое руководство
• Новый ECMAScript модуль поддерживается в Node.js 12
• Firebase или MongoDB: какую базу данных использовать для разработки приложения
- VueJS:
• Использование middleware во Vue
• Почему люди злятся на Vue 3
• Руководство для начинающих по Vue CLI
• Когда на самом деле нужен атрибут :key по Vue и зачем?
• Как начать работать с Vuetify
- React:
• Разработка приложения для потокового вещания с помощью Node.js и React
• Знакомство с useReducer React Hook
• Миф о недоступности React
• Десять заповедей React компонентов
• Добавление WebAssembly компонента в React приложение
• Продвинутые концепты React хуков пояснённые на примере игры Змейка
• Next.js или Create React App: какие приложения более производительны?
- Angular:
• Состояние Angular в 2019-м
• Понимание магии, которая стоит за элементами Angular
• Создание музыкального проигрывателя с использованием Kendo UI и Angular
• Что я узнал за 3 года разработки в Angular 2+
- Ember:
• Начало работы с Glimmer-Native
• Ember.js Seattle Meetup с Yehuda Katz
• Пожелания для роадмапа Ember 2019
- Libs & Plugins:
• 10 лучших JavaScript библиотек для визуализации данных на графиках и диаграммах
• freezeframe.js — библиотека, которая приостанавливает анимированные .gifs, запуская анимацию при наведении мыши / клику / тачу
• TWGL: небольшая вспомогательная библиотека для WebGL
• pixelmatch: небольшая, простая и быстрая JS библиотека для попиксельного сравнения изображений
• svelte-adapter: использование Svelte компонентов с Vue и React
Браузеры
• В Firefox Nightly тестируется генератор паролей
• Инструмент Track THIS от Mozilla позволяет обмануть рекламные алгоритмы
• В Microsoft Edge появится три режима блокировки отслеживающих скриптов
• В Firefox 68 будет предложена новая реализация адресной строки
• Первый выпуск нового браузера Firefox Preview для Android
Занимательное
• Самый важный навык, который может освоить программист
• Пользователи Google теперь могут ограничивать время хранения данных об активности (история местоположений, приложений и веб-поиска) на серверах компании
• Windows Terminal — основы настройки и первые впечатления
• «Разработка языка Kotlin обошлась намного дороже, чем наш средний продукт»: интервью с главой JetBrains
• Почему стоит включить в разработку прототипирование
• Facebook, Google и другие IT-компании совместно создадут общепринятый набор тестов для ИИ
• Трамп устно разрешил американским компаниям работать с Huawei
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort