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

意地でもReduxを使う

 意地でもReduxを使う

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

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

    View full-size slide

  2. 自己紹介
    @kuy (カイ) / Yuki Kodama
    株式会社ジャパンベンチャーリサーチ
    entrepedia(アントレペディア)
    Ruby on Rails, JavaScript (React + Redux)
    ● Reduxでコンポーネントを再利用する
    ● Redux Middleware in Depth
    ● ・・・など

    View full-size slide

  3. 今日、ツールバーをRedux化した
    これまで比較的大きな機能に限定していたので実験的な試み。

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  9. 使い方

    Outside: {count}



    Bootstrap starter template
    Use this document as a ...




    View full-size slide

  10. デモ1:Bootstrap

    View full-size slide

  11. デモ1:Bootstrap

    View full-size slide

  12. デモ2:Gmail

    View full-size slide

  13. デモ2:Gmail

    View full-size slide