Дайджест свежих материалов из мира фронтенда за последнюю неделю №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.
