Фронтенд-дайджест №348 (14 — 20 января 2019)

А начать хотелось бы участием в трендовом флешмобе последнего времени - 10 years challenge:

Медиа

• Подкаст «Веб-стандарты», Выпуск №157: JavaScript в вузах, JS десять лет назад, браузеры и текст в VR/AR, HTML-модули в JS.
• Подкаст «Frontend Weekend» #87 – Михаил Трошев о том, как эффективно руководить распределённой командой в Яндексе
• Девшахта #66, Платформенные команды
• Подкаст «CSSSR»: Новости 512 — Выпуск №34 (14.01 — 20.01)
• "ALL YOUR HTML" #s2e5: "Макаронный монстр из полосок и шейдеров"
• Видео с Odessa Frontend MeetUps #7-9

Веб-разработка

• Electron: разработка настольных приложений с использованием HTML, CSS и JavaScript

• 12 странных вещей, которые могут произойти после установки npm пакета

• Типы инпутов в HTML5: что сейчас с ними?

• Новичок в JAMstack? Все, что нужно знать для начала работы с ним

• Веб-стандарты: что, почему и как

• Лучше один раз увидеть, чем сто раз услышать, лица и штрих-коды — Shape Detection API

• Почему GraphQL выигрывает у традиционных API

• GraphQL: руководство для начинающих

• Производительность:

  • Использование функции аудита Chrome DevTools для измерения и оптимизации производительности (часть 1)
  • Как использовать Chrome Dev Tools для поиска узких мест в производительности
  • Как повышение производительности сайта может помочь спасти планету
  • Что такое Client Hints и стоит ли их использовать
  • Оптимизация рендеринга в браузере для фронтенд-разработки

• Tools:

  • Puppeteer для краулинга страниц сайта и сохранения их в Markdown
  • STAR (Design Systems + TypeScript + Apollo GraphQL + React): новое поколение фронтенд-инструментария для разработки
  • Как перейти на Gulp.js 4.0
  • wpk - продвинутый, но интуитивно понятный неофициальный CLI для webpack
  • Визуализатор кода функций с экспортом в SVG

• Accessibility:

  • Как разрабатывать макеты сайтов для скринридеров
  • Почему внедрение веб-доступности продолжает терпеть неудачу
  • Большая судебная победа веб-доступности в деле Domino’s Pizza, сайт которой не отвечал ADA Compliance

• Анимация:

  • Продвинутый Three.js: шейдерные материалы и постобработка
  • Руководство по созданию множества интерактивных частиц на Three.js
  • Как создать глитч-эффект для текста и изображений в CSS
  • SVG Filters 101. Руководство от Sara Soueidan, которое поможет вам понять, что SVG фильтры из себя представляют, и покажет, как их использовать для создания собственных визуальных эффектов.

CSS

• Как CSS специфичность работает в браузере
• Создание WEB компонента для управления звуковым каналом | Нестандартный подход к применению CSS Grid
• Анимация CSS Grid Layout, что мы имеем?
• Та же история, только с CSS
• Насколько хорошо вы знаете CSS Layout?
• Использование псевдокласса: lang с селектором атрибута lang для языковых стилей
• 2019 CSS Wishlist от Chris Coyier
• В защиту Utility-First CSS
• Полное руководство по SCSS / SASS.

JavaScript

• Переносим 30 000 строк кода с Flow на TypeScript

• Learn Vanilla JS - подробный план по изучению ванильного JS, наряду с учебными ресурсами и проектными идеями, которые помогут вам начать работу.

• Анимация URL с помощью Javascript и Emojis

• Как удалить неиспользуемый код с помощью DevTools

• Vue vs React: выбор лучшего инструмента для вашего проекта в 2019 году

• Как удалить дубликаты массивов в ES6

• Почему я перестал экспортировать дефолтные значения из моих JavaScript-модулей

• Мутирует ли метод данные 😱

• Теория:

  • JavaScript: вопросы и ответы
  • Краткая история JavaScript. Часть 3
  • Модули JavaScript: от IIFE до CommonJS и ES6
  • Практическое руководство по написанию более функционального JavaScript
  • Работа с часовыми поясами в JavaScript

• React:

  • Переиспользуемые инпуты форм в React. Просто и гибко!
  • Введение в React Hooks
  • Использование React Portals для отрисовки дочерних элементов вне иерархии DOM
  • Как создать прогрессивное веб-приложение на React-е (PWA)

• Angular:

  • Добавляем поддержку мультиязычности в Angular
  • Как настроить Webpack 4 с Angular 7: полное руководство
  • Angular, Autoprefixer, IE11, и CSS Grid заходят в бар...
  • Управление состоянием приложений в Angular используя Firebase
  • Плюсы и минусы выбора Angular для разработки веб приложений

• VueJS:

  • 8 худших вопросов на собеседовании по Vue.js
  • Vue RFCs (request for comments) - для существенных изменений / дополнений в ядре Vue
  • Проектирование Progressive Web App с использованием Vue CLI 3

• Libs & Plugins:

  • Facebook опубликовал Spectrum 1.0.0, библиотеку для работы с изображениями
  • shiny - Добавьте блестящие отражения к тексту, фону и границам на устройствах, которые поддерживают событие DeviceMotion.
  • jsdiff: нахождение разницы в тексте, реализованное на JavaScript

Браузеры

• Mozilla сворачивает программу Test Pilot и сервис Firefox Screenshots
• Firefox 67 начнёт использовать отдельные профили для разных установок
• В Firefox 69 планируется по умолчанию отключить поддержку Flash
• Ретроспектива Firefox DevTools WebConsole 2018
• Дополненная реальность и браузер - экспериментальное приложение