2014/10/31 LINE Fukuoka tech MTG

1. 䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾䛸
MVVM䝟䝍䞊䞁䛻䛴䛔䛶
2014/10/31 @taketin

2. ච㈐஦㡯
䛂䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾䛃䛻⯆࿡䜢ᣢ䛳䛶㍍䛔Ẽᣢ䛱䛷ㄪ䜉
ጞ䜑䜎䛧䛯䛜䚸᝿ീ௨ୖ䛻ዟ䛜῝䛔ᴫᛕ䛷䛒䛳䛯Ⅽ䚸⌮ゎ୙༑
ศ䛺䛸䛣䜝䛜䛒䜚䜎䛩䚹䛭䛾䛯䜑䚸ბ䜢ゝ䛳䛶䜛ྍ⬟ᛶ䜒䛒䜚䜎
䛩䚹
䜎䛯䚸௒ᅇ䛿ᴫᛕ䛾ㄝ᫂䛻䛺䜚䜎䛩䛾䛷䜅䜣䜟䜚䛧䛯䛚ヰ䛻䛺䜚
䜎䛩䚹
䛒䜙䛛䛨䜑䛤஢ᢎ䛟䛰䛥䛔䚹

3. FRP (FunctionalReactiveProgramming)

4. FRP (Functional Reactive Programming)
䞉᭱㏆䜘䛟⪺䛟

5. FRP (Functional Reactive Programming)
䞉᭱㏆䜘䛟⪺䛟
䞉䝣䝻䞁䝖䜶䞁䝗㛤Ⓨ⪅䛿≉䛻▱䛳䛸䛔䛯᪉䛜Ⰻ䛥䛭
䛖

6. FRP 䛸䛿
䞉䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭䞁䜾䝟䝷䝎䜲
䝮

7. FRP 䛸䛿
䞉䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭䞁䜾䝟䝷䝎䜲
䝮
䞉㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸
䛸䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛

8. FRP 䛸䛿
䞉䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭䞁䜾䝟䝷䝎䜲
䝮
䞉㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸
䛸䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾 http://www.reactivemanifesto.org/ 䛻㛵ᩘ
ᆺゝㄒ䛾≉ᚩ䜢ຍ䛘䛯䜒䛾䛜 FRP䚹1997ᖺ䛻 䚷Functional
Reactive Animation http://conal.net/papers/icfp97/ 䛸䛧䛶ᥦၐ䛥䜜
䛯䜙䛧䛔䚹

9. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮

10. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
Ⓨ⏕䛩䜛䜲䝧䞁䝖䛻ᑐ䛧䛶ᐇ⾜䛩䜛࿨௧䜢᭩䛟䚹

11. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
Ⓨ⏕䛩䜛䜲䝧䞁䝖䛻ᑐ䛧䛶ᐇ⾜䛩䜛࿨௧䜢᭩䛟䚹
䞉FRP 䛾ୡ⏺
ධຊ䛸ฟຊ䛾㛵ಀᛶ䜢ᐃ⩏䛩䜛䚹

12. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 2

13. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 2
䞉FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 11

14. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 2
䞉FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 11
FRP䛿䛂᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್䛃䜢ᢅ䛖䚹
b = a + 1 䛾䛂㛵ಀᛶ䛃䜢ಖᣢ䛩䜛䚹

15. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 2
䞉FRP䛾ୡ⏺
var a = 1;
var b = a + 1;
a = 10;
console.log(b) // => 11
FRP䛿䛂᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್䛃䜢ᢅ䛖䚹
b = a + 1 䛾䛂㛵ಀᛶ䛃䜢ಖᣢ䛩䜛䚹
Excel 䛷 A1䝉䝹䛻 =B2+C3䛸᭩䛟䛸䚸A1䝉䝹䛾ෆᐜ䛿B2䛸C3䛜ຍ⟬䛥䜜䛶䚸ື
ⓗ䛻᭩䛝᥮䛘䜙䜜䜛䜘䛖䛺ື䛝䛾䜲䝯䞊䝆䚹

16. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
$("#select").change(function(val){
console.log(val.currentTarget.value);
});
// selectbox で値が “foo” を選択した
> foo
// selectbox で値が “bar” を選択した
> bar
䞉FRP䛾ୡ⏺
var select = $("#select").asEventStream("change");
select.onValue(function(val) {
console.log(val.currentTarget.value)
});
// selectbox で値が “foo” をチェックした
> foo
// selectbox で値が “bar” をチェックした
> bar

17. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
$("#select").change(function(val){
console.log(val.currentTarget.value);
});
䞉FRP䛾ୡ⏺
var select = $("#select").asEventStream("change");
select.onValue(function(val) {
console.log(val.currentTarget.value)
});
䛣䜜䜎䛷䛿ධຊ䛜ኚ໬䛧䛯䛸䛔䛖ฟ᮶஦䠄䜲䝧䞁䝖䠅䛻ᑐᛂ䛩䜛ฎ⌮䜢䝥䝻䜾䝷䝮䛷グ㏙䛧䛶
䛔䛯䚹
䛣䜜䛻ᑐ䛧䛶䚸䝸䜰䜽䝔䜱䝤䞉䝥䝻䜾䝷䝭䞁䜾䛷䛿䚸ධຊ䛸ฟຊ䛾㛵ಀᛶ䜢ᐃ⩏䛧䛶䛚䛡䜀⮬
ືⓗ䛻ฎ⌮䛜⾜䜟䜜䜛䚹

18. 䝸䜰䝹䝍䜲䝮䜲䝧䞁䝖䜢㐺ษ䛻ᢅ䛖䛯䜑䛾䝥䝻䜾䝷䝭
䞁䜾䝟䝷䝎䜲䝮
䞉㠀FRP䛾ୡ⏺
$("#select").change(function(val){
console.log(val.currentTarget.value);
});
䞉FRP䛾ୡ⏺
var select = $("#select").asEventStream("change");
select.onValue(function(val) {
console.log(val.currentTarget.value)
});
䜲䝧䞁䝖㥑ື䛾࿨௧ᆺ ᐃ⩏ᐉゝᆺ
䛣䜜䜎䛷䛿ධຊ䛜ኚ໬䛧䛯䛸䛔䛖ฟ᮶஦䠄䜲䝧䞁䝖䠅䛻ᑐᛂ䛩䜛ฎ⌮䜢䝥䝻䜾䝷䝮䛷グ㏙䛧䛶
䛔䛯䚹
䛣䜜䛻ᑐ䛧䛶䚸䝸䜰䜽䝔䜱䝤䞉䝥䝻䜾䝷䝭䞁䜾䛷䛿䚸ධຊ䛸ฟຊ䛾㛵ಀᛶ䜢ᐃ⩏䛧䛶䛚䛡䜀⮬
ືⓗ䛻ฎ⌮䛜⾜䜟䜜䜛䚹

19. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛

20. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉ᐃ⩏䜢ᐉゝ䛩䜛ᑐ㇟ == ᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್

21. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉ᐃ⩏䜢ᐉゝ䛩䜛ᑐ㇟ == ᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್
ex) textField : ᩥᏐ䛾ධຊ䛸ඹ䛻ෆᐜ䛜ኚ䜟䜛
button : 䜽䝸䝑䜽䛧䛶 on, off 䛜ኚ䜟䜛

22. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉ᐃ⩏䜢ᐉゝ䛩䜛ᑐ㇟ == ᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್
ex) textField : ᩥᏐ䛾ධຊ䛸ඹ䛻ෆᐜ䛜ኚ䜟䜛
button : 䜽䝸䝑䜽䛧䛶 on, off 䛜ኚ䜟䜛
FRP 䛷䛿䚸䛣䜜䜙䛾䛂᫬㛫䛸䛸䜒䛻ኚ໬䛩䜛್䛃䜢
䛂䝇䝖䝸䞊䝮䛃䛸࿧䜀䜜䜛➨1⣭䜸䝤䝆䜵䜽䝖䛸䛧䛶ᢅ䛘䜛䜘䛖䛻䛩䜛
஦䛷䚸ᐃ⩏ᐉゝᆺ䛾䝥䝻䜾䝷䝭䞁䜾䜢⾜䛘䜛ᵝ䛻䛧䛯䚹

23. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉᣺䜛⯙䛔

24. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉᣺䜛⯙䛔
ex) ධຊ್ : 1, 2, 3, 4
᣺䜛⯙䛔 : ධຊ䛥䜜䛯್䜢ಸ䛻䛩䜛 -> 2, 4, 6, 8
᣺䜛⯙䛔 : 4 䛾ಸᩘ䛰䛡㏉䛩 -> 4, 8

25. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉᣺䜛⯙䛔
ex) ධຊ್ : 1, 2, 3, 4
᣺䜛⯙䛔 : ධຊ䛥䜜䛯್䜢ಸ䛻䛩䜛 -> 2, 4, 6, 8
᣺䜛⯙䛔 : 4 䛾ಸᩘ䛰䛡㏉䛩 -> 4, 8
䛣䛾᣺䜛⯙䛔䠍䛴䠍䛴䛜䝇䝖䝸䞊䝮䛸䛧䛶ᢅ䛘䜛䚹

26. 㠀ྠᮇ䝕䞊䝍䝇䝖䝸䞊䝮䜢⏝䛔䜛䝥䝻䜾䝷䝭䞁䜾䛷䛒䜚䚸䛂᫬㛫䛸䛸
䜒䛻ኚ໬䛩䜛್䛃䛸䛂᣺䜛⯙䛔䛃ྠኈ䛾㛵ಀᛶ䜢グ㏙䛩䜛
䞉᣺䜛⯙䛔
ex) ධຊ್ : 1, 2, 3, 4
᣺䜛⯙䛔 : ධຊ䛥䜜䛯್䜢2ಸ䛻䛩䜛 -> 2, 4, 6, 8
∟ ᣺䜛⯙䛔 : 4 䛾ಸᩘ䛰䛡㏉䛩 -> 4, 8
∟ ᣺䜛⯙䛔䠖5 ௨ୖ䛰䛡㏉䛩 -> 6, 8
䛣䛾᣺䜛⯙䛔䠍䛴䠍䛴䛜䝇䝖䝸䞊䝮䛸䛧䛶ᢅ䛘䜛䚹
䝇䝖䝸䞊䝮䜢䝧䞊䝇䛻᣺䜛⯙䛔䜢㔜䛽䛶䛔䛟஦䛜䛷䛝䜛䚹

27. Reactive programming䛸䛿...
䞉᫬㛫䜔እ㒊ධຊ䛸ඹ䛻ኚ໬䛩䜛್䜔ィ⟬䜢䚸࿨௧ⓗ䛻グ㏙䛩
䜛䛾䛷䛿䛺䛟䚸ᐉゝⓗ䛻ᐃ⩏䛩䜛䚹

28. Reactive programming䛸䛿...
䞉᫬㛫䜔እ㒊ධຊ䛸ඹ䛻ኚ໬䛩䜛್䜔ィ⟬䜢䚸࿨௧ⓗ䛻グ㏙䛩
䜛䛾䛷䛿䛺䛟䚸ᐉゝⓗ䛻ᐃ⩏䛩䜛䚹
䞉ධຊ䛸ฟຊ䛾㛵ಀᛶ䜢ᐃ⩏䛧䛶䛚䛡䜀⮬ືⓗ䛻᭦᪂ฎ⌮䛜
⾜䜟䜜䜛Ⅽ䚸䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ䛾ᐇ⿦䛻㐺䛧䛶䛔䜛䚹

29. Reactive programming䛸䛿...
䞉᫬㛫䜔እ㒊ධຊ䛸ඹ䛻ኚ໬䛩䜛್䜔ィ⟬䜢䚸࿨௧ⓗ䛻グ㏙䛩
䜛䛾䛷䛿䛺䛟䚸ᐉゝⓗ䛻ᐃ⩏䛩䜛䚹
䞉ධຊ䛸ฟຊ䛾㛵ಀᛶ䜢ᐃ⩏䛧䛶䛚䛡䜀⮬ືⓗ䛻᭦᪂ฎ⌮䛜
⾜䜟䜜䜛Ⅽ䚸䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ䛾ᐇ⿦䛻㐺䛧䛶䛔䜛䚹
䞉MVVM 䝟䝍䞊䞁䛾ᐇ⿦䛻౑䜟䜜䛶䛔䜛䚹

30. MVVM (Model View ViewModel)

31. MVVM (Model View ViewModel)
䞉2005ᖺ䚸Microsoft 䛾 WPF 䜔 Silverlight Ⓨ⚈ 䛾䜰䞊䜻䝔䜽
䝏䝱 via: http://ja.wikipedia.org/wiki/Model_View_ViewModel
䞉୺䛻 GUI 䜰䝥䝸䜿䞊䝅䝵䞁䛷᥇⏝䚹

32. MVVM (Model View ViewModel)
䞉2005ᖺ䚸Microsoft 䛾 WPF 䜔 Silverlight Ⓨ⚈ 䛾䜰䞊䜻䝔䜽
䝏䝱 via: http://ja.wikipedia.org/wiki/Model_View_ViewModel
䞉୺䛻 GUI 䜰䝥䝸䜿䞊䝅䝵䞁䛷᥇⏝䚹
䞉View䛿ViewModel䛻౫Ꮡ䛧䚸ViewModel䛿Model䛻౫Ꮡ䚹㏫
᪉ྥ䛾౫Ꮡ䛿↓䛔䚹
image: http://www.atmarkit.co.jp/fdotnet/chushin/greatblogentry_02/greatblogentry_02_01.html

33. MVVM (Model View ViewModel)
䞉Model - 䝗䝯䜲䞁䠄ၥ㢟㡿ᇦ䠅
䞉View - UI䜈䛾ฟຊ䛸UI䛛䜙䛾ධຊ
䞉ViewModel - View䛸Model䛾㛫䛾᝟ሗ䛾ఏ㐩䠄View䛛䜙ཷ䛡ྲྀ䛳䛯ධຊ䜢㐺
ษ䛺ᙧ䛻ኚ᥮䛧䛶Ώ䛩䠅䛸䚸View䛾䛯䜑䛾≧ែಖᣢ䛾䜏䜢ᙺ๭䛸䛩䜛せ⣲䚹View䛸䛾
㏻ಙ䛿䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ䛾䜘䛖䛺௙⤌䜏䜢㏻䛨䛶⾜䛖䛾䛜๓ᥦ䚹

34. MVVM (Model View ViewModel)
View䛸ViewModel䛾㛫䛾᝟ሗ䜢㛤Ⓨ⪅䛜ᡭື䛷ྠᮇ䛧䛺䛡䜜䜀䛺䜙䛺䛔䜘䛖䛺䝥
䝷䝑䝖䝣䜷䞊䝮䛷䛿㠀ᖖ䛻㛤Ⓨ⪅䛾㈇ᢸ䛜኱䛝䛟䛺䜚䚸䝯䝸䝑䝖䛜Ⓨ᥹䛧䛻䛟䛔䚹
䛭䛾䛯䜑䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ䛾䜘䛖䛺௙⤌䜏䜢ᣢ䛴䝥䝷䝑䝖䝣䜷䞊䝮䛛䚸᪤Ꮡ䛾
䝥䝷䝑䝖䝣䜷䞊䝮䛻䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ䛾䜘䛖䛺௙⤌䜏䜢ᣑᙇ䛧䛯䝥䝷䝑䝖䝣䜷䞊
䝮䛷᥇⏝䛥䜜䛶䛔䜛䚹

35. MVVM (Model View ViewModel)
ᚲせ䛺䜒䛾
䞉ᐉゝⓗ䛺 View䝔䞁䝥䝺䞊䝖
䞉䝕䞊䝍䝞䜲䞁䝕䜱䞁䜾ᶵᵓ

36. MVVM (Model View ViewModel)
ReactiveCocoa (Objective-C)
䞉FRP䝟䝷䝎䜲䝮䜢᥇⏝䛧䛯ゝㄒෆDSL䚹
䞉GitHub♫䛾ே㐩䜢䝯䜲䞁䛻㛤Ⓨ䚹GitHub䛾Mac䜰䝥䝸䛷᥇⏝䛥䜜䛶䛔䜛䚹
䞉ኚ᭦䜢䝅䜾䝘䝹䛸࿧䜀䜜䜛䜸䝤䝆䜵䜽䝖䛷⾲⌧䛧䚸ู㏵⏝ព䛩䜛 VM 䛻䝥䝺䝊䞁䝔䞊
䝅䝵䞁䝻䝆䝑䜽䜢᭩䛟஦䛷䚸ViewController 䛛䜙 View 䛸䝻䝆䝑䜽䜢ศ㞳䛩䜛䚹
䚷䈜 ViewController 䛿 MVC 䛾 C 䛷䛿↓䛔䚹MVVM 䛾 V ┦ᙜ䚹

37. MVVM (Model View ViewModel)
ReactiveCocoa (Objective-C)
䝯䝸䝑䝖
䞉䝔䝇䝖䛾グ㏙䛜ᐜ᫆䛻䛺䜚䚸䝁䞊䝗䛾෌฼⏝ᛶ䛜㧗䜎䜛䚹

38. MVVM (Model View ViewModel)
ReactiveCocoa (Objective-C)
䝯䝸䝑䝖
䞉䝔䝇䝖䛾グ㏙䛜ᐜ᫆䛻䛺䜚䚸䝁䞊䝗䛾෌฼⏝ᛶ䛜㧗䜎䜛䚹
䝕䝯䝸䝑䝖
䞉グ㏙㔞䛜ቑ䛘䜛䚹
䞉DSL 䛸 FRP 䛾Ꮫ⩦䝁䝇䝖䚹

39. MVVM (Model View ViewModel)
ReactiveCocoa (Objective-C)
ḟᮇ䝯䝆䝱䞊䝞䞊䝆䝵䞁 3⣔䛷 Swift ᑐᛂ䚹
Swift ⏝䝷䜲䝤䝷䝸䛿௚䛻 https://github.com/ReactKit/ReactKit 䛜䛒䜛䚹
䛸䜚䛒䛘䛪ヨ䛧䛶䜏䛯䛔䚹

40. FRP䛻䛴䛔䛶ㄪ䜉䛶䜏䛯ឤ᝿
䞉ᐇ⿦䛻䜘䛳䛶ゝⴥ䛾ᐃ⩏䛜᭕᫕䛺Ẽ䛜䛩䜛䛾䛷䚸኱ኚΰ஘䛧䛯䚹
䝇䝖䝸䞊䝮
䝅䜾䝘䝹

41. FRP䛻䛴䛔䛶ㄪ䜉䛶䜏䛯ឤ᝿
䞉ᐇ⿦䛻䜘䛳䛶ゝⴥ䛾ᐃ⩏䛜᭕᫕䛺Ẽ䛜䛩䜛䛾䛷䚸኱ኚΰ஘䛧䛯䚹
䝇䝖䝸䞊䝮
䝅䜾䝘䝹
䞉㛵ᩘᆺゝㄒ䜈䛾㛵ᚰ䛜῝䜎䛳䛯䚹
ཧ↷㏱㐣ᛶ䠄㛵ᩘ䛾࿧䜃ฟ䛧䜢䛭䛾䜎䜎್䛻⨨䛝᥮䛘䛶䜒඲䛟ྠ䛨ືస䜢䛩䜛䚹
㛵ᩘ䛻๪స⏝䛜↓䛔≧ែ䠅

42. FRP䛻䛴䛔䛶ㄪ䜉䛶䜏䛯ឤ᝿
䞉ᐇ⿦䛻䜘䛳䛶ゝⴥ䛾ᐃ⩏䛜᭕᫕䛺Ẽ䛜䛩䜛䛾䛷䚸኱ኚΰ஘䛧䛯䚹
䝇䝖䝸䞊䝮
䝅䜾䝘䝹
䞉㛵ᩘᆺゝㄒ䜈䛾㛵ᚰ䛜῝䜎䛳䛯䚹
ཧ↷㏱㐣ᛶ䠄㛵ᩘ䛾࿧䜃ฟ䛧䜢䛭䛾䜎䜎್䛻⨨䛝᥮䛘䛶䜒඲䛟ྠ䛨ືస䜢䛩䜛䚹
㛵ᩘ䛻๪స⏝䛜↓䛔≧ែ䠅
䞉ᐇ㝿䛻䜰䝥䝸䜿䞊䝅䝵䞁᭩䛝䛺䛜䜙䛨䜓䛺䛔䛸⌮ゎ䛜㐍䜎䛺䛭䛖䚹

43. Library
FRP: Javascript
䞉https://github.com/Reactive-Extensions/RxJS
䞉https://github.com/baconjs/bacon.js
䞉https://github.com/facebook/react
MVVM: Javascript
䞉https://github.com/knockout/knockout
䞉https://github.com/jashkenas/backbone
䞉https://github.com/angular/angular.js
䞉https://github.com/ractivejs/ractive
䞉https://github.com/yyx990803/vue

44. ཧ⪃䝸䞁䜽
䞉䛆⩻ヂ䛇䛒䛺䛯䛜ồ䜑䛶䛔䛯䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾ධ㛛
http://ninjinkun.hatenablog.com/entry/introrxja
䞉䛺䛬䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾䛿㔜せ䛛䚹
http://d.hatena.ne.jp/pokarim/20101226
䞉䝇䝖䝸䞊䝮⾲⌧䛸䛭䛾ኚ᥮
http://r7kamura.hatenablog.com/entry/2014/08/21/113654
䞉FRP䛾ヰ
http://maoe.hatenadiary.jp/entry/2012/12/24/011414
䞉Web䝣䝻䞁䝖䜶䞁䝗䛷䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾
http://www.ediplex.com/blog/?p=830
䞉䜖䜛䜔䛛䛺 ReactiveCocoa 䛾ᑟධ
https://speakerdeck.com/ninjinkun/yuruyakanareactivecocoafalsedao-ru
䞉MVVM for iOS
https://speakerdeck.com/laiso/mvvm-for-ios
䞉ReactiveCocoa䛷iOS䛷䜒MVVM
http://ios.caph.jp/articles/mvvm-using-reactivecocoa
䞉AngularJS䛷ጞ䜑䜛䝸䜰䜽䝔䜱䝤䝥䝻䜾䝷䝭䞁䜾
http://zoetrope.hatenablog.jp/entry/2014/02/15/175040
䞉Bacon.js䛷═䜑䜛Functional reactive programming
http://gan.hatenablog.jp/entry/2013/11/10/152720