Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Next Generation Web Application Architecture
Search
Koji SHIMADA
PRO
February 23, 2012
Technology
1
710
Next Generation Web Application Architecture
Ruby Sapporo Night vol.14
Koji SHIMADA
PRO
February 23, 2012
Tweet
Share
More Decks by Koji SHIMADA
See All by Koji SHIMADA
スタッフエンジニアの道: The Staff Engineer’s Path
snoozer05
PRO
44
14k
ソフトウェアアーキテクチャメトリクスの基礎: Software architecture metrics in a nutshell
snoozer05
PRO
33
11k
これから学ぶ人のための ソフトウェアアーキテクチャ入門: Software architecture is a tool to enhance our humanity
snoozer05
PRO
43
25k
ソフトウェアアーキテクチャ・ ハードパーツ: Software Architecture The Hard Parts
snoozer05
PRO
11
5.7k
ソフトウェアアーキテクチャの基礎: Software Architecture in a Nutshell
snoozer05
PRO
65
36k
Ready Player One: 『ユニコーン企業のひみつ』に学べること
snoozer05
PRO
10
12k
Continuous Architecting and Rails: From rails new to Your Own Architecture
snoozer05
PRO
16
3.9k
Competing with Unicorns: take away the excuses
snoozer05
PRO
3
3.3k
Agile Sapporo: Learn from experience and continue to repair wholeness
snoozer05
PRO
8
7.7k
Other Decks in Technology
See All in Technology
プロダクトエンジニアを支えるための開発生産性向上施策
tsukakei
0
140
Functional TypeScript
naoya
11
4.8k
Fediverse Discovery Providers overview
andypiper
0
170
Technical Writing Meetup vol.35
soracom
PRO
2
120
テスト”ケース”駆動開発 で手戻りをなくそう
ryohma0510
0
310
JEP 480: Structured Concurrency
aya_ebata
0
130
o1のAPIで実験してみたが 制限きつすぎて辛かった話
pharma_x_tech
0
170
『GRANBLUE FANTASY Relink』ソフトウェアラスタライザによる実践的なオクルージョンカリング
cygames
0
170
App Router を実プロダクトで採用して見えてきた勘所をちょっとだけ紹介
marokanatani
1
930
サーバレスでモバイルアプリ開発! NTTコム「ビジネスdアプリ」のアーキテクチャ / The architecture of business d app
nttcom
12
240
不動産売買取引におけるAIの可能性とプロダクトでのAI活用
zabio3
0
270
たった1人からはじめる【Agile Community of Practice】~ソース原理とFearless Changeを添えて~
ktc_corporate_it
1
470
Featured
See All Featured
GraphQLの誤解/rethinking-graphql
sonatard
65
9.8k
Robots, Beer and Maslow
schacon
PRO
157
8.2k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
230
17k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
502
140k
10 Git Anti Patterns You Should be Aware of
lemiorhan
653
58k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
1
48
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
38
9.2k
The Brand Is Dead. Long Live the Brand.
mthomps
53
38k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
354
29k
Debugging Ruby Performance
tmm1
72
12k
The Pragmatic Product Professional
lauravandoore
31
6.2k
Transcript
͠·ͩ͜͏͡ SHIMADA Koji ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture.
2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 20122݄23༵
l Δ͔ͳ൴ํͷੲɺ͋ΔॴͰɺԿͳ͘ແەঢ়ଶͷۭؒ Λඬ͍ͬͯͨɺͰͨΒΊʹू·ͬͨݪࢠͷখ͞ͳू߹ʹɺͦ Εਂࠁͳ֎ইΛ༩͑ͨɻͦͯ͠ɺҟৗͳɺͱͯ͋Γͦ͏ ͳ͍ύλʔϯͰݪࢠͨͪΛΕͳ͍Α͏ʹ݁ͼ͚ͭͯ͠ ·ͬͨɻ͜ͷΑ͏ͳύλʔϯࣗࣗΛίϐʔ͢Δͱ͍͏ ͜ͱΛૣ͍͏ͪʹ֮͑ͯ͠·͍ ͜Εύλʔϯ͕ඇຌͳͷ Ͱ͋Δ͜ͱͷҰ໘Λ͍ࣔͯ͠Δ ɺύλʔϯ͕ඬ͏ͯ͢ͷ
Ͱɺմঢ়ͷࡂ͕Ҿ͖ى͜͞Εଓ͚ͨɻ͜ͷΑ͏ʹͯ͠ Ӊʹੜ໋͕ੜͨ͠ͷͰ͋Δɻ ʰۜՏώονϋΠΫɾΨΠυʱ 20122݄23༵
͠·ͩ͜͏͡ ౡాߒೋ Photo by tmaeda 20122݄23༵
ຊ3VCZͷձ 20122݄23༵
Ұൠࣾஂ๏ਓ-0$"- 20122݄23༵
20122݄23༵
20122݄23༵
20122݄23༵
20122݄23༵
20122݄23༵
20122݄23༵
ΑΖ͘͠ ͓ئ͍͠·͢ 20122݄23༵
͠·ͩ͜͏͡ SHIMADA Koji ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture.
2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 20122݄23༵
͓ॻ͖ ✓ ΫϥΠΞϯτ.7$ͬͯԿͩΖ͏ ✓ ͏͍ͪͲ.7$ ✓ .7$ܥͷύλʔϯͷܥේʹ͍ͭͯ ✓ ͏͍ͪͲΫϥΠΞϯτ.7$ 20122݄23༵
20122݄23༵
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. 20122݄23༵
Demo https://github.com/snoozer05/backbone-tiny-example 20122݄23༵
ΫϥΠΞϯτ.7$ 20122݄23༵
.BSUJO'PXMFSTBJE photo by pragdave 20122݄23༵
l .7$͞·͟·ͳղऍΛ͞Εͯ͠·ͬ ͍ͯΔʹؔΘΒͣɺͦΕΒશ͕ͯ b.7$`ͱ͍͏໊લͰهड़͞Ε͍ͯΔɻ ͦ͠ΕͰࠞཚ͠ͳ͍Α͏ͳΒɺ͋ͳ ͨݴήʔϜʹΑΔ.7$ͷޡղͷ٘ ਜ਼ऀͷՄೳੑ͕͋Δɻ http://martinfowler.com/eaaDev/uiArchs.html 20122݄23༵
ݱࡏͷ8FCΞϓϦέʔγϣϯ ։ൃͰΑࣖ͘ʹ͢Δ.7$ http://www.flickr.com/photos/indigoskies/6523275513/ 20122݄23༵
http://www.flickr.com/photos/indigoskies/6523275513/ .7$.PEFM l࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛͯΊͨͷ 20122݄23༵
.7$ͷΦϦδφϧ Ͱͳ͍ 20122݄23༵
͏͍ͪͲ.7$ 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai ╙30࿁Smalltalkീᒝળ 䉅䈉䈇䈤䈬MVC 2011ᐕ330ᣣ 㒙ㇱᐢ 20122݄23༵
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ⷐ᳞᭽䈱৻ㇱ • 䊝䊂䊦䈲⍮⼂䈱⽎ • 䊎䊠䊷䈲䊝䊂䊦䈱䋨ⷞⷡ⊛䈭䋩⽎ • 䉮䊮䊃䊨䊷䊤䈲䊡䊷䉱䈫䉲䉴䊁䊛䈫䉕⚌䈨䈔䉎䉅䈱 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䉒䈭䈇䈫៊䉕䈜䉎Model-View- Controller • 㕍ᧁᷕ䈘䉖 • 1987ᐕ㗃 • ን჻䉷䊨䉾䉪䉴ᖱႎ䉲䉴䊁䊛(FXIS)䈱␠ౝᢥ ᦠ
• ዋ䈭䈒䈫䉅3䊋䊷䉳䊢䊮䈅䉎 • ⑳䈲␠䈚䈢1988ᐕ䈮OJT䉕ฃ䈔䈢 20122݄23༵
http://www.jac-net.com/~tarzan/smalltalkers/mvc/mvc.html 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䉒䈭䈇䈫៊䉕䈜䉎Model-View- Controller • MVC䈫䈲 – Smalltalk䉲䉴䊁䊛ో䉕⽾䈇䈩䈇䉎⸳⸘ᜰ㊎ – ήℂ䈮ᓥ䈉ᔅⷐ䈲䈭䈇䈏䇮䈖䉏䉕↪䈚䈭䈇䈫៊䉕䈜䉎 •
䊝䊂䊦䈲䇮↹㕙䈮␜䈚䈢䈇䉥䊑䉳䉢䉪䊃䈠䈱䉅䈱 • 䊎䊠䊷䈲䇮䊝䊂䊦䉕䇸䈇䈧䇮䈬䈖䈮䇮䈬䈱䈱ᄢ䈐䈘 䈪䇮䈬䈱䉋䈉䈮␜䈘䉏䉎䈱䈎䇹䉕⍮䈦䈩䈇䉎 • 䉮䊮䊃䊨䊷䊤䈲䇮䊝䊂䊦䉇䊎䊠䊷䉕ᠲ䈜䉎䈢䉄䈱 䊡䊷䉱䈎䉌䈱ⷐ᳞䉕ฃ䈔ઃ䈔䇮ో䉕ᓮ䈜䉎 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai MVC䈱ಽ㘃 • 䉮䊮䊃䊨䊷䊤䈏㗎ᒛ䉎MVC • ଐሽᕈ䉕↪䈜䉎MVC • 䊒䊤䉧䊑䊦䉕↪䈜䉎MVC 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䉮䊮䊃䊨䊷䊤䈏㗎ᒛ䉎MVC • 䊝䊂䊦䈏න⚐䈠䈱䉅䈱䈪䇮䊎䊠䊷䈲␜䈜䉎䈣䈔䇮 䈭䉖䈪䉅䈎䉖䈪䉅䉮䊮䊃䊨䊷䊤䈏䈵䈫䉍䈪㗎ᒛ䉎 • 䊝䊂䊦䈲䇮䊂䊷䉺▤ℂ䈣䈔䉕ኾ㐷䈮ⴕ䈉䉥䊑䉳䉢䉪䊃 䈪䈅䉎䈲䈝䈭䈱䈮䇮䉮䊮䊃䊨䊷䊤䈮ᡰ㈩䈘䉏䉎䊂䊷䉺 䈮ᚑ䉍ਅ䈏䈦䈩䈇䉎 •
䊝䊂䊦䈱ᖱႎ㓝⭁䈏⎕䉌䉏䉎 • 䊝䊂䊦䈫䊎䊠䊷䈏ኒធ䈮㑐ଥ䈚䈩䈇䉎 • ᄌᦝ䉇ᒛ䈮ᒙ䈇 • 䊝䊂䊦䉕ⶄᢙ䈱䊎䊠䊷䈎䉌䉂䉌䉏䈭䈇 20122݄23༵
ଐሽᕈ䉕↪䈜䉎MVC • 䈵䈫䈧䈱䊝䊂䊦䉕ⶄᢙ䈱䊎䊠䊷䈎䉌ⷰ䉎䈖䈫䈮ኻᔕ • ଐሽᕈ䈱ዉ – 䊝䊂䊦䈏ᄌൻ䈜䉎䈫䇮䊝䊂䊦䈲⥄ಽ䈮䇸changed:䇹䈱䊜䉾 䉶䊷䉳䉕ㅍ䉎 – 䈜䉎䈫䊝䊂䊦䉕ⷰ䈩䈇䉎䈜䈼䈩䈱䊎䊠䊷䈮䇸update:䇹䈫䈇
䈉䊜䉾䉶䊷䉳䈏ㅍା䈘䉏䉎 – 䊑䊨䊷䊄䉨䊞䉴䊁䉞䊮䉫ᯏ᭴ – ଐሽᕈㄉᦠ䈱䉨䊷䈮䊝䊂䊦䇮୯䈮䊎䊠䊷䈱㓸ว • 䊝䊂䊦䈱ᖱႎ㓝⭁䈏⏕┙ • 䉮䊮䊃䊨䊷䊤䈲䉁䈣䊜䊆䊠䊷䉕ᜬ䈦䈩䈇䉎 http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 20122݄23༵
http://www.smalltalk-users.jp/Home/gao-zhi/dai30kaismalltalkbenkyoukai 䊒䊤䉧䊑䊦䉕↪䈜䉎MVC • 䊎䊠䊷䈫䉮䊮䊃䊨䊷䊤䈱䊕䉝(VC)䈲䇮䊝䊂䊦䈎 䉌⁛┙ • M䉕VC䈮Ꮕ䈚ㄟ䉖䈪䈉 – 䊎䊠䊷䈱Ꮕ䈚ㄟ䉂(䊒䊤䉫䉟䊮䊜䉾䉶䊷䉳)䈲䊝䊂䊦 䈫䉶䊧䉪䉺(䊜䉸䉾䊄ฬ)䉕ᒁᢙ䈮ᜬ䈧
• on:aspect:menu: • 䊎䊠䊷䈲䊝䊂䊦䈏⥄り䈱ᖱႎ䉕ෳᾖ䈜䉎䉶䊧䉪䉺䈣䈔 䉕⍮䈦䈩䈇䉎 • 䊎䊠䊷䈲䊝䊂䊦䈏⥄り䈱䊜䊆䊠䊷䉕ෳᾖ䈜䉎䉶䊧䉪䉺 䈣䈔䉕⍮䈦䈩䈇䉎 20122݄23༵
.BSUJO'PXMFSTBJE photo by pragdave 20122݄23༵
l ʹݴͬͯɺݹయతͳ.7$ ࠓͷϦονΫϥΠΞϯτʹରͯ͠ ͋·Γ༻Λͳ͠·ͤΜɻ http://martinfowler.com/eaaDev/uiArchs.html 20122݄23༵
ରܕγεςϜͷ.7$ܥ ΞʔΩςΫνϟͷܥේ 20122݄23༵
.7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ .77. ✓ .71 20122݄23༵
.7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ .77. ✓ .71 20122݄23༵
1SFTFOUBUJPO.PEFM ✓ υϝΠϯϩδοΫͱϓϨθϯςʔ γϣϯϩδοΫΛϞσϧͷͰ ✓ 7JFX.PEFMͷखલʹஔ͔Ε ͨ1SFTFOUBUJPO.PEFMΛ ࢹ͢Δ 20122݄23༵
1SFTFOUBUJPO.PEFM View Model Controller Presentation Model ࢹ 20122݄23༵
ݹయతͳ.7$͕ ͍࣋ͬͯͨΛ ղܾ͠Α͏ͱͨ͠ͷ 20122݄23༵
ݹయతͳ.7$͕͍࣋ͬͯͨ ✓ γεςϜʹଘࡏ͢ΔϩδοΫ ϏδωεϩδοΫ͚ͩ͡Όͳ͍ ✓ ϓϨθϯςʔγϣϯϩδοΫͷ ஔ͖͕ ✓ .7$Ͱ7JFX͔.PEFM ʹ͓͔͘͠ແ͍
20122݄23༵
1SFTFOUBUJPO.PEFM View Model Controller Presentation Model ࢹ 20122݄23༵
1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ 7JTVBM8PSLTͰͷΞϓϩʔν ✓ .PEFM7JFX7JFX.PEFM ✓ 81'ͰͷΞϓϩʔν 20122݄23༵
.7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ .77. ✓ .71 20122݄23༵
.PEFM7JFX1SFTFOUFS ✓ ೖྗ੍ޚ04͞Μ͕ͬͯ͘ΕΔ ͷͰίϯτϩʔϥ͞Μ͕ୀ ✓ 7JFXଆΛૢ࡞͍ͨ͠ϓϨθ ϯςʔγϣϯϩδοΫ͋ͬͨ ✓ ϩδοΫΛ࣋ͭଆͰ͍͡ΕΔ ਓ͕ඞཁ
20122݄23༵
.PEFM7JFX1SFTFOUFS View (V/C) Model Presenter ࢹ ૢ࡞Մ 20122݄23༵
ϙΠϯτ 20122݄23༵
$POUSPMMFSͱ 1SFTFOUFS ੜཱ͍ͪͷҟͳΔͷ 20122݄23༵
ཧ 20122݄23༵
.7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ .77. ✓ .71 20122݄23༵
υϝΠϯϩδοΫҎ֎ͷϩδοΫ ΛͲ͜ʹஔ͍ͯɺͦΕͱଞͷίϯ ϙʔωϯτΛͲ͏͏·͘ڠௐͤ͞ Δ͔ͷ࣮ફͷྺ࢙ .7$ܥΞʔΩςΫνϟύλʔϯ 20122݄23༵
࠷ۙͷ+BWB4DSJQUϥΠϒϥϦ ✓ #BDLCPOFKT ✓ ,OPDLPVUKT ✓ +BWB4DSJQU.7$ ✓ #BUNBOKT 20122݄23༵
3BJMTͷੈքͰ ✓ $FMMT ✓ %SBQFS ✓ 20122݄23༵
8FCΞϓϦέʔγϣϯͷ ੈքʹɺϦονΫϥΠΞ ϯτͱେنԽʹΑͬͯϓ ϨθϯςʔγϣϯϩδοΫ ͱͷઓ͍͕ຊ֨Խͭ͠ ͭ͋Δ 20122݄23༵
.BSUJO'PXMFSTBJE photo by pragdave 20122݄23༵
l .7$͞·͟·ͳղऍΛ͞Εͯ͠·ͬ ͍ͯΔʹؔΘΒͣɺͦΕΒશ͕ͯ b.7$bͱ͍͏໊લͰهड़͞Ε͍ͯΔɻ ͦ͠ΕͰࠞཚ͠ͳ͍Α͏ͳΒɺ͋ͳ ͨݴήʔϜʹΑΔ.7$ͷޡղͷ٘ ਜ਼ऀͷՄೳੑ͕͋Δɻ http://martinfowler.com/eaaDev/uiArchs.html 20122݄23༵
ΫϥΠΞϯτ.7$ 20122݄23༵
http://www.flickr.com/photos/indigoskies/6523275513/ .7$.PEFM l࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛͯΊͨͷ 20122݄23༵
http://www.flickr.com/photos/indigoskies/6523275513/ .7$.PEFM l࣌zͷ8FCΞϓϦέʔγϣϯʹ .7$ΞʔΩςΫνϟΛͯΊͨͷ Ͱͳ͘ 20122݄23༵
.7$ܥΞʔΩςΫνϟύλʔϯ ✓ 1SFTFOUBUJPO.PEFM ✓ "QQMJDBUJPO.PEFM ✓ .77. ✓ .71 20122݄23༵
·ͩ ͕ ͬ͘͠Γ͖͍ͯͳ͍͜ͱ ✓ ϓϨθϯςʔγϣϯϩδοΫʹυ ϝΠϯϩδοΫʹ͏·͓͚͘ͳ͍ Α͏ͳϩδοΫ͋ΔΑ͏ͳ ✓ ΫϥΠΞϯτଆʹԿΛஔ͍ͯαʔό ଆʹԿΛஔ͍ͯͦΕΒ͕Ͳ͏ڠௐ͢
͖͔ 20122݄23༵
*TUIJTBOTXFS https://gist.github.com/1362110 20122݄23༵
ઌਓͷܙʹֶͼͭͭ ͞ΒͳΔ࣮ફͱ͕ٞ ඞཁͦ͏ 20122݄23༵
ଓ͘ 20122݄23༵
ͦͷଞͷใͷϙΠϯλ ✓ 81'͚ͷϞσϧϏϡʔϓϨθϯ λʔϏϡʔϞσϧઃܭύλʔϯ http://msdn.microsoft.com/ja-jp/magazine/hh580734.aspx ✓ ։ൃऀ͕͓͖ͬͯ͘ɺͭͷ6*Ξʔ ΩςΫνϟɾύλʔϯ http://www.atmarkit.co.jp/fdotnet/chushin/greatblogentry_10/ greatblogentry_10_01.html
20122݄23༵
͠·ͩ͜͏͡ SHIMADA Koji ຊRubyͷձ Rubyࡳຈ Next Generation Web Application Architecture.
2012-02-21 Ruby Sapporo Night vol.14 ΞοϓϧετΞࡳຈ ϦονΫϥΠΞϯτ ࣌ͷ8FCΞϓϦέʔγϣϯ ΞʔΩςΫνϟ ύλʔϯʹ͍ͭͯߟ͑Δ ɹ 20122݄23༵
͝ਗ਼ௌ ͋Γ͕ͱ͏ ͍͟͝·ͨ͠ 20122݄23༵
Ruby Sapporo Night vol.14 2012-02-23 Thu Apple Store, Sapporo 20122݄23༵