Next Generation Web Application Architecture

Ruby Sapporo Night vol.14

Transcript

1. ͠·ͩ
   ͜͏͡ SHIMADA Koji ೔ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture. 2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌୅ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 2012೥2݄23೔໦༵೔
2. l ͸Δ͔ͳ൴ํͷੲɺ͋Δ৔ॴͰɺԿ΋ͳ͘ແەঢ়ଶͷۭؒ Λඬ͍ͬͯͨɺͰͨΒΊʹू·ͬͨݪࢠͷখ͞ͳू߹ʹɺͦ Ε͸ਂࠁͳ֎ইΛ༩͑ͨɻͦͯ͠ɺҟৗͳɺͱͯ΋͋Γͦ͏ ΋ͳ͍ύλʔϯͰݪࢠͨͪΛ཭Εͳ͍Α͏ʹ݁ͼ͚ͭͯ͠ ·ͬͨɻ͜ͷΑ͏ͳύλʔϯ͸ࣗ෼ࣗ਎Λίϐʔ͢Δͱ͍͏ ͜ͱΛૣ͍͏ͪʹ֮͑ͯ͠·͍ ͜Ε͸ύλʔϯ͕ඇຌͳ΋ͷ Ͱ͋Δ͜ͱͷҰ໘Λ͍ࣔͯ͠Δ
   ɺύλʔϯ͕ඬ͏͢΂ͯͷ ࿭੕Ͱɺմঢ়ͷࡂ೉͕Ҿ͖ى͜͞Εଓ͚ͨɻ͜ͷΑ͏ʹͯ͠ Ӊ஦ʹੜ໋͕஀ੜͨ͠ͷͰ͋Δɻ ʰۜՏώονϋΠΫɾΨΠυʱ 2012೥2݄23೔໦༵೔
3. ͠·ͩ
   ͜͏͡ ౡా
   ߒೋ Photo by tmaeda 2012೥2݄23೔໦༵೔
4. ೔ຊ3VCZͷձ 2012೥2݄23೔໦༵೔
5. Ұൠࣾஂ๏ਓ-0$"- 2012೥2݄23೔໦༵೔
6. 2012೥2݄23೔໦༵೔
7. 2012೥2݄23೔໦༵೔
8. 2012೥2݄23೔໦༵೔
9. 2012೥2݄23೔໦༵೔
10. 2012೥2݄23೔໦༵೔
11. 2012೥2݄23೔໦༵೔
12. ΑΖ͘͠ ͓ئ͍͠·͢ 2012೥2݄23೔໦༵೔
13. ͠·ͩ
    ͜͏͡ SHIMADA Koji ೔ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture. 2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌୅ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 2012೥2݄23೔໦༵೔
14. ͓඼ॻ͖ ✓ ΫϥΠΞϯτ.7$ͬͯԿͩΖ͏ ✓ ΋͏͍ͪͲ.7$ ✓ .7$ܥͷύλʔϯͷܥේʹ͍ͭͯ ✓ ΋͏͍ͪͲΫϥΠΞϯτ.7$ 2012೥2݄23೔໦༵೔
15. 2012೥2݄23೔໦༵೔
16. Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface. 2012೥2݄23೔໦༵೔
17. Demo https://github.com/snoozer05/backbone-tiny-example 2012೥2݄23೔໦༵೔
18. ΫϥΠΞϯτ.7$ 2012೥2݄23೔໦༵೔
19. .BSUJO
    'PXMFS
    TBJE photo by pragdave 2012೥2݄23೔໦༵೔
20. l .7$͸͞·͟·ͳղऍΛ͞Εͯ͠·ͬ ͍ͯΔʹ΋ؔΘΒͣɺͦΕΒશ͕ͯ
    b.7$`ͱ͍͏໊લͰهड़͞Ε͍ͯΔɻ ΋ͦ͠ΕͰࠞཚ͠ͳ͍Α͏ͳΒɺ͋ͳ ͨ΋఻ݴήʔϜʹΑΔ.7$ͷޡղͷ٘ ਜ਼ऀͷՄೳੑ͕͋Δɻ http://martinfowler.com/eaaDev/uiArchs.html 2012೥2݄23೔໦༵೔
21. ݱࡏͷ8FCΞϓϦέʔγϣϯ ։ൃͰΑࣖ͘ʹ͢Δ.7$ http://www.flickr.com/photos/indigoskies/6523275513/ 2012೥2݄23೔໦༵೔
22. http://www.flickr.com/photos/indigoskies/6523275513/ .7$
    .PEFM
     l౰࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛ౰ͯ͸Ίͨ΋ͷ 2012೥2݄23೔໦༵೔
23. .7$ͷΦϦδφϧ Ͱ͸ͳ͍ 2012೥2݄23೔໦༵೔
24. ΋͏͍ͪͲ.7$ 2012೥2݄23೔໦༵೔
25. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai ╙30࿁Smalltalkീᒝળ 䉅䈉䈇䈤䈬MVC 2011ᐕ3᦬30ᣣ 㒙ㇱ๺ᐢ 2012೥2݄23೔໦༵೔
26. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai MVC • Model-View-Controller • XEROX PARC LRG䈱Trygve Mikkjel Heyerdahl Reenskaug䈮䉋䈦䈩1978-1979䈮ឭ᩺ – MODELS - VIEWS – CONTROLLERS • http://d.hatena.ne.jp/digitalsoul/20100913/1284330448 – DynaBookⷐ᳞઀᭽䈱৻ㇱ • 䊝䊂䊦䈲⍮⼂䈱⴫⽎ • 䊎䊠䊷䈲䊝䊂䊦䈱䋨ⷞⷡ⊛䈭䋩⴫⽎ • 䉮䊮䊃䊨䊷䊤䈲䊡䊷䉱䈫䉲䉴䊁䊛䈫䉕⚌䈨䈔䉎䉅䈱 2012೥2݄23೔໦༵೔
27. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai ૶䉒䈭䈇䈫៊䉕䈜䉎Model-View- Controller • 㕍ᧁᷕ䈘䉖 • 1987ᐕ㗃 • ን჻䉷䊨䉾䉪䉴ᖱႎ䉲䉴䊁䊛(FXIS)䈱␠ౝᢥ ᦠ • ዋ䈭䈒䈫䉅3䊋䊷䉳䊢䊮䈅䉎 • ⑳䈲౉␠䈚䈢1988ᐕ䈮OJT䉕ฃ䈔䈢 2012೥2݄23೔໦༵೔
28. http://www.jac-net.com/~tarzan/smalltalkers/mvc/mvc.html 2012೥2݄23೔໦༵೔
29. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai ૶䉒䈭䈇䈫៊䉕䈜䉎Model-View- Controller • MVC䈫䈲 – Smalltalk䉲䉴䊁䊛ో૕䉕⽾䈇䈩䈇䉎⸳⸘ᜰ㊎ – ήℂ䈮ᓥ䈉ᔅⷐ䈲䈭䈇䈏䇮䈖䉏䉕೑↪䈚䈭䈇䈫៊䉕䈜䉎 • 䊝䊂䊦䈲䇮↹㕙䈮⴫␜䈚䈢䈇䉥䊑䉳䉢䉪䊃䈠䈱䉅䈱 • 䊎䊠䊷䈲䇮䊝䊂䊦䉕䇸䈇䈧䇮䈬䈖䈮䇮䈬䈱૏䈱ᄢ䈐䈘 䈪䇮䈬䈱䉋䈉䈮⴫␜䈘䉏䉎䈱䈎䇹䉕⍮䈦䈩䈇䉎 • 䉮䊮䊃䊨䊷䊤䈲䇮䊝䊂䊦䉇䊎䊠䊷䉕ᠲ૞䈜䉎䈢䉄䈱 䊡䊷䉱䈎䉌䈱ⷐ᳞䉕ฃ䈔ઃ䈔䇮ో૕䉕೙ᓮ䈜䉎 2012೥2݄23೔໦༵೔
30. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 2012೥2݄23೔໦༵೔
31. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai MVC䈱ಽ㘃 • 䉮䊮䊃䊨䊷䊤䈏㗎ᒛ䉎MVC • ଐሽᕈ䉕೑↪䈜䉎MVC • 䊒䊤䉧䊑䊦䉕೑↪䈜䉎MVC 2012೥2݄23೔໦༵೔
32. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䉮䊮䊃䊨䊷䊤䈏㗎ᒛ䉎MVC • 䊝䊂䊦䈏න⚐䈠䈱䉅䈱䈪䇮䊎䊠䊷䈲⴫␜䈜䉎䈣䈔䇮 䈭䉖䈪䉅䈎䉖䈪䉅䉮䊮䊃䊨䊷䊤䈏䈵䈫䉍䈪㗎ᒛ䉎 • 䊝䊂䊦䈲䇮䊂䊷䉺▤ℂ䈣䈔䉕ኾ㐷䈮ⴕ䈉䉥䊑䉳䉢䉪䊃 䈪䈅䉎䈲䈝䈭䈱䈮䇮䉮䊮䊃䊨䊷䊤䈮ᡰ㈩䈘䉏䉎䊂䊷䉺 䈮ᚑ䉍ਅ䈏䈦䈩䈇䉎 • 䊝䊂䊦䈱ᖱႎ㓝⭁䈏⎕䉌䉏䉎 • 䊝䊂䊦䈫䊎䊠䊷䈏ኒធ䈮㑐ଥ䈚䈩䈇䉎 • ᄌᦝ䉇᜛ᒛ䈮ᒙ䈇 • 䊝䊂䊦䉕ⶄᢙ䈱䊎䊠䊷䈎䉌䉂䉌䉏䈭䈇 2012೥2݄23೔໦༵೔
33. ଐሽᕈ䉕೑↪䈜䉎MVC • 䈵䈫䈧䈱䊝䊂䊦䉕ⶄᢙ䈱䊎䊠䊷䈎䉌ⷰ䉎䈖䈫䈮ኻᔕ • ଐሽᕈ䈱ዉ౉ – 䊝䊂䊦䈏ᄌൻ䈜䉎䈫䇮䊝䊂䊦䈲⥄ಽ䈮䇸changed:䇹䈱䊜䉾 䉶䊷䉳䉕ㅍ䉎 – 䈜䉎䈫䊝䊂䊦䉕ⷰ䈩䈇䉎䈜䈼䈩䈱䊎䊠䊷䈮䇸update:䇹䈫䈇 䈉䊜䉾䉶䊷䉳䈏ㅍା䈘䉏䉎 – 䊑䊨䊷䊄䉨䊞䉴䊁䉞䊮䉫ᯏ᭴ – ଐሽᕈㄉᦠ䈱䉨䊷䈮䊝䊂䊦䇮୯䈮䊎䊠䊷䈱㓸ว • 䊝䊂䊦䈱ᖱႎ㓝⭁䈏⏕┙ • 䉮䊮䊃䊨䊷䊤䈲䉁䈣䊜䊆䊠䊷䉕ᜬ䈦䈩䈇䉎 http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 2012೥2݄23೔໦༵೔
34. http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䊒䊤䉧䊑䊦䉕೑↪䈜䉎MVC • 䊎䊠䊷䈫䉮䊮䊃䊨䊷䊤䈱䊕䉝(VC)䈲䇮䊝䊂䊦䈎 䉌⁛┙ • M䉕VC䈮Ꮕ䈚ㄟ䉖䈪૶䈉 – 䊎䊠䊷䈱Ꮕ䈚ㄟ䉂(䊒䊤䉫䉟䊮䊜䉾䉶䊷䉳)䈲䊝䊂䊦 䈫䉶䊧䉪䉺(䊜䉸䉾䊄ฬ)䉕ᒁᢙ䈮ᜬ䈧 • on:aspect:menu: • 䊎䊠䊷䈲䊝䊂䊦䈏⥄り䈱ᖱႎ䉕ෳᾖ䈜䉎䉶䊧䉪䉺䈣䈔 䉕⍮䈦䈩䈇䉎 • 䊎䊠䊷䈲䊝䊂䊦䈏⥄り䈱䊜䊆䊠䊷䉕ෳᾖ䈜䉎䉶䊧䉪䉺 䈣䈔䉕⍮䈦䈩䈇䉎 2012೥2݄23೔໦༵೔
35. .BSUJO
    'PXMFS
    TBJE photo by pragdave 2012೥2݄23೔໦༵೔
36. l ཰௚ʹݴͬͯɺݹయతͳ.7$͸ ࠓͷϦονΫϥΠΞϯτʹରͯ͠͸ ͋·Γ༻Λͳ͠·ͤΜɻ http://martinfowler.com/eaaDev/uiArchs.html 2012೥2݄23೔໦༵೔
37. ର࿩ܕγεςϜͷ.7$ܥ ΞʔΩςΫνϟͷܥේ 2012೥2݄23೔໦༵೔
38. .7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ .77. ✓ .71 2012೥2݄23೔໦༵೔
39. .7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ .77. ✓ .71 2012೥2݄23೔໦༵೔
40. 1SFTFOUBUJPO
    .PEFM ✓ υϝΠϯϩδοΫͱϓϨθϯςʔ γϣϯϩδοΫΛϞσϧͷ૚Ͱ෼཭ ✓ 7JFX
    ͸
    .PEFM
    ͷखલʹஔ͔Ε ͨ
    1SFTFOUBUJPO
    .PEFM
    Λ؂ ࢹ͢Δ 2012೥2݄23೔໦༵೔
41. 1SFTFOUBUJPO
    .PEFM View Model Controller Presentation Model ؂ࢹ 2012೥2݄23೔໦༵೔
42. ݹయతͳ.7$͕ ͍࣋ͬͯͨ໰୊Λ ղܾ͠Α͏ͱͨ͠΋ͷ 2012೥2݄23೔໦༵೔
43. ݹయతͳ.7$͕͍࣋ͬͯͨ໰୊ ✓ γεςϜʹଘࡏ͢ΔϩδοΫ͸ ϏδωεϩδοΫ͚ͩ͡Όͳ͍ ✓ ϓϨθϯςʔγϣϯϩδοΫͷ ஔ͖৔͕໰୊ ✓ .7$
    Ͱ͸
    7JFX
    ͔
    .PEFM
    ʹ͓͔͘͠ແ͍ 2012೥2݄23೔໦༵೔
44. 1SFTFOUBUJPO
    .PEFM View Model Controller Presentation Model ؂ࢹ 2012೥2݄23೔໦༵೔
45. 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ 7JTVBM
    8PSLT
    ͰͷΞϓϩʔν ✓ .PEFM7JFX
    7JFX.PEFM ✓ 81'
    ͰͷΞϓϩʔν 2012೥2݄23೔໦༵೔
46. .7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ .77. ✓ .71 2012೥2݄23೔໦༵೔
47. .PEFM
    7JFX
    1SFTFOUFS ✓ ೖྗ੍ޚ͸04͞Μ͕΍ͬͯ͘ΕΔ ͷͰίϯτϩʔϥ͞Μ͕ୀ৔ ✓ ௚઀
    7JFX
    ଆΛૢ࡞͍ͨ͠ϓϨθ ϯςʔγϣϯϩδοΫ΋͋ͬͨ ✓ ϩδοΫΛ࣋ͭଆͰ௚઀͍͡ΕΔ ਓ͕ඞཁ 2012೥2݄23೔໦༵೔
48. .PEFM
    7JFX
    1SFTFOUFS View (V/C) Model Presenter ؂ࢹ ૢ࡞΋Մ 2012೥2݄23೔໦༵೔
49. ϙΠϯτ 2012೥2݄23೔໦༵೔
50. $POUSPMMFS
    ͱ 1SFTFOUFS
    ͸ ੜཱ͍ͪͷҟͳΔ΋ͷ 2012೥2݄23೔໦༵೔
51. ੔ཧ 2012೥2݄23೔໦༵೔
52. .7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ .77. ✓ .71 2012೥2݄23೔໦༵೔
53. υϝΠϯϩδοΫҎ֎ͷϩδοΫ ΛͲ͜ʹஔ͍ͯɺͦΕͱଞͷίϯ ϙʔωϯτΛͲ͏͏·͘ڠௐͤ͞ Δ͔ͷ࣮ફͷྺ࢙ .7$ܥΞʔΩςΫνϟύλʔϯ 2012೥2݄23೔໦༵೔
54. ࠷ۙͷ
    +BWB4DSJQU
    ϥΠϒϥϦ ✓ #BDLCPOFKT ✓ ,OPDLPVUKT ✓ +BWB4DSJQU.7$ ✓ #BUNBOKT 2012೥2݄23೔໦༵೔
55. 3BJMT
    ͷੈքͰ΋ ✓ $FMMT ✓ %SBQFS ✓  2012೥2݄23೔໦༵೔
56. 8FC
    ΞϓϦέʔγϣϯͷ ੈքʹ΋ɺϦονΫϥΠΞ ϯτͱେن໛ԽʹΑͬͯϓ ϨθϯςʔγϣϯϩδοΫ ໰୊ͱͷઓ͍͕ຊ֨Խͭ͠ ͭ͋Δ 2012೥2݄23೔໦༵೔
57. .BSUJO
    'PXMFS
    TBJE photo by pragdave 2012೥2݄23೔໦༵೔
58. l .7$͸͞·͟·ͳղऍΛ͞Εͯ͠·ͬ ͍ͯΔʹ΋ؔΘΒͣɺͦΕΒશ͕ͯ
    b.7$bͱ͍͏໊લͰهड़͞Ε͍ͯΔɻ ΋ͦ͠ΕͰࠞཚ͠ͳ͍Α͏ͳΒɺ͋ͳ ͨ΋఻ݴήʔϜʹΑΔ.7$ͷޡղͷ٘ ਜ਼ऀͷՄೳੑ͕͋Δɻ http://martinfowler.com/eaaDev/uiArchs.html 2012೥2݄23೔໦༵೔
59. ΫϥΠΞϯτ.7$ 2012೥2݄23೔໦༵೔
60. http://www.flickr.com/photos/indigoskies/6523275513/ .7$
    .PEFM
     l౰࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛ౰ͯ͸Ίͨ΋ͷ 2012೥2݄23೔໦༵೔
61. http://www.flickr.com/photos/indigoskies/6523275513/ .7$
    .PEFM
     l౰࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛ౰ͯ͸Ίͨ΋ͷ Ͱ͸ͳ͘ 2012೥2݄23೔໦༵೔
62. .7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO
    .PEFM ✓ "QQMJDBUJPO
    .PEFM ✓ .77. ✓ .71 2012೥2݄23೔໦༵೔
63. ·ͩ ๻͕ ͬ͘͠Γ͖͍ͯͳ͍͜ͱ ✓ ϓϨθϯςʔγϣϯϩδοΫʹ΋υ ϝΠϯϩδοΫʹ΋͏·͓͚͘ͳ͍ Α͏ͳϩδοΫ΋͋ΔΑ͏ͳ ✓ ΫϥΠΞϯτଆʹԿΛஔ͍ͯαʔό ଆʹԿΛஔ͍ͯͦΕΒ͕Ͳ͏ڠௐ͢ ΂͖͔ 2012೥2݄23೔໦༵೔
64. *T
    UIJT
    BOTXFS https://gist.github.com/1362110 2012೥2݄23೔໦༵೔
65. ઌਓͷ஌ܙʹֶͼͭͭ ͞ΒͳΔ࣮ફͱٞ࿦͕ ඞཁͦ͏ 2012೥2݄23೔໦༵೔
66. ଓ͘ 2012೥2݄23೔໦༵೔
67. ͦͷଞͷ৘ใ΁ͷϙΠϯλ ✓ 81'
    ޲͚ͷϞσϧ
    
    Ϗϡʔ
    
    ϓϨθϯ λʔ
    
    ϏϡʔϞσϧઃܭύλʔϯ http://msdn.microsoft.com/ja-jp/magazine/hh580734.aspx ✓ ։ൃऀ͕஌͓ͬͯ͘΂͖ɺͭͷ6*Ξʔ ΩςΫνϟɾύλʔϯ http://www.atmarkit.co.jp/fdotnet/chushin/greatblogentry_10/ greatblogentry_10_01.html 2012೥2݄23೔໦༵೔
68. ͠·ͩ
    ͜͏͡ SHIMADA Koji ೔ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture. 2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌୅ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 2012೥2݄23೔໦༵೔
69. ͝ਗ਼ௌ ͋Γ͕ͱ͏ ͍͟͝·ͨ͠ 2012೥2݄23೔໦༵೔
70. Ruby Sapporo Night vol.14 2012-02-23 Thu
    Apple Store, Sapporo 2012೥2݄23೔໦༵೔