Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
•
Подкаст «Веб-стандарты» 198. Sass жив, компоненты без JS, новый сброс стилей, странный CSS
•
Подкаст «Frontend Weekend» #98 – Татьяна Смирнова о том, зачем становиться деврелом и как убедить разработчиков выступать
•
Подкаст «CSSSR»: Новости 512 —Django 3.0 beta, Python, open-source, Instagram, а также чек-лист Senior-инженера
•
«Девшахта-подкаст» #99: Настя Катаева о том, чем занимается DevRel в СКБ Контур
•
Подкаст «Пятиминутка React»: Reatom vs MobX
•
Подкаст «Сделайте мне красиво!»: Выпуск №28 — Снова о монорепозитории, локфайлы и HTTP/3
•
Pro Conf #34: JS Conf EU 2019
•
Repozitorro #31 — Код ревью — это не больно
•
WSD в Екатеринбурге, 2019. Запись трансляции
•
Видео с Fronteers 2019
•
Кибернетически улучшенные Web-приложения
•
Новичок в тестировании фронтенда? Начните с вершины пирамиды!
•
Верификация телефонных номеров в вебе с помощью SMS Receiver API
•
Воспоминания о прошлой веб-разработке (Christian Heilmann)
•
Подборка креативных веб-демо «Awesome Demos Roundup #9»
•
Знакомство с Sass модулями
•
Как CSS Grid меняет представление о структурировании контента
• Вопросы по CSS
• CSSWG одобрила size для краткой записи width и height
•
Удивительный мир CSS counters
•
Более быстрые макеты с помощью CSS Grid (и Subgrid!)
•
Делаем таблицы отзывчивыми с помощью с минимального CSS
•
Стилизуйте стиль наведения, фокус и активное состояние по-разному
•
Остановка анимации во время изменения размера окна
•
Создание собственных синтаксических конструкций для JavaScript с использованием Babel. Часть 1, Часть 2
•
Web — javascript authentication, obfuscation и native code. Решение задач с r0от-мi —. Client. Часть 1
•
Developing с Node.js on Windows. Новое руководство в блоге разработчиков Microsoft, посвященное разработке на Node.js в новой версии Windows с WSL 2
•
Как мы потерпели неудачу, а затем преуспели при переходе на TypeScript
•
7 простых, но хитрых вопросов для интервью по JavaScript
•
Понимание MVC-сервисов для фронтенда: VanillaJS
•
Следует ли нам провести ребрендинг JavaScript?
• В Firefox появятся новые индикаторы безопасности и интерфейс about:config
• Усиление изоляции между сайтами в Chrome
• BSI: Firefox — самый безопасный браузер
• Apple объяснила, что трафик пользователей Safari не передается китайской компании Tencent
• Safari против paywall
•
Новый WebSocket Inspector в Firefox
•
Улучшение элементов форм в Microsoft Edge и Chromium
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
•

•

•

•

•

•

•

•

•

•


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

•

•

•

•

-
Инструменты
•Заметки верстальщика: Полезные расширения Google Chrome в 2019 году
• Псевдоним модуля в Webpack
•Инструменты и классификация в JAMstack
•Что нового в DevTools (Chrome 79)
-
Производительность
•Метрики производительности для исследования невероятно быстрых веб-приложений
•Предварительная загрузка шрифтов
•Awesome Webpack Perf — курируемый список webpack инструментов и плагинов, которые помогают делать веб быстрее
-
Доступность
• Инклюзивные компоненты: сворачиваемые секции
•Мифы о Color Contrast Accessibility
•За пределом автоматического тестирования доступности: 6 вещей, которые я проверяю на каждом своем сайте
CSS
•

•

• Вопросы по CSS
• CSSWG одобрила size для краткой записи width и height
•

•

•

•

•

JavaScript
•

•

•

•

•

•

•

-
Теория
• Распространённые заблуждения о наследовании в JavaScript
• Сказка о трех точках в JavaScript
•Организация вашего кода JavaScript с помощью функций
•Комплексное руководство по операторам, выражениям и инструкциям в JavaScript
-
React
•React 17 что нового? Что ждать в новой версии?
•Я создал одинаковое приложение на Redux и React. Вот различия.
•Сравнение 8 способов стилизации компонентов в React
•Введение в SVG для React разработчиков
•Наблюдение за видимостью элементов в React
•Как я учил React
•Как стать разработчиком React за 5 месяцев
-
Vue
•Использование Vuex Store с TypeScript: решение, совместимое с Vue 3 Composition API
•Эксперименты с WebGL и Vue: как анимировать субтитры?
•Релиз Vue CLI version 4
•Модульное тестирование во Vue: ваш первый тест
•Быстрые веб-приложения с Vue 3
•Как сделать приложение для Windows на Vue.js и Electron
•[Editor's Cut] Live coding: The new Composition API — Vue.js London — Jason Yu
-
Angular
•Обработка несколько API запросов в Angular, используя mergeMap и forkJoin, чтобы избежать вложенных подписок
•Обмен данными между компонентами Angular
•The Angular Team @ AngularConnect 2019
-
Ember
•Начинаем работать с компонентами Glimmer в Ember.js
•Что нового в Ember
Браузеры
• В Firefox появятся новые индикаторы безопасности и интерфейс about:config
• Усиление изоляции между сайтами в Chrome
• BSI: Firefox — самый безопасный браузер
• Apple объяснила, что трафик пользователей Safari не передается китайской компании Tencent
• Safari против paywall
•

•

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.