Как лучше спроектировать react приложение?

Question

[Сергей Сунцев]

Делаю SPA, после выполненного прототипа, настало время делать само приложение. Возникала проблема с дублированием кода.
Для начала обернул все запросы к api в класс и вызываю теперь их.
В каждом компоненте приходится дублировать этот класс.
Можно как то создать доп. модуль с этим классом и просто импортировать его в остальные компоненты.

Может ли кто-то подсказать как это лучше сделать, или подсказать мануалы, где это расписано?

Буду рад, если направите меня в нужное русло

Answer 1

[Константин Китманов]

Flux/Redux/MobX не рассматривали? С этими вещами гораздо веселее жить в реакте (хотя, конечно, порог обучения присутствует).

В принципе, то, что вы ищете, называется паттерн Dependency Injection. Можете поискать какую-то реализацию для React, но, в общем-то, react-redux именно это и делает.

Comments

[Сергей Сунцев]

Рассматривал, но в данном случае считаю это дело избыточным, хотя если подскажете конкретное решение данной проблемы с помощью того же Redux, то буду рад.

[Константин Китманов]

Сергей Сунцев: как по мне, любое приложение крупнее чем из двух компонентов на реакте, без библиотеки управления состоянием — кровь, пот и слезы:)
А решение такое (c Redux), у вас будут action'ы, которые ходят на сервер за данными. Эти экшены передаются в компонент с помощью react-redux, так что в компоненте вы просто пишете: this.props.fetchCurrentUser(). MobX, к сожалению, я совсем не знаю.

В принципе, то, что вы ищете, называется Dependency Injection — это такой паттерн, когда в класс/компонент зависимости передаются извне в автоматическом режиме. В ангуляре есть из коробки (некрасивый, но рабочий). Можете поискать какую-то реализацию для React, но в общем-то react-redux это и делает.

[Сергей Сунцев]

Константин Китманов: Спасибо буду изучать)