Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• Еженедельный подкаст «Недельный Vue», выпуск 1.
• Подкаст «Пятиминутка React» #44 — Из жизни одного middle разработчика
• «Девшахта — подкаст»: #47: Тестируй как дядя Боб
• Интервью с руководителем ШРИ Сергеем Бережным
• ChernivtsiJS 2018 — June 23, 2018, 12 видео
Веб-разработка
• Введение в программирование шейдеров для верстальщиков
• Микросервисный фронтенд — современный подход к разделению фронта
• Web Payments, Payment Request API и Google Pay
• Создание AR/VR с помощью Javascript и HTML
• Быстрое введение в веб-безопасность
• Обзор популярных статических генераторов сайтов
• Новые инструкции по доступности в WCAG 2.1
- Производительность:
•Советы по улучшению производительности CSS и JS анимаций
•Руководство по использованию webpagetest
•Как мы вошли в топ 3 самых быстрых e-commerce сайтов
•Погружение в веб-производительность по версии Google I/O 2018
•Глубокое погружение в веб-производительность в 2018
- Инструменты:
•Профессиональные советы по использованию Visual Studio Code для достижения наибольшей производительности в 2018
•SVG 3D Builder — комплексный инструмент для создания трехмерных моделей на svg
•SVG Filters Playground. Инструмент, который делает управление фильтрами гораздо удобнее
- Эффектный веб:
•Codepen-подборка CSS/SVG эффектов для текста в вебе
•Подборка креативных анимацией для «гамбургер»-меню
CSS
• Кастомный подход для нормализации и сброса стилей (custom-reset.css)
• Решено с помощью CSS! Логическая стилизация на основе числа элементов
• Пишем CSS лучше и красивее
• Использование функции определения поддержки для написания кроссбраузерного CSS
- Стандарты:
• Стандарт для нестандартного
• Иногда они возвращаются: псевдоэлементы с префиксом -webkit- станут валидными в Firefox
•::before vs :before
- Визуальные эффекты:
•Несколько слов о градиентах
•Отзывчивые изображения: CSS-приёмы, которые помогают экономить время
•Использование CSS Clip Path для создания интерактивных эффектов, часть 2
•Использование background-attachment CSS для создания прилипающей фоновой рекламы в iFrame
•Реальные примеры использования CSS с SVG
•Продвинутные эффекты с помощью режимов смешения фонов в CSS
- Лейаут:
•Всё, что нужно знать о выравнивании во Flexbox
•Преимущества использования CSS Grid для раскладок веб-форм
- Типографика:
•Исследование вариативных шрифтов
•Вариативные шрифты и дислексия
- PWA:
•CSS и PWA: некоторые советы по созданию прогрессивных веб приложений
•Инструменты оптимизации CSS для ускорения прогрессивных веб приложений
JavaScript
• TypeScript 3.0
• Веб-приложения и серверы, работающие с JavaScript, уязвимы перед атаками ReDoS
• Топ 33 JavaScript проектов на GitHub
• Чеклист для написания компонентов повторного использования в React и Vue
- Tutorials:
•Создание живого графика на D3.js
•Пример Javascript Fetch API, руководство с нуля
•Создание простого генератора статических сайтов с Node.js
•Первые шаги с TensorFlow.js
- Теория:
•JavaScript: исследование объектов
•Повышаем уровень владения методом работы с массивами filter
•Сложные числа в JavaScript
•Итераторы и генераторы занимают свое место в современном JavaScript
•Асинхронная рекурсия: обещания, удивления, но, прежде всего, путаница
VueJS:
•Состояние Vue.js в 2018
•Создание SEO-Friendly SPA на Vue.js с помощью Prerender, а также советы
•JS-разработчик бросает вызов Google и Facebook
•Обработка тач-событий с помощью VueJs
React:
•Kotlin + React vs Javasript + React
•Руководство по React Autocomplete с примером
•Полное руководство по props в React
Angular:
•Свойства Angular v6, которые меняют правила игры
•Создание оптимизированного для поисковиков PWA на Angular — часть 1
•Как создать архитектуру плагина/расширяемого приложения на Angular5+
- Libs & Plugins:
•size-plugin — отображает размеры сжатых ассетов вашего webpack и изменения с момента последнего билда
•WorkerDOM — реализация DOM API, предназначенная для работы внутри Web Worker
Браузеры
• Mozilla объявила об удалении устаревших дополнений Firefox
• Грядущее обновление Google Chrome 69 принесет радикально новый дизайн браузера
• В Firefox 62 планируют активировать системное дополнение Firefox Monitor
• Chrome для Android может начать отключение JavaScript на 2G соединении
Занимательное
• Яндекс отменяет тИЦ и вводит новый показатель качества сайта
• Программисты шутят. Не пора ли запретить?
• Европейский союз запретит производство галогенных ламп с 1 сентября
• Windows 95 портировали на Electron
• Ядру Linux исполнилось 27 лет
• Как закалялась мышь: эволюция игровой периферии
• OG стала чемпионом The International 2018. За победу коллектив заработал $11,2 млн.
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort