Основные строительные блоки приложения - это модули, фичи и сервисы.
Это функциональность часто используемая модулями и фичами, ничего не знает об остальном приложении. Может содержать:
- класс, инкапсулирующий какую-либо специфичную для конкретного сервиса логику. Инстанс такого класса нужно привязать к DI-контейнеру.
- редакс-логику (своя ветка в стейте, набор экшен-креэйторов, редьюсеры и, возможно, сага)
- react-контейнеры
- React Higher-Order Components (HOC), могут инкапсулировать работу с классом сервиса, прокидывать определенные пропсы в оборачиваемые контейнеры или контролировать отрисовку оборачиваемого контейнера в зависимости от состояния сервиса.
Примеры: сервис i18n содержит: редакс-логику для получения и хранения переводов, изменения текущего языка; класс, который будет отслеживать изменение языка, обновлять функцию перевода и оповещать подписчиков; HOC, который прокидывает в оборачиваемый компонент функцию перевода, и при изменении языка, вызывает forceUpdate, тем самым запуская перерисовку и прокидывая обновленную функцию перевода.
Главный архитектурный блок, в основном весь проект являет из себя набор фич. Фича - это узконаправленная функциональность, которая может быть реализована с помощью связки React+Redux, имеет свою ветку в redux-сторе. На выход фича отдает react-контейнеры с минимально возможным интерфейсом и набор функций для подключения фичи к redux-стору.
Ничего не знает о раутах, может использовать сервисы и shared-компоненты. Не может обращаться на прямую к другой фиче. Это уменьшает зацепление фич и позволяет выносить фичи в отдельные бандлы, которые будут подгружаться только тогда, когда эта фича реально нужна.
При необходимости использования react-контейнера из другой фичи, может запросить контейнер определенной сигнатуры в пропсах и получить его от клиента или с помощью HOC'а ContainersProvider (ContainersProvider асинхронно подгружает бандл нужной фичи, подключает ее к redux-стору и прокидывает нужные контейнеры в оборачиваемый контейнер).
Вам нужно выделить отдельную фичу, если:
- эта функциональность используется в нескольких местах (модулях);
- функционал можно однозначно классифицировать (например, авторизация, загрузка новостей);
- не имеется раутов и не нужно плотное с ними взаимодействие в процессе работы.
Примеры: фича поиск продуктов содержит: редакс-логику по загрузке, хранению, фильтрации и пагинации списка продуктов; контейнер поисковая строка, контейнер с управлением пагинацией. Клиент может получить результаты поиска, например, с помощью коллбека onLoad контейнера поисковой строки.
Описание принципов работы с фичами
Модуль связывет фичи, расширяет их функциональность и распределяет по раутам. Может содержать редакс-логику и react-контейнеры. Обязан предоставить корневой раут, внутри которого возможно будет реализовано дерево раутов модуля, и который будет отрисован в пустом div-контейнере.
Вам нужно выделить модуль, если:
- будет раутинг, на каждом адресе которого независимый и разнородный функционал, который можно выделить в самостоятельную часть программы;
- Функционал действительно разнороден и обширнее, чем просто загрузка пользователя и показ его данных;
Примеры: модуль Профиль - содержит фичи: редактирование личной информации, просмотр личной информции, настройки уведомлений, просмотр сообщений.