Platform
    • FSD Layers
    • Import Boundaries
    • Entity Structure
    • Widget Structure
    • Project Structure
    • Shared Patterns
Projects
  • API Connections & Tools
  1. Documentation
  2. Architecture (FSD)

Правила Feature-Sliced Design

Установление строгой иерархии слоев и границ зависимостей для обеспечения горизонтальной и вертикальной развязки.

01Ментальная иерархия

app
Можно использовать ↓
pages
Можно использовать ↓
widgets
Можно использовать ↓
features
Можно использовать ↓
entities
Можно использовать ↓
shared
Фундамент

02Границы зависимостей

entities
имеет доступ к:
shared
features
имеет доступ к:
entities
shared
features
widgets
имеет доступ к:
features
entities
shared
pages
имеет доступ к:
widgets
features
entities
shared
app
имеет доступ к:
pages
widgets
features
entities
shared

03Стандартная структура Entity

Каждая сущность (entity) — это самодостаточный модуль. Мы используем строгое разделение по подпапкам для предсказуемости и простоты поддержки.

  • api: RTK Query определения для работы с бэкендом.
  • types: Разделение на интерфейсы и типы для чистоты кода.
  • converters: Слой трансформации данных (Data Mapping).
  • handlers: Логика, не привязанная к UI-состоянию.
  • mock: Возможность работы без бэкенда.
  • index.ts: Точка входа для доступа из верхних слоев.

04Widget: Разделение Model и UI

Виджеты — это "умные" блоки. Мы отделяем логику (model) от визуальной части (ui), чтобы упростить тестирование и рефакторинг.

Почему это важно: Папка model/ содержит всё то, что делает виджет функциональным (схемы Zod, конфиги форм, локальные типы). Папка ui/ содержит только компоненты отображения.

05Практические примеры

✅ Корректно
src/features/auth/ui/login-form.tsx
1import { useAuthStore } from "@/entities/session"; // OK: feature -> entity 2import { Button } from "@/shared/ui"; // OK: feature -> shared
❌ Нарушение
src/entities/user/model/user.ts
1import { logoutFeature } from "@/features/auth"; // ERROR: entity -> feature (LAYER VIOLATION)

06Глобальные настройки

no-cross-layer-imports
Соблюдается
enforce-directory-structure
Соблюдается
no-private-imports
Соблюдается
enforce-barrel-exports
Соблюдается