“Predictable state container” and DataBinding

Slide for potatotips #23 http://connpass.com/event/21750/

---

* Try to introduce “Explosive growth of JavaScript” into Android Java world
* Implement Droidux : rackt/redux for Android
* More at DroidKaigi 2016 !!!!!!!!!!!! (when my CFP is accepted... :p)

Transcript

1. “Predictable state container” and DataBinding Masayuki IZUMI - @izumin5210 potatotips #23
2.  > Masayuki IZUMI a.k.a. @izumin5210 > Rekimoto Lab. at the University of Tokyo > Wantedly, Inc. > Rubyist / Androider / {Java,Type}Scripter
3. Ruby JavaScript Android Design
4. How do you feel “Front-end JavaScript” ?
5. Trends of JavaScript libraries (2011.11-2015.11, worldwide)
6. Trends of JavaScript libraries (2011.11-2015.11, Japan)
7. Trends of JavaScript libraries (2011.11-2015.11, Japan) * http://blog.livedoor.jp/sasata299/archives/51966228.html
8. Trends of JavaScript libraries (2011.11-2015.11, Japan) * http://qiita.com/mizchi/items/4d25bc26def1719d52e6
9. Trends of JavaScript libraries (2011.11-2015.11, Japan) \ jQuery /
10. TodoMVC
11. TodoMVC
12. How do you feel “Front-end JavaScript” ?
13. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! /
14. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! / \ Backbone has dead ! /
15. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! / \ Backbone has dead ! / \ AngularJS has dead ! /
16. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! / \ Backbone has dead ! / \ AngularJS has dead ! / \ This is generation Flux ! /
17. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! / \ Backbone has dead ! / \ AngularJS has dead ! / \ This is generation Flux ! / \ What’s the Flux ?! Let’s Redux ! /
18. How do you feel “Front-end JavaScript” ? \ jQuery has dead ! / \ Backbone has dead ! / \ AngularJS has dead ! / \ This is generation Flux ! / \ What’s the Flux ?! Let’s Redux ! /
19. In the meantime, the latest and greatest JavaScript framework comes around every sixteen minutes. - A JS framework on every table * * http://blog.livedoor.jp/sasata299/archives/51966228.html
20. * To build user interface * To handler user interaction * To manage application states * ... Common purpose of JS and Android Java
21. * To build user interface * To handler user interaction * To manage application states * ... Common purpose of JS and Android Java Try to introduce “Exprosive grouth of JavaScript” into Android Java
22. * Focus on: - “How to handle user interaction” - “How to manage application states” In this talk...
23. * MVC (Model - View - Controller) Applicatoin architecture on Android
24. * MVC (Model - View - Controller) > Android では MVC より MVP の方がいいかもしれない
    > 実は Android では MVC の採用は結構つらいものがあります ** Applicatoin architecture on Android * http://konifar.hatenablog.com/entry/2015/04/17/010606 ** [ Android ] ‒ これからの「設計」の話をしよう http://tech.recruit-mp.co.jp/mobile/android-architecture/
25. * MVC (Model - View - Controller) > Android では MVC より MVP の方がいいかもしれない
    > 実は Android では MVC の採用は結構つらいものがあります ** * MVP (Model - View - Presenter) * The Clean Architecture Applicatoin architecture on Android * http://konifar.hatenablog.com/entry/2015/04/17/010606 ** [ Android ] ‒ これからの「設計」の話をしよう http://tech.recruit-mp.co.jp/mobile/android-architecture/
26. * MVW (Model - View - Whatever) e.g. AngularJS 1.x, Backbone.js, etc. Applicatoin architecture on JavaScript
27. * MVW (Model - View - Whatever) e.g. AngularJS 1.x, Backbone.js, etc. Facebook: “leading to a tangled weave of data flow and unpredictable results” Applicatoin architecture on JavaScript
28. * MVW (Model - View - Whatever) e.g. AngularJS 1.x, Backbone.js, etc. Facebook: leading to a tangled weave of data flow and unpredictable results * Flux - “Flux eschews MVC in favor of a unidirectional data flow” * * Redux - “a predictable state container for JavaScript apps.” ** Applicatoin architecture on JavaScript * https://facebook.github.io/flux/ ** http://redux.js.org/
29. * MVW (Model - View - Whatever) e.g. AngularJS 1.x, Backbone.js, etc. Facebook: leading to a tangled weave of data flow and unpredictable results * Flux - “Flux eschews MVC in favor of a unidirectional data flow” * * Redux - “a predictable state container for JavaScript apps.” ** Applicatoin architecture on JavaScript * https://facebook.github.io/flux/ ** http://redux.js.org/
30. Redux - rackt/redux/ https://speakerdeck.com/axross/introduction-to-redux
31. Redux - rackt/redux/ https://speakerdeck.com/axross/introduction-to-redux
32. Redux for Android Droidux http://github.com/izumin5210/Droidux
33. notify dispatch action event store
34. Sample code TodoMVC with Undo https://github.com/izumin5210/Droidux/tree/master/examples/todos-with-undo
35. Movie upload later...
36. * Try to introduce “Explosive growth of JavaScript” into our world - Android Java:D * Implement Droidux : rackt/redux for Android - Undirectional data flow - Single state tree - Bindable states to views using DataBinding - Implement redo/undo easily - Try to use Rx + DataBinding + predictable data container * More at DroidKaigi 2016 !!!!!!!!!!!! - when my CFP is accepted... Conclusion
37. “Predictable state container” and DataBinding Masayuki IZUMI - @izumin5210 potatotips #23