Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры | Занимательное |
•
Подкаст «CSSSR»: Новости 512 —WSL 2, Webpack 5 Alpha, V8 Lite, REST и оплата проезда лицом
•
Подкаст «Веб-стандарты», № 192. Firefox 69, перфоманс, File API, якоря, чат Chatix и трансляция экрана
• Подкаст «Фронтенд Юность (18+)»: #107 Тайные желания Ричарда Столлмана Pro Unlimited
•
Подкаст «The Art Of Programming» — №197 Фронтендинг в деле
•
Подкаст «Сделайте мне красиво», Выпуск №24 — Reactgate, 7 истин и Largest Contentful Paint
•
15 видео c ComponentsConf 2019 Australia
•
FrontSpot Show #11: Аня Селезнева про девушек в айти, обнимашки и дайверсити.
•
Современная архитектура фронтенда
•
5G определенно сделает веб медленнее, наверное
•
(Почему) Некоторые конструкции в HTML являются «необязательным»
•
Как контрибьютить в open source проекты
•
X3D: декларативный 3D для современного Интернета
•
CSS переменные и цветовая тема для сайта в несколько строк
•
Быстрое, удобное, адаптивное меню для 1075 категорий (36000 товаров)
•
Как создавать уникальные, красивые веб-сайты с Tailwind CSS
•
Уязвимости в CSS
•
Прозрачные кнопки с hover эффектом, зависящим от стороны наведения
•
«Заходят два браузера в скролл-бар». Зак Лезерман о поведении и возможностях кастомизации скроллбаров
•
Логические операции с CSS переменными
•
Как убрать неиспользуемый CSS
•
CSS Grid: подборка типичных журнальных раскладок
•
Быстрое введение в Svelte с точки зрения разработчика на Angular
•
Использование JavaScript-модулей в продакшне: современное состояние дел: Часть 1, Часть 2
• Первое знакомство с ReasonML
•
Как находить ошибки в JavaScript коде с помощью Debugger
•
Метрономы в JavaScript
•
Практическое руководство по мониторингу ошибок браузера с помощью window.onerror
•
Машинное обучение для фронтенд-разработчиков с Tensorflow.js
•
Более легкий V8. О техниках оптимизации памяти, которые были использованы при работе над V8 Lite
•
Как я отлаживаю Javascript код, который писал не я
•
ECMAScript-new-features-list — полный список новых особенностей ES, включая ES6, ES7, ES8, ES9 и ES10 (2015-2019)
•
Самая выдающаяся новая функция в Javascript, о которой вы должны знать: Optional Chaining
• Chrome 77 научился пересылать вкладки с одного устройства на другое
• Chrome 77 ломает страницы логина для устройств Netgear
• В Chrome 78 начнутся эксперименты с включением DNS-over-HTTPS
• Браузер Vivaldi вышел на платформе Android
• Mozilla запускает Firefox Private Network в виде расширения для браузера
•
Суд США полностью легализовал скрапинг сайтов и запретил ему технически препятствовать
• Google поменял правила для nofollow-ссылок
• Yoast: Google не должен был единолично менять подход к обработке rel=nofollow
• WordPress добавит поддержку нового атрибута rel=ugc в следующем релизе
• Сравнение производительности сетевого драйвера в вариантах на 10 языках программирования
• Google меняет алгоритмы ранжирования новостей в поиске, приоритет отдаётся первоисточникам оригинального контента
• Google начал принимать меры в отношении арендованных поддоменов
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры | Занимательное |
Медиа
•

•

• Подкаст «Фронтенд Юность (18+)»: #107 Тайные желания Ричарда Столлмана Pro Unlimited
•

•

•


•

Веб-разработка
•

•

•

•

•

- Инструменты
•Встречайте caniemail.com — онлайн сервис, где можно посмотреть поддержку HTML и CSS различными почтовыми клиентами
•Caniuse и MDN объявили о коллаборации и совместном использовании данных
•Переносим JavaScript разработку в Bash на Windows
•Мои любимые браузерные расширения для веб-разработки
- Доступность
•Зачем вашему приложению Accessibility
•Button Contrast Checker — онлайн-инструмент для автоматической проверки контраста кнопок
- Эффектный веб
•Подборка креативных демок «Awesome Demos Roundup #8»
•Подборка вдохновляющих сайтов «Inspirational Websites Roundup #8»
CSS
•

•

•

•

•

•

•

•

•

JavaScript
•

•

• Первое знакомство с ReasonML
•

•

•

•

•

•

•

•

- Теория
•5 вещей, которые чаще всего не понимают новички в JavaScript
• Используем приёмы из функционального программирования, чтобы улучшить свой код на JavaScript
• Как работает JavaScript
• Копирование объектов в JavaScript
•Очередная подборка полезных советов по JS
•4 способа безопасного доступа к вложенным объектам в ванильном Javascript
•Повторное введение в деструктуризацию
•Нет ничего неправильного в том что «emoji».length == 7
- React
•Три типовых ошибки в сфере безопасности, о которых должен знать каждый React-разработчик
•Разработка автоматизированных тестов для React
•Создание бокового гамбургер-меню с React Hooks и Styled Components
•Почему мы перешли на React Hooks
•React Dev Tools — Отладка в стиле ниндзя
- Vue
•Веб-приложение на Kotlin + Spring Boot + Vue.js
• Передача конфигурации в Vue.js
• Внедрение зависимостей с помощью Vue.js
•Создание приложения с использованием Styled Components во Vue.js
•Несколько полезных трюков для Vue.js
•Почему Vuejs такой клевый?
•Как протестировать приложения на Vue с помощью фреймворка Cypress
•«Vue 3 | Looking into the Vueture: Composition Functions». Доклад Натальи Теплухиной на ComponentsConf 2019
•JSFoo: VueDay 2019
- Angular
•Как создавать дружественные для поисковых систем интернационализированные веб-приложения с Angular Universal и ngx-translate
•Добавление интернационализации (i18n) в приложение на Angular
•Настройка Angular CLI проекта с помощью GraphQL
•Что нового после Angular 8
- Libs & Plugins
•css-dot-js-loader — Webpack loader, позволяющий генерировать статичный CSS с помощью JavaScript
•check-imports — CLI инструмент, который парсит импорты и автоматически добавляет зависимости в package.json, удаляя лишние
•Как одной строчкой добавить поддержку черной темы
•Google добавил официальный плагин с «Native Lazyload» в Wordpress
•js-fire — библиотека для автоматического создания CLI из большинства js объектов
•poetic: Быстрая настройка ESLint, Prettier и Airbnb одной строкой
•js-noisy-gradient — небольшая библиотека для сглаживания видимых границ в градиентах
Браузеры
• Chrome 77 научился пересылать вкладки с одного устройства на другое
• Chrome 77 ломает страницы логина для устройств Netgear
• В Chrome 78 начнутся эксперименты с включением DNS-over-HTTPS
• Браузер Vivaldi вышел на платформе Android
• Mozilla запускает Firefox Private Network в виде расширения для браузера
Новости
•

• Google поменял правила для nofollow-ссылок
• Yoast: Google не должен был единолично менять подход к обработке rel=nofollow
• WordPress добавит поддержку нового атрибута rel=ugc в следующем релизе
• Сравнение производительности сетевого драйвера в вариантах на 10 языках программирования
• Google меняет алгоритмы ранжирования новостей в поиске, приоритет отдаётся первоисточникам оригинального контента
• Google начал принимать меры в отношении арендованных поддоменов
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.