[B! flux] y_maeyamaのブックマーク

react/fluxでpropsのバケツリレーを避ける - Qiita

reactにfluxを採用してアプリケーションを設計していると、親->子->孫コンポーネントへpropsのバケツリレーになってしまう事がありました。そもそもイケてない設計が悪いのですが、reactバケツリレーつらいという声を聞くことも多かったし、自分も辛いと思っていたところ助言をいただいて解決法が見えてきたのでまとめてみます。 propsバケツリレーまず、バケツリレーを再現してみます。 DOM構造おおまかにdiv[class="app"](親), div[class="group"](子）, div[class="it em"](孫)というツリー構造になってます。 <div class="app"> <div class="group"> <h2>1番目のグループ</h2> <p class="count">13</p> <div class="it em

y_maeyama 2015/05/30

リンク

FacebookのFluxアーキテクチャの始め方 Part 1 | POSTD

私のように、Reactを使ってより進んだことがしたいと考えたなら、おそらく Flux に注目した経験があると思います。ざっと目を通してタブを閉じ、JavaScript開発者としての自分の人生を見直したことでしょう。もしReactになじみがなければ、私の記事「React入門」を読んでみてください。 Fluxとは？ Fluxは、遠目には始めるために複雑な手順を踏まなければいけないように映ります。しかし、 GitHubにあるexample を見てみれば、これがどのように機能するのかが実に明確になってきます。簡単に言うと、Fluxは美化された出版-購読型モデルのアーキテクチャです。データはシステム内を一方向に流れ、そこから様々な利用者が必要に応じてデータを取得します。これについて考えるには、私たちの体に例えてみると簡単です。イベント – 血液血液は私たちの体内を一方向に流れています

y_maeyama 2015/04/09

リンク

ReactのTutorialをArdaで写経してみる - Qiita

※ 3/20 arda 0.13対応 Ardaって Arda Concept Today's Flux is weak at scene transitions. Arda make it simple by router and context (chunk of flux). Context has Flux features and its stack is very simple. •Dispatcher is just EventEm itter •View is just React.Component (with mixin) •Store should be covered by typesafe steps with promise 特徴が挙げられていますが、ざっくり言うとFacebookの提唱するFluxアーキテクチャーのフレームワークの1つ。Reactはこう使うのが良く

y_maeyama 2015/03/21

リンク

React.js 実戦投入への道 - Qiita

最近話題のReact.jsですが、実戦投入に当たっては結構重たい選択を迫られることになります。ざっくり言えば、テンプレートエンジンを捨ててReactしますか?それともReactあきらめますか?という選択です。本記事ではReactの基本思想とこうした選択肢が生まれてしまう背景を述べるとともに、後半では「どちらもあきらめない」という(若干シミュレーションRPGあるある感のある)第三の方策について案を提示します。 Reactの基本最初に、Reactの基本的な仕組みについてまとめておきます。 Reactは公式ドキュメントが非常に充実しているので、始める際はぜひQuick Startのドキュメントに目を通すことをお勧めします。 Getting Started Tutorial Thinking in React 後述しますが、Reactを使ってアプリケーションを作る際の設計方法についての記載が