📰 Weekly #17: новости, подкасты, отборные статьи и обучающие материалы по фронтенду

Новости

• Обзор нововведений в Chrome 105
• Анонс TypeScript 4.8
• Релиз Node 18.8.0 & 16.17.0 (LTS)
• Релиз Solid 1.5
• Релиз Capacitor 4.1
• Релиз Fiddle 0.30
• Релиз Focus Trap 7.0
• Релиз Electron Packager 16.0
• Релиз DOMPurify 2.4
• Релиз vue-advanced-chat 2.0
• Релиз Soketi 1.4
• Релиз Mineflayer 4.4
• Релиз calendar-base 2.0
• Релиз Firefox 105.0 beta

• Анонс TestCafe 2.0.0
• Анонс ReacType 13— Релиз Partytown 0.7
• Релиз NodeBB 2.5.2— Релиз Faker 7.5
• Релиз Lerna 5.5— Релиз ESLint 8.23
• Релиз Jest-Image-Snapshot 5.2
• Релиз melonJS 13.3
• Релиз peaks.js 2.0.6— Релиз github-script 6.2
• Релиз Ember Inspector 4.7
• Релиз Firefox Desktop 104.0.2 & Chrome 106 Beta

Angular

• На заметку фронтендеру, который работает с Angular: использование директивы NgOptimizedImage для реализации загрузки изображений, доступной в Angular v14.2.0.

React

• Повторный рендеринг в React: что это, когда присходит и как предотвратить.
• Обзор часто встречаемых ошибок, которые допускают React-разработчики.
  
• Пример архитектурного разделения React-приложения в соответствии с принципами чистой архитектуры
  
• Перевод руководства, посвящённого повторному рендерингу в React.
  
• Разбираемся, почему в React лучше использовать callbackrefs вместо useRef + useEffect, если вы хотите что-то сделать с элементом после его рендеринга.
  
• Руководство по созданию многократно используемых React-компонентов с использованием Bit.
  
• useMemo и useCallback в React: что делают, почему полезны и как извлечь из них максимальную пользу.
  
• Практическое руководство по разработке многократно используемых компонентов React.
  

Vue

• Vue 3 Composition API: подробное руководство и обзор преимуществ по сравнению с Options API.

Next.js

JavaScript, CSS и HTML

• Мишель Баркер, известная по блогу CSS { In Real Life }, рассказывает обо всех современных и будущих возможностях CSS на CSS Day 2022.

• Коллекция CSS-загрузчиков для вашего следующего проекта.
• История одного хакатона, на котором 6 фронтендеров и один бэкенд-разработчик написали игру за 24 часа на JavaScript + Node.js + Socket.io.
  
• Теоретические и практические аспекты работы легковесной и эффективной библиотеки для распознавания лиц, написанной на JavaScript.
  
• Подборка олдскульных эффектов курсора мыши, созданных с использованием современного JavaScript. Весь код на GitHub — можете с легкостью добавить в проект.
  
• Примеры использования популярных функций JavaScript, которые были добавлены в ECMAScript 2022 (ES13).
  
• Преобразование типов в JavaScript: полный гайд для фронтендера.
  
• Обзор функций современного CSS, или Как создавать новые решения для старых задач.
  
• Разбираемся, что из себя представляет современная архитектура веб-разработки, основанная на клиентском JavaScript, повторно используемых API и предварительно созданной разметке.
  
• 5 техник логирования с console в JavaScript. Заголовок хоть и кликбейтный, что-то полезное для себя все равно можно почерпнуть.
  
• Оказывается, товарный знак JavaScript принадлежит Oracle. Вот почему стандарт называется ECMAScript.
  
• 11 сокращений в JavaScript: наглядная иллюстрация от reactive_dude. Смотреть в Твиттере. Смотреть в Thread Reader App, если Твиттер не открывается.
  

TypeScript

• Гайд по настройке TypeScript-проекта с использованием ESLint, Prettier и VS Code.
• Dependency Injection: подробное объяснение важной концепции с примерами на Typescript.
  

NodeJS

• Разбор популярных шаблонов и инструментов Node.js, которые стоит пересмотреть:

— Dotenv
— Calling a service from a controller
— Nest.js dependency injection for all classes
— Passport.js
— Supertest
— Fastify utility decoration
— Logging from a catch clause
— Morgan logger
— NODE_ENV

• Архитектура, API, event loop и concurrency в Node.js: выжимки из новой книги Writing cross-platform shell scripts with Node.js от Dr. Axel Rauschmayer.

Разное

• Изучаем Three.js на примере реализации старого доброго тетриса.
• Обзор обновлений DevTools в Chrome 105: новость, которая заслуживает отдельный пост.
• Обзор основных алгоритмов для веб-разработчиков простыми словами.
  
• Тред о том, что такое API для фронтенд-разработчика: от теории к практике. Читать в Твиттере, Читать в Thread Reader App, если Твиттер не открывается.
  
• Deno ждут большие перемены. Узнайте результаты недавнего опроса, отзывы сообщества и дальнейшие планы развития платформы.
  
• Политика автовоспроизведения видео в браузере: что это и какие палки в колёса ждут фронтенд-разработчика.
  

• Разработка кроссбраузерного расширения: проблемы кроссбраузерности, из чего состоит расширение и чек-лист требований к расширениям в 2022 году.
• Курс, который охватывает все аспекты современной разработки PWA. Подойдёт как новичкам, так и опытным разработчикам.
  
• Вы уже поняли прелесть tailwind или сомневаетесь как и автор статьи?
  
• Подкаст «Веб-стандарты»: Chrome 105
  

• Подкаст «Веб-стандарты»: Вадим Макеев, Юля Миоцен, Никита Дубко и Алексей Симоненко обсуждают Firefox Nightly, Safari TP, браузер Arc, SVG-баги, доступность в Доке, скругление, меню, приватность, Clipboard API и export default.

Предыдущие выпуски

• 📰 Weekly #13: новости, подкасты, отборные статьи и обучающие материалы по фронтенду
• 📰 Weekly #11: новости, подкасты, отборные статьи и обучающие материалы по фронтенду
  
• 📰 Weekly #9: новости, подкасты, отборные статьи и обучающие материалы по фронтенду