Front-end Digest № 38: ШІ та доступність, палітра CSS color-mix() та хуки React

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

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

Веброзробка

• Практикуйте свої навички кодування, створюючи програму різними способами
• Тиха, повсюдна девальвація фронтенду
• Повний посібник з візуального тестування за допомогою Playwright
• INP оптимізація: ваша дорожня карта до покращення продуктивності сайту та підвищення рейтингу в Google
• ШІ і доступні фронтенд-компоненти: чи можна згенерувати нюанси?
• Ефект руху 3D-стеку при прокручуванні

CSS

• Створення палітр кольорів за допомогою функції CSS color-mix()
• Деякі варіанти використання CSS :has() в реальному світі
• Сучасні тултіпи на CSS та мовні бульбашки (частина 2)
• Меню, тости та багато іншого за допомогою API Popover, діалогового елемента, інвокерів, позиціонування якоря та @starting-style
• Модернізація адаптивної типографіки
• Вивчаємо творчі можливості CSS-фільтрів та накладання
• П’ять способів стилізації тексту за допомогою CSS, натхненні Spider-verse

JavaScript

• Чому мій код не на TypeScript
• Перетворення рядка в дату в JavaScript: як уникнути помилок
• Предиктивний текст з використанням 2 МБ JavaScript, без LLM.
• Coroutines та вебкомпоненти
• Написання чистих, багаторазових компонентів у Vue 3 (Composition API): Кращі практики
• Як використовувати tRPC у вашому проєкті на SvelteKit, якщо ви зумер-фулстек-розробник

• React
  • Розбираємося з хуками в React
  • Кінець моєї подорожі з Gatsby
  • Вивчаємо useSyncExternalStore, маловідомий хук React
  • Чи нам потрібне управління станом в React?
  • Як безпечно використовувати dangerouslySetInnerHTML в React
  • React Unforget — компілятор для React, який оптимізує компоненти та хуки для продуктивності та читабельності.
  • Чи знали ви, що можете написати власний типізований React-роутер в 500 рядків?
  • Epic Next.js 14 Tutorial: Вивчаємо Next.js, створюючи реальний проєкт: Частина 1
  • Повний посібник з вибору найкращого конструктора сайтів на React
  

• Angular
  • Покращення розміру пакета з Deferred Views в Angular
  • Output-симфонія в Angular: знайомство з Output Function
  • Архітектура мікрофронтенду з Nx та Angular