Дайджест свежих материалов из мира фронтенда за последнюю неделю №299 (22 — 28 января 2018)
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• 
Подкаст «Пятиминутка Angular» #8 — Retrospection, AngularKiev, RxJs lettable operators, Ng 5.2/6.0
• Подкаст «Frontend Weekend» #37 — Захар День о том, как и где научиться кодингу
• Подкаст «Фронтенд Юность (18+)»: #35 Веб-стандарты на максималках
• Подкаст «devschacht»: Ночной фронтенд #19 — Промисы и таймауты, immutable.js
• 
«ALL YOUR HTML» #33: «Анимация косых фонов на PIXI.js и clip: rect»
Веб-разработка
• 
Чему мы научились, делая приложения с Веб Компонентами
• Психические заболевания в веб индустрии
• Часть 2: как остановить меня от собирания номеров кредитных карт с ваших сайтов
• Интерактивные письма с помощью SVG и SMIL
• Анимация градиентной топографии
- AMP/PWA:
•
PWAs приходит в iOS 11.3: Купертино, у нас проблема
•
Улучшит ли AMP ваши рейтинги? Как организовать тестирование AMP
•Новые примеры успешного использования AMP
•Процессинг форм на страницах AMP с помощью Amazon API Gateway и AWS Lambda
- Инструменты:
•Релиз Parcel v1.5.0: Source Maps, WebAssembly, Rust и многое другое
•Релиз webpack 4 beta — попробуй его сегодня!
•webpack 2017: обзор случившегося за год
•Multiple routes, бандлинг и lazy-loading с помощью webpack
•Руководство по Webpack 4: все, что вам нужно знать, с 0 Conf до Production Mode
•karmatic — Easy automatic (headless) browser testing. Powered by Karma, Webpack & Jasmine.
- Accessibility:
•Доступность писем в действии
•Понимание WCAG 2.1 — обзор критериев и условий для мобильных устройств
•Практические примеры улучшения доступности
•Радикально доступные интернет-приложения — доклад Marcy Sutton на btconfMUC2018
CSS
• 
Соглашения по именованию CSS-сущностей и экономия времени
• Fun Frontend: мониторим страницу без JS
• Вы освоили азы JavaScript. Но что дальше?
• Снова о CSS Box Alignment (свойствах для выравнивания всего): простая шпаргалка
• Использование CSS Clip Path для создания интерактивных эффектов
• Презентация CSS Gridish: опенсорсный инструмент, который поможет вашей команде использовать CSS Grid уже сегодня
• В защиту Utility-First CSS
• Объяснение CSS Grid за 7 минут (с диаграммами и кодом)
• CSS Scroll Snap: что это? Нужно ли нам это?
• Анимационный эффект расходящихся волн на CSS3
JavaScript
• Может ли в JavaScript конструкция (a==1 && a==2 && a==3) оказаться равной true?
• JavaScript в 2018 — что изучать?
• Топ 10 ошибок JavaScript из 1000+ проектов (и как их избежать)
• Быстрое введение в Styled Components с интерактивными примерами
• The WHY behind the WAT: объяснение странной системы типов JavaScript
- ES2015+:
•Регулярные выражения ECMAScript становятся лучше!
•Интересные предложения для ECMAScript 2017, которые не были приняты
•Шаблонизаторы с ванильными литералами шаблонов JavaScript ES2015
•Советы и трюки ES6, которые сделают ваш код чище, короче и проще в чтении
•5 советов и размышлений насчёт Async / Await функций
•ECMAScript 2018: финальный набор функций. Чего ожидать от ECMAScript 2018: Object Rest/Spread Properties, Promise.prototype.finally (), Template Literal Revision, RegExp features: named capture groups, Unicode Property Escapes, lookbehind Assertions, — s (dotAll) flag
VueJS:
•Программное создание экземпляров компонентов Vue.js
•Nuxt аутентификация с нуля
•Routing и Route Protection в рендерящемся на сервере Vue приложении с помощью Nuxt.js
•4 основные функции ES2015 для разработки на Vue.js
React:
•Частые трудности работы с React.js
•Советы по стилю. Как написать читаемый React-код
• Как воткнуть Реакт в существующий сайт
•Как конвертировать Angular приложение в React приложение — по одному компоненту за раз
•Как создать ваш собственный React бойлерплейт
•Введение в React Easy State
Angular:
•Реактивные формы (reactive forms) Angular 5 (2+). Часть 2
• Руководство для начинающих по Angular 4:Сервисы, роутинг, компоненты
•Клиент Apollo для Angular — используем GraphQL
- Libs & Plugins:
•d3-discovery — Все плагины для d3.js в одном месте
•greenlet — перемещение async функции в собственный поток
•Toast UI Editor — опенсорсный Markdown WYSIWYG редактор
•jsnes — JavaScript NES эмулятор
Браузеры
• 
Ещё большее ускорение WebAssembly: новый потоковый и многоуровневый компилятор в Firefox
• Релиз Firefox 58, технические подробности от Марата Таналина
• Firefox 58 получил очередной прирост производительности и поддержку Progressive Web Apps для Android-версии
• 
Выпуск web-браузера Chrome 64
• Google предлагает экспериментальную функцию по добавлению 3D объектов дополненной реальности в браузеры
• Браузер Google Chrome научился навсегда отключать звук на сайтах с автоматически включающимися видеороликами
• Adblock Plus: Встроенный в Google Chrome блокировщик будет блокировать только 16% рекламы
• Техничекие подробности Safari Technology Preview 48
Занимательное
• SEO для Google в 2018: хорошо забытое новое
• Как блокчейн изменит способы хранения документов об образовании
• GitHub объявил о поддержке создания нескольких шаблонов Issue и Pull request
• Adobe выпустила новую версию Photoshop с поддержкой ИИ
• Главные технологические тренды в 2018 году
• Microsoft покажет пользователям, какую информацию собирает о них Windows 10
• Разработчик-ветеран Google обвинил компанию в подражании конкурентам и объявил об уходе
• Спасибо, Twitch: как зарабатывать сотни тысяч долларов, играя в видеоигры
• Мошенники смогли разместить на YouTube рекламу с кодом для майнинга криптовалюты
• Facebook открыл код платформы Detectron для распознавания объектов на фотографиях
• Facebook изобрела новую единицу времени — «щелчок»
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
