Придерживался компонентного подхода в соответствии с принципами React. Архитектура строилась по принципу "smart/dumb" компонентов.

Smart-компоненты (контейнеры): Отвечают за логику, получение данных, управление состоянием. Не имеют своего UI. Передают данные и колбэки dumb-компонентам.
Dumb-компоненты (презентационные): Отвечают только за отображение UI. Не имеют собственной логики и состояния (за исключением локального состояния для управления отображением). Получают данные и колбэки через props.

Этот подход promotes:

Переиспользование: Presentation-компоненты легко переиспользуются в разных частях приложения.
Тестируемость: Логика отделена от UI, что упрощает тестирование smart-компонентов. Presentation-компоненты тестируются отдельно, focuseed only on their visual output based on props.
Разделение ответственности: Четкое разделение логики и представления.

Для управления состоянием использовал Redux (с Redux Toolkit), для маршрутизации — React Router. Взаимодействие с API реализовывалось через async/await с использованием Axios.

Структура проекта была организована по фичам (папка для каждого логически связанного модуля функциональности), внутри которых располагались соответствующие компоненты (умные и глупые), редюсеры (если использовался Redux), экшены и т.д. Общие компоненты (например, кнопки, инпуты) выносились в отдельную папку components/common. Утилиты располагались в utils. Хуки - в hooks.

// Пример структуры папок
src/
├── components/
│   ├── common/        // Общие компоненты
│   └── featureA/      // Компоненты для фичи A (dumb/smart)
├── pages/             // Компоненты для маршрутов
├── redux/             // Redux store, reducers, actions
│   ├── slices/
│   └── store.js
├── hooks/             // Пользовательские хуки
├── utils/             // Утилиты
└── App.js             // Корневой компонент

Какой подход вы использовали при построении архитектуры вашего проекта?