Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

    Медиа    |    Веб-разработка    |    CSS    |    Javascript    |    Браузеры    |    Занимательное

---

Медиа

• Подкаст «Веб-стандарты», Выпуск №89 – Браузеры и разнообразие, сетки и смерть сайтов, плохая кнопка, зачем доступность, знакомьтесь: JS.
• Подкаст «Frontend Weekend» #22 – Роберт Харитонов о том, как стать известным разработчиком в Европе
• Подкаст «devschacht»: Выпуск №8?—?От PhantomJS до Headless Chrome
• Подкаст «devschacht»: Ночной фронтенд #6?—?В самарском плену
• Подкаст «Фронтенд Юность (18+)» #21: Проблемы opensource: плохой Emotion, ужасный React Native: Hacktoberfest, Уход из IT, Работа 20 часов в неделю
• Подкаст «Drinkcast», Выпуск #11 — «Дизайн-системы и ui-киты»
• «ALL YOUR HTML» #17: «Perlin Noise, 1d, 2d, 3d»

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

• Консорциум World Wide Web представил вторую редакцию HTML 5.1
• Google запустил ряд технических обновлений для AMP, а также тестирует новый логотип для AMP в результатах поиска
• Все, что вы когда-либо хотели знать о защите HTML-форм
• Gutenberg — Крис Койер о наиболее важном изменении редактора WordPress за всю историю WP
• О создании крупномасштабного руководства по стилю на примере государственных сайтов привительства U.S.
• Почему роботы должны форматировать наш код за нас

• Accessibility:
  
  • Интерфейсы с табами. О нюансах доступности при создании вкладок
  • Как начать поддержку доступности в организациях, не выделяющих на это ресурсы?
  • Будущее доступности для кастомных элементов
  

• Анимация:
  
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #56
  • Moving Letters — коллекция креативных эффектов для текста, анимированных с помощью JavaScript & anime.js
  • Интересный эффект порезанного двойного изображения
  

CSS

• Кому нужны флексы
• Лучший способ реализовать «обёртки» в CSS
• CSS-десант. Википедия. ?При помощи сервиса пользовательских стилей Stylish допиливается UX популярного сайта
• Как создать адаптивную сетку
• Полезные классы CSS для задания размеров и присвоения имен
• CSS Grid Challenge: Победители и шаблоны
• Да будет мир в CSS. Комплексная статья о различных подходах к написанию стилей и войнах между ними
• Лучшие практики (S)CSS, о которых вы до сих пор не знали (на самом деле знали)
• Использование веб-шифтов. Отрывок из книги Webfont Handbook
• Руководство по letter-spacing, варианты использования, ux, доступность и многое другое

JavaScript

• Осторожно! Возможны побочные эффекты. Разбираемся с тем, что такое сайд-эффекты и что они несут нашему коду
• Более быстрое форматирование кода с помощью ESLint
• Худшие изъяны JavaScript, которыми любят злоупотреблять хакеры
• Анонс планов к релизу Ember 3.0
• Неловкие моменты JavaScript в забавных гифках
• Победители конкурса js13kGames 2017
• Многоликость `this` в javascript

• NodeJS:
  
  • Начало работы с Node.js
  • Node.js и переход с PHP на JavaScript
  

• ES2015+:
  
  • Промисы в ES6: паттерны и анти-паттерны
  • Объяснение Await и Async с помощью диаграм и примеров
  • Compiling vs Polyfills с помощью Babel (JavaScript)
  • Оптимизация ES2015 прокси в V8
  • Литералы шаблонов определённо лучше строк
  

• VueJS:
  
  • Quasar Framework?—?универсальный Vue-фреймворк
  • Vue.js Style Guide v2
  • vuera — React в Vue, Vue в React. Используйте компоненты Vue в вашем приложении на React
  • Создание переходов и анимаций во Vue.js: живые примеры
  • Создание онлайн-магазина с помощью Vue: 33 бесплатных урока
  • Создание научного калькулятора с помощью Vue.js
  • Реактивность в Vue.js 2 vs Vue.js 3
  

• React:
  
  • Новшества серверного рендеринга в React 16
  • 6 профессиональных советов для разработчиков React
  • React, инлайн фунции и производительность
  • React и JSS: советы после использования этого подхода в течении года
  • Как починить ваше приложение на React, если оно в тайне вас ненавидит
  • Уроки по миграции большой кодовой базы на React 16
  • Введение в React-Static? — ?прогрессивный статический фреймворк для React
  

• Angular:
  
  • Почему не работает ваше приложение на Angular: 11 основных ошибок
  • 6 лучших практик и профессиональных советов на тему использования Angular CLI
  • Angular и анимации: вдыхаем жизнь в ваши приложения
  

Браузеры

• Microsoft Edge стал кроссплатформенным браузером: компания Microsoft официально объявила о запуске Microsoft Edge для Android и iOS. Без движка EdgeHTML. iOS: WkWebView (EdgiOS). Android: Chromium (EdgA)
• Microsoft Edge: заметного роста числа расширений пока ждать не стоит
• Вышла новая версия браузера Opera с возможностью делать селфи
• Firefox прекратит поддерживать старые версии Windows
• Firefox 56: последняя остановка перед Quantum
• Safari Technology Preview 41: File и Directory API, min/max в calc(), удаление поддержки CSS Regions

Занимательное

• Google представила «премиального» домашнего помощника Google Home Max и компактную версию Mini
• Облачный сервис Dropbox представил новый дизайн и логотип
• Google тестирует mobile-first индекс в «живой» выдаче
• 10 вещей, которые не влияют на ранжирование сайтов в Google
• Bloomberg: Google запустит улучшенную систему защиты аккаунтов для политиков и топ-менеджеров
• По данным Net Applications доля Linux среди настольных систем достигла 6.88%
• 7 способов усовершенствовать навыки чтения кода
• Думать самим — или разумом ИИ?
• Стив Возняк: «Сегодня ИИ — это дополненный идиотизм»
• «Матрица отменяется»: Физики доказали, что реальность — не симуляция
• openvim — интерактивное руководство по Vim.

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

---

Дайджест за прошлую неделю.

Материал подготовили dersmoll и alekskorovin.