FluxのActionとStoreをちゃんと分ける話 - pixiv inside [archive]
ピクシブ株式会社 Advent Calendar 2015、19日目の記事です。 qiita.com こんにちは、愛らしくも憎らしいJavaScriptを書いてご飯を食べている @geta6 です。業務では pixiv Sketch というサービスの開発や運営に携わっています。 pixiv Sketchでは、node.jsとReact/Fluxibleを使用してサーバーとクライアントを同じコードベースで動作させるIsomorphicな構成を採用しています。 このプロジェクトでコードレビューをしていて、チームメンバーがつまずきやすいと感じたのが『FluxにおけるActionとStoreのどちらに何を実装するべきか』という点でした。 そこで、本日は『ActionとStoreとの適切な責務の持たせ方』について話をしたいと思います。 ReactとFluxについておさらい 今年の4月にこんなスライド
![FluxのActionとStoreをちゃんと分ける話 - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/0da913cbf8a21a9b94e0b3b6024eb39bf6869768/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fg%2Fgeta6%2F20151218%2F20151218175826.png)
二槽式とはなにか
この記事は仮想DOM/Flux Advent Calendar 2015 - Qiita13日目です。 二槽式とは「Viewとロジックを切り離し、それぞれが独立して成立することを目指したアーキテクチャ」をさして呼んでいます。 （これは私が勝手に名付けてるだけなので厳密な定義はないです） このView部分を「フロントエンドフロントエンド」、ロジック部分を「フロントエンドバックエンド」と呼び、合わせて「二槽式」と呼んでいます。 もう少し具体的にいうと、「Fluxのアクション部分を切り離して、View -> postMessage(JSON) -> onmessage(()=>{}) -> Dispatcherという形式にしたもの」です。 （ここではpostMessageを使っていますが、ある程度独立性が保てるのであれば普通のfunction callでも問題ないと考えています） なにを解決した
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Reactの入門方法(個人の感想
