Front-end Digest № 11: жахливі поради для веброзробників, Oklch і сучасний CSS та атомарний дизайн у Vue

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

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

Веброзробка

• Відеозаписи та презентації виступів спікерів DOU Front-end, серпень 2023
• Представляємо Astro 3.0, перший великий вебфреймворк з підтримкою API View Transitions
• 15 жахливих порад для веброзробників
• Створіть GraphQL шлюз: Об’єднуйте, зшивайте або зливайте будь-які джерела даних
• Чому розробка електронних листів — це відстій?
• github.blog: Чому Rust — найулюбленіша мова серед розробників
• Темний режим: Як користувачі думають про нього та проблеми, яких слід уникати

• Продуктивність
  • Готуємо вебпродуктивність: Посібник шеф-кухаря з Web Vitals
  • Кастомні показники вебпродуктивності за допомогою User timing API

• Ефекти
  • Connected Grid Layout Animation
  • Створюємо гумову кнопку за допомогою HTML, CSS та SVG
  • Криві Безьє

CSS

• Практичний кейс: Перебудова верстки TechCrunch за допомогою сучасного CSS
• 10 способів приховати елементи в CSS
• Falling for Oklch: історія кохання колірних просторів, гам і CSS
• Вкладеність CSS без препроцесорів — почніть використовувати вже сьогодні
• Позиціонування якорів в CSS

JavaScript

• Mastodon: Створення інформаційного бота для персонажів Marvel за допомогою Cloudflare Workers
• Функціональне програмування на JavaScript: Глибоке занурення
• Angular vs. React vs. Vue.js: Порівняння продуктивності
• Як створити контактну форму за допомогою Supabase та Next JS

• React
  • Використання React Router v6 для приватних та публічних маршрутів з контролем доступу
  • Освоєння useReducer для комплексного управління станом
  • Припиніть порівнювати вебкомпоненти з React: Пастка бібліотекоцентричної критики
  • Розуміння того, як React обробляє стан інпутів: глибоке занурення
  • React State Management: Посібник 2023
  • Відокремлення бізнес-логіки від UI компонентів в React 18

• Vue
  • Інтеграція бібліотеки іконок у Vue застосунок
  • Доступ до даних дочірніх компонентів з батьківських компонентів
  • Представляємо атомарний дизайн у Vue.js
  • Знайомство з Nuxt 3 DevTools

• Angular
  • Освоєння Hierarchical Dependency Injection в Angular за допомогою функції inject()
  • Angular не був таким хорошим до 2023 року

Svelte
• Як використовувати Tailwind CSS з Svelte