Front-end Digest № 101: Google I/O 2025 без AI, CSS shape() та коротка історія JS

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

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

Веброзробка

• 10 оновлень з Google I/O 2025: CSS-каруселі, DevTools зі штучним інтелектом, Prompt API з мультимодальними можливостями та багато іншого
• Google I/O без AI
• Dialog — для модальних слів, popover — для всього іншого
• Мій запит до Google щодо доступності
• Вийшла preview версія TypeScript Native

• Інструменти
  • За кулісами: як побудували Aurel’s Grand Theater — від проєкту до реалізації
  • Unlighthouse — інструмент, схожий на Google Lighthouse, але сканує кожну сторінку
  

• Ефекти
  • За кулісами: як побудувати Aurel’s Grand Theater — від проєкту до реалізації
  • Smashing Animations Частина 3: SMIL’s Not Dead Baby, SMIL’s Not Dead

CSS

• Кращі CSS-фігури за допомогою функції shape() - частина 1: лінії та дуги
• 3 неінтуїтивні «рішення» для CSS-верстки
• Модальне вікно: анімація переміщення з... shape()
• ChatGPT і поширення застарілих і непрацюючих рішень для проблем, яких не було понад півстоліття до його запуску
• Дугоподібна форма із закругленими краями
• Створення Blob-фігур за допомогою clip-path: shape()
• Стилізація іконки для типів дати та часу в HTML
• Masonry, Item Flow та... GULP?
• CSS Boilerplate: структура CSS за замовчуванням для проєкту будь-якого розміру
• Ви можете стилізувати альтернативний текст, як і будь-який інший текст
• Вкладені списки: запитання від читача

JavaScript

• Коротка історія JavaScript
• Як метод at() у JavaScript спрощує індексування масивів
• Стан налагодження JavaScript у WebAssembly
• Як працюють правила JavaScript Lint (і чому Abstract Syntax Trees важливі)
• Next.js: що потрібно знати про вразливість middleware

• React
  • Як створювати масштабовані вебзастосунки за допомогою React JS
  • Створення багатоетапних форм у React без плутанини зі станом
  • Ollama та React: побудова агентного робочого процесу зі штучним інтелектом
  • Чому стан URL має значення: посібник з використання SearchParams в React
  • «React 19 переписав моє уявлення про фронтенд»: досвід розробника з Індії
  

• Angular
  • Google I/O: що нового в Angular
  • Кращі практики RxJS в Angular 16: як уникнути пасток підписки та оптимізувати потоки

Фронтенд-меми