Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• 
Подкаст «Пятиминутка Angular» #3: Meetups, CodeDojo MEAN, Angular 5 beta6, Cli bazel, PWA
• 
Подкаст «Frontend Weekend» FW #17: Веб-евангелист HTML Academy про Opera, конфликты и сексизм
• 
Подкаст «Пятиминутка React» #33: Кирилл Мокевнин, Hexlet.io
• 
Подкаст «devschacht»: Ночной фронтенд #2
• 
Подкаст «Фронтенд Юность (18+)» #17: Как прокачиваться на работе: Новинки DevTools, Quantum CSS, Code Retreat, Безголовые браузеры и многое другое
• 
Подкаст «Drinkcast», Выпуск #6: «Тим Маринин и мышки на тёрке»
• 
«ALL YOUR HTML» #13: «Анимируем SVG в 3D с помощью Three.js»
• 
HTML Шорты: Какие нужны фавиконки, 
текстовая версия
Веб-разработка
• 
Прототип проекта стоимостью $86 миллионов в 57 строках кода
• 
Ссылки вокруг блоков. Можно ли оборачивать ссылкой блочные элементы?
• 
Мобильные браузеры и их пушистые лапки. Про отладку сайта в мобильных браузерах
• Быстрый старт: начало работы с безголовым Chrome в Node.js
• 
Организация работы фронтенд-инфраструктуры и развития команд. Разработчик из AdRoll делится опытом
• 
Сравнение Bootstrap 4 и Foundation 6.4 . Часть №1 — Гриды
- AMP/PWA:
•
Android Oreo откусывает кусочек от PWA
•
Да, ваш проект должен быть PWA
•
Создаем Progressive Web App с помощью React
•
Создаем Progressive Web Apps с помощью Angular
•
iOS 11 Safari превратит ссылки Google AMP в обычные при шаринге
- Производительность:
•
Лекция Виталия Харисова «10k» про лёгкую версию поиска для медленных соединений и способы оптимизации кода, позволяющие уложиться в 10 килобайт.
• Гонка за скоростью. Ускоряем загрузку сайтов в эпоху смартфонов
•
20 практических советов по улучшению производительности работы JavaScript
•
Состояние интернета. Руководство по эффективному улучшению производительности от Karolina Szczur
•
Почему задержка (latency) имеет значение: основы веб-производительности. Нюансы и факторы, влияющие на скорость соединения на канале Front End Center
- Accessibility:
• Инклюзивность в веб-разработке: как обеспечить доступность контента каждому пользователю
•
Лучший способ программного масштабирования веб-приложения
•
Способы создания доступного пользовательского интерфейса, часть I
- Анимация:
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #51
•
Усиливаем анимацию суперспособностями с помощью requestAnimationFrame
•
Vivify — небольшая CSS-библиотека для анимации
CSS
• 
Внутри супер-быстрого CSS-движка: Quantum CSS (aka Stylo)
• 
Проверяем браузер на поддержку определённого CSS свойства
• 
Решаем проблему специфичности с помощью CSS модулей
• 
Как я интегрирую Bootstrap 4 и структуру моего SCSS в маленькие и средние проекты
• 
Создание «Skeleton Screens» с помощью пользовательских свойств CSS
• 
cssgrid.cc — подробнейшее руководство от CoffeeCup по построению лейаутов с помощью CSS Grid
• 
Библиотека чекбоксов на CSS
- Шрифты:
•
Adobe Typekit: теперь шрифты можно подключать без JavaScript (по аналогу с Google Fonts), шрифты готовы к Google AMP
•
Подробное руководство по веб-шрифтам от litmus (+ о веб-шрифтах в шаблонах писем)
•
Пользовательские интрефейсы для вариативных шрифтов
- CSS & JS:
•
Как изображения на чистом CSS помогли мне понять компоненты React
•
Доступ и модификация CSS переменных с помощью Javascript (и почему они лучше, чем переменные в SASS)
•
Как можно безопасно использовать CSS-in-JS?
JavaScript
• 
Пятничный JS: reqyire.js и очепятко-ориентированное программирование
• Microsoft анонсировала обновление TypeScript 2.5
• 
Изучаем JavaScript: 9 основных ошибок, которые вас тормозят
• 
BackboneJS: Getting Started. Как быстро начать создавать приложения на BackboneJS.
• 
Официальный блог JS движка V8: быстрые свойства в V8
• 
Лучшие JS фреймворки для фронтенда
• 
Angular vs. React vs. Vue: сравнение в 2017
• 
JavaScript — от коллбеков до async/await
VueJS:
• Реактивность Vue.js. Реактивность фреймворка Vue.js и использование метода Vue.set
•
Почему мы перешли с Angular 2 на Vue.js (и почему мы не выбрали React)
•
Переход с Angular на Vue.js
•
AT-UI — свежий UI-Kit от китайцев для создания десктопных веб-приложений на Vue.js 2.0
•
Используем TypeScript для разработки веб-приложений на Vue.js. Бесплатный курс на egghead.io
•
Async в Vue.js — часть 1
•
Быстрое введение в Vue.js на примере Super Mario Pixel Art
React:
•
semiotic — фреймворк для визуализации данных в React (React & D3)
•
Перетаскиваемые элементы с помощью RxJS
•
План миграции с экосистемы React из-за вопросов с патентом
Angular:
•
Шпаргалка по Angular 4
•
Введение в роутинг компонентов с помощью Angular Router
•
Все про AngularJS, Angular 2 и Angular 4
•
Процесс router-навигации в Angular за 7 шагов
•
12 полезных бойлерплейтов для AngularJS
•
Angular 4 и взаимодействие соседних компонентов
- Libs & Plugins:
•
easter-egg-collection — js библиотека, включающая в себя набор пасхальных яиц
•
Quokka — живой JavaScript Scratchpad теперь и для редактора Atom
•
lozad.js — продвинутый производительный Lazy Loader, использующий Intersection Observer API
•
jest-in-case — утилита для jest для создания вариаций одного теста
Браузеры
• 
Метод идентификации через определение дополнений, установленных в Chrome и Firefox
• 
Что нового в DevTools (Chrome 62)
• 
Новые возможности Microsoft Edge: Event Listeners, CSS object-fit/object-position, position: sticky и многое другое
Занимательное
• 18 SEO-мифов, о которых нужно забыть
• История разрушения SoundCloud: рассказ инсайдеров компании
• Обнаружена очередная атака на веб-браузеры, заражающая компьютеры при установке шрифтов
• YouTube представил новый дизайн и логотип
• Google ARCore – новая платформа дополненной реальности поискового гиганта для Android-устройств, Project Tango уходит в прошлое
• В чат Skype внедрили редактор кода для проведения собеседований
• Microsoft и Amazon договорились о совместной работе голосовых помощников Cortana и Alexa
• Microsoft и Red Hat объявили о расширении сотрудничества
• Криптовалютный трейдер Тони Вейс — о «пузыре» вокруг биткоина, плохих ICO и переоценённости блокчейна
• Как братья-миллиардеры хотят создать более дешевого конкурента Slack
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort
