Дайджест свежих материалов из мира фронтенда за последнюю неделю №283 (2 — 8 октября 2017)

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

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

Медиа

• Подкаст «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.

Автор: alexzfort

Источник