こんにちは、fluctの@nekoyaです。 今日は現在開発に携わっている、俗に言う「管理画面」のWebアプリケーションのアーキテクチャをご紹介します。 このアプリケーションはReactとRxJSを軸として作られており、コードはTypeScriptを使って書いています。 アプリケーションを流れるデータと状態の管理について、Write StackとRead Stackという考え方を取り入れたところ、いろいろなメリットが得られたので、そのあたりを軸に掘り下げてみます。 全体の大まかな構成 各Stackの前に、まずはアプリケーション全体の構成をざっくりと見ておきます。 流れとしては、DispatcherからWrite Stack, Read Stackを通ってStateが生成され、それをViewが受け取るという構成になっています。 全体の流れとしてはFluxっぽい何かのひとつのあり方なのですが、
![React + RxJSで始める状態管理 - CARTA TECH BLOG](https://cdn-ak-scissors.b.st-hatena.com/image/square/c95474be3906cd479db10c160134930e22f34b57/height=288;version=1;width=512/https%3A%2F%2Fgist.githubusercontent.com%2Fnekoya%2F47644d75a3d8735231bdde53f8338290%2Fraw%2Fb841998045469c60d3cbf55811bd72cfed3f45c5%2Fapplication_stack.png)