Upgrade to Pro — share decks privately, control downloads, hide ads and more …

意地でもReduxを使う

 意地でもReduxを使う

ある程度の規模で威力を発揮するReduxですが、Single Stateはそうでない場合でも便利に使えます。実例としてRailsを想定したBootstrapのページに埋め込んだり、Gmail用のChrome Extensionで使ったりするデモをしました。資料だと説明不足すぎるので後日記事を書きます。

70ac3e9e67226ea693e90c7eb8605cd7?s=128

Yuki Kodama

April 19, 2016
Tweet

More Decks by Yuki Kodama

Other Decks in Technology

Transcript

  1. 意地でもReduxを使う @kuy / Yuki Kodama 2016/04/19 at Meguro.es #3

  2. 自己紹介 @kuy (カイ) / Yuki Kodama 株式会社ジャパンベンチャーリサーチ entrepedia(アントレペディア) Ruby on

    Rails, JavaScript (React + Redux) • Reduxでコンポーネントを再利用する • Redux Middleware in Depth • ・・・など
  3. 今日、ツールバーをRedux化した これまで比較的大きな機能に限定していたので実験的な試み。

  4. jQueryによるメニューも残っている・・・

  5. Redux配下のレンダリングツリー的には問題ない

  6. 今後、jQueryメニューが挟まれる可能性・・・!

  7. hypha(仮)作ってみた たぶん名前変わる・・・

  8. 仕組み • ReactDOM.unstable_renderSubtreeIntoContainerを使う 以上

  9. 使い方 <Spawn to="#outside-1"> <h2>Outside: {count}</h2> </Spawn> <div class="container"> <div class="main">

    <h1>Bootstrap starter template</h1> <p class="lead">Use this document as a ...</p> </div> <div id="app"></div> <div id="outside-1"></div> </div>
  10. デモ1:Bootstrap

  11. デモ1:Bootstrap

  12. デモ2:Gmail

  13. デモ2:Gmail