Вопросы React Frontend Developer

Atomic CSS и Utility-First CSS — это подходы к написанию стилей, где каждое правило представляет собой отдельное CSS-свойство или утилиту. Например, в Utility-First CSS используются классы, которые определяют конкретные стили, такие как отступы или цвета, что позволяет быстро создавать интерфейсы.

Atomic Design — это методология дизайна, которая делит интерфейс на иерархические уровни: атомы (кнопка, инпут), молекулы (поисковая строка = инпут + кнопка), организмы (шапка сайта), шаблоны и страницы. FSD (Feature-Sliced Design) — это архитектурная методология для frontend-проектов, которая фокусируется на организации папок по бизнес-логике: она делит код на слои (app, pages, features, entities, shared). Ключевое отличие: Atomic Design — это про компоненты, а FSD — про всю структуру проекта, включая логику, состояния и API.

Атомы — это минимальные независимые единицы состояния. Каждый атом хранит небольшой кусок данных и обновляется отдельно. Компоненты подписываются только на нужные атомы. Это уменьшает количество лишних ререндеров и упрощает масштабирование состояния.