Front-end Digest № 51: простота htmx, проміси в JS та корисні техніки CSS

Усі статті, обговорення, новини про Front-end — в одному місці. Підписуйтеся на телеграм-канал!

Привіт, колеги. Мене звати Олександр і я займаюся фронтендом в компанії Zfort Group. Маю для вас свіжий дайджест із цікавими матеріалами зі світу фронтенда за останній тиждень.

Веброзробка

• htmx: простота в епоху складних рішень
• Посібник з API Web Push
• Наскільки глибокий ваш DOM?
• Робота з Speculation Rules API в консолі
• За межами чат-ботів: як штучний інтелект може змінити фронтенд-розробку
• TanStack представив новий мета-фреймворк на базі свого роутера
• 3 нові функції для налаштування налагодженння продуктивності в DevTools
• Чому в WCAG немає рекомендацій щодо мобільної доступності?
• Живі демонстрації автономних вебкомпонентів
• Анімація натискання на елементи сітки

CSS

• Cap Unit: Погляд на те, як я розв’язав проблему дизайну за допомогою CSS cap
• Одиниці довжини в CSS
• Кастомний повзунок діапазону з анімацією на CSS
• Кастомні маски для верхньої та нижньої частин CSS-контейнерів
• Корисні поради та техніки CSS
• Налаштування текстових інпутів
• Let’s hang! Вступ до CSS Anchor Positioning з основними прикладами

JavaScript

• Пояснення ключового слова this в JavaScript з прикладами
• Проміси з нуля
• Керуйте JavaScript-промісами з будь-якого місця за допомогою Promise.withResolvers()
• Тестування типів у TypeScript
• Як писати API Response Types за допомогою TypeScript
• Merge anything — об’єднуйте об’єкти та інші типи рекурсивно

• React
  • Як створити компонент рейтингу за допомогою React Compound Component Pattern
  • Як створити класичну гру-змійку за допомогою React.js
  • Як створити систему сповіщень в Next.js за допомогою Knock
  • Переваги використання RTK Query: Масштабоване та ефективне рішення
  • Найкращий безкоштовний SaaS-шаблон з відкритим кодом для React та NodeJS
  

• Vue
  • Оптимізація рендерингу у Vue
  • Створіть Fullstack-застосунок за допомогою Vue and Go (і Tailwindcss v4)
  • Розплутування History модів у Vue Router
  • Як зробити міграцію застосунку Vue 3 на Nuxt 3
  

• Angular
  • Signals проти ngOnChanges для кращого управління станом в Angular
  • Архітектура Angular: Частина 3 — Легкий мокінг даних
  • Темізація Angular Material за допомогою CSS-змінних