search

SunriseDigital / ReactTest

0 stars 0 forks source link

Fluxについて #1

Open gomo opened 8 years ago

gomo commented 8 years ago

概要

Reactについてはなんとなくわかってきたが、Component同士は通信出来ないため、どうやってイベントやデータのやり取りをするのか不明だった。

チュートリアルではこんな感じにに子Componentにイベントを登録して行っているが、これだと孫コンポーネントや曾孫など、複雑になった時破綻しそうである。

で・・・どうしてるのかと思って色々みていたらFulxというキーワードに行き着いた。

URL

gomo commented 8 years ago

公式のチュートリアルは開始するのにブラウザーリファイを使わないとダメそうだったので、なれたgulpのチュートリアルを発見。少し触ってみた。

http://ryanclark.me/getting-started-with-flux/ （ただし、ブログの内容に2箇所ほどミスが有り、そのままでは動かないので注意）

ストアの実装までやってみたが、時間かかりそうなので、ミーティングもあるので一旦休憩。

gomo commented 8 years ago

http://ryanclark.me/getting-started-with-flux/

これもわかりやすいが

http://azu.github.io/slide/react-meetup/flux.html

こっちの方がもっと簡素な実装でわかりやすい。

gomo commented 8 years ago

http://www.infoq.com/jp/news/2014/05/facebook-mvc-flux

Facebook技術マネージャーのFluxに関する発言の日本語版。多分読んでもイマイチわからないと思うが、ちょっと使った後に読むとスルッと入ってきます。一通り使ってみた人は読むと良いです。

重要なことは他のアクションが発火する以前に、データ層が自身が関係して いるビューの更新を完了させることである、と Chen氏は述べている。 Dispatcher は、直前のアクションの処理が未完了の間は、 次のアクションの処理を拒否することもできる。この設計方式は、他のビュー もいっしょに更新するといった副作用をもったアクションに対して特に有用で あり、コードはより明確で理解するのが容易になり、新米の開発者でもデバッ グが簡単にできるようになる。

Facebook製のFluxDispacherは他のアクションがイベントをディスパッチ中に別のイベントをディスパッチするとエラーになる。

なんか、それが堅苦しいな〜と思ったけど、納得した。

gomo commented 8 years ago

Ajaxはどこで？

Ajaxなどサーバーと通信をしてデータを取ってくるコードはどこに書くのが良いのか？という話です。

https://github.com/facebook/flux/issues/127 https://github.com/facebook/flux/issues/122

この辺で議論されているがアクションに書いて、レスポンスを受け取った後ディスパッチャーに渡すパターンをよく見かける。

ちょっと記事を見失ったのでリンクは貼れないが、ポーリングして定期的にデータを取りに行くサンプルでStoreにAjaxを書いてるのもあった。確かにポーリングはアクションではないのでStoreに置くのは理にかなってる気がする。

gomo commented 8 years ago

指針

あくまで今のところだけど、こういう流れで作っていけば良いというのが固まってきたの箇条書きで挙げてみる。

gomo commented 8 years ago

actionsは一つでOK？

Constantsのイベントタイプ名がそのアプリケーション内でグローバルなら、アクションクラスも一つでOKなんじゃないか？と思ったりもします。

例えば、そのアプリケーションを初期化するINITというイベントタイプがあったとします。このイベントは幾つかのコンポーネントでリッスンしています。

さて、このINITをDispatchするアクションはどのコンポーネントのアクションにおけばいいでしょうか？というのが悩ましい問題。ただ、アクションは分ける方向で心が決まりました。理由は下記の通り。

gomo commented 8 years ago

Validatorはどこで？

入力をチェックして、問題があった場合、エラーを画面に表示するシチュエーションはいっぱいあると思います。それをどこでするのがいいのかって話です。

という感じで考えていくと、アクション上で行うのがいいのでは無いだろうか。ポーリング系Ajaxはストアで行いますが、ポーリング系は一度始まってしまえば、ユーザーの入力に対して行う様なものでは無いので送信前にバリデートをする必要な無いとおもいます。

とりあえず、この方針でやってみます。