Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | JavaScript | Браузеры
Медиа
• Видеоблог Вадима Макеева, выпуск №25. Свежий взгляд на Gulp: функции и ES-модули
• Подкаст «Pro Conf» #66: Я Фронтенд — Все про картиночки | Фронтенд как у сына маминой подруги | ApolloClient 3
• Подкаст CSSSR: Microfrontends, Vue 3 development, any и unknown в TypeScript, почему CSS такой, Vue и тесты
Веб-разработка
• Что должен уметь верстальщик, чтобы его все хотели
• Создание прототипа SPA интернет магазина на htmlix.js
• Анонсирован новый раздел в MDN Web Docs — путь обучения для фронтенд разработчиков
• Новые возможности Node.js 14 — AI, IoT, Assembly и многое другое
• Достижение баланса между нативными и кастомными селектами
• Поддержка темного режима на вашем сайте
• 5 мифов о Jamstack
• Создание прогрессивного веб-приложения и его развертывание
- Инструменты
• (Очень простое) Руководство для начинающих по WEBPACK
• µcdn: a live, bundlerless, alternative
• starred_search — поиск по ключевым словам в отмеченных GitHub-репозиториях
- Доступность
• Оптимизация навигации с помощью клавиатуры с помощью tabindex и ARIA
• Устаревшие приложения и Accessibility
- Эффекты
• Airplanes. Клевая демонстрация скролл-анимации с помощью ScrollTrigger, нового плагина от GreenSock
• Как создать эффект движения фоновой сетки изображений при наведении
• Визуализация списка женщин-лауреатов Нобелевской премии в виде кристаллов в 3d с использованием Vue, WebGL, three.js
• TitleRun — игра, которая существует только в строке заголовка вкладки браузера
CSS
• Цвета в CSS
• Как использовать grid-template-area CSS Grid для изменения порядка элементов html в зависимости от размера вьюпорта
• Изучение Z-Index, используя инструмент визуализации
• CSS: is () и: where () приходят в браузеры
• Клевые маленькие хитрости CSS Grid для вашего блога
• Как обратить порядок пользовательские счетчиков в CSS
• Grid для разметки, Flexbox для компонентов
• Эффект складывания журнала на CSS
• Удивительные вещи, которые CSS может анимировать
• CSS Houdini
• CSS Viewport Units: Быстрый старт
JavaScript
• Очень странные дела: JavaScript
• Минифицируем приватные поля в TypeScript. Доклад Яндекса
• 10 полезных приёмов для JavaScript-программистов
• JS/ES2020: Optional Chaining and Nullish Coalescing
• Event listeners and garbage collection
• Как получить все пользовательские свойства на странице в JavaScript
• Список из 156 (продвинутых) вопросов о JavaScript, а также ответы на них
• Понимание ES-модулей в JavaScript
• Как сравнивать объекты в JavaScript
- React
• useSWR – моя новая любимая библиотека React
• Уязвимости безопасности в React, которые вы никогда не должны игнорировать
• Компоненты высшего порядка в React
• Recoil.js — новая, лучшая библиотека управления состоянием для React
• Создания генератор случайных цитат на React
• Оптимизация производительности React: часть I , часть II
• Как настроить Redux с React (2020)
• Что такое Storybook и как его использовать для создания библиотеки компонентов в React?
• Практическое руководство по интеграции Google Maps в React
• Как создать ecommerce сайт с помощью React
• 5 альтернатив React Redux в 2020 году
- Vue
• Работа с данными на границе Vue.js-приложения
• EVAN YOU: Создание Vue 3
• Почему я бросил Vue ради React?
• Создание Instagram с использованием TypeScript, Node, Express и Vue — Часть 1
• Awesome Vue 3 — курируемая подборка ресурсов, посвященных Vue 3
• Изучение Vue-Multiselect
- Angular
• Автоматические адаптивные изображения в приложениях Angular
• 10+ лучших статей для изучения Angular в 2020 году
• Пре-рендеринг в Angular 9
- Ember
• The Ember Times — Issue No. 152
• Как улучшить доступность вашего существующего приложения на Ember
- Libs & Plugins
• jsgrids — подборка JavaScript библиотек для работы с таблицами данных
• Josh.js — JS библиотека для анимации содержимого при прокрутке страницы.
• johnny-five — JavaScript фреймворк для робототехники и IoT
Браузеры
• Microsoft Edge Canary и Dev теперь позволяют использовать кастомное фоновое изображение для страницы новой вкладки
• В браузере Brave выявлена подстановка реферального кода при открытии некоторых сайтов
• В сборках Google Chrome Canary уже можно активировать функцию Live Caption для преобразования речи в текст
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort