×
Copy
Open
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
Backbone.js ͷհ 2016/05/13 גࣜձࣾϥάβΠΞ தౡ࣎
Slide 2
Slide 2 text
Backbone.js ͱ • ΫϥΠΞϯταΠυJavaScriptϑϨʔϜϫʔΫ • ϒϥβͰಈ͘ • Single Page ApplicationΛ࡞ΔͨΊʹ͏
Slide 3
Slide 3 text
ओͳ༻ྫ • Hulu • Airbnb • Foursquare • ͦͷଞ
Slide 4
Slide 4 text
Single Page Applicationͱ • ୯ҰϖʔδʹΑΔWebΞϓϦέʔγϣϯ • ྫɿGoogleϚοϓɺGmail • ϖʔδDOMͷૢ࡞ʹΑΓΓସ͑Λߦ͏ • αʔόͱͷΓͱΓAjaxWebSocketʹΑΓ ߦ͏
Slide 5
Slide 5 text
σϞ έ○ΩʔϥΠηϯεཧΞϓϦέʔγϣϯ • Rails::API • Backbone.js
Slide 6
Slide 6 text
ಛ 1 ރΕ͍ͯΔ • 2010ੜ·Ε • ࡞ऀ • Jeremy Ashkenas • CoffeeScriptͱUnderscore.jsͷ࡞ऀ • ͜ͷઌɺେ͖ͳมߋ͕ͳ͍ • ϓϥάΠϯ͕ॆ࣮
Slide 7
Slide 7 text
ಛ 2 ׂ୲͕໌֬ • ViewͱModelʹ͚Δ • View • Πϕϯτϋϯυϥʔͷએݴ • DOMͷੜ • Model • σʔλͷอ࣋ • RESTfulAPIͱͷ௨৴
Slide 8
Slide 8 text
ಛ 3 RESTful APIΛ͍͍͢ • RESTful APIੑ • ModelʹAPIͷurlΛઃఆ • ModelͷfetchϝιουͰऔಘ • saveϝιουͰอଘ • CREATEͱUPDATEΛࣗಈผ
Slide 9
Slide 9 text
دΓಓ 1 CRUD • CRUD • σʔλૢ࡞ͷछྨʢྫ͑σʔλϕʔεʣ • Create • INSERT • Read • SELECT • Update • Delete
Slide 10
Slide 10 text
دΓಓ 2 REST • REST (Representational State Transfer) • HTTPϝιουͱURLͰCRUDΛදݱ • Create : POST /users • Read : GET /users ɾ GET /users/:id • Update : PUT /users/:id • Delete : Delete /users/:id
Slide 11
Slide 11 text
دΓಓ 3 RESTͱσʔλϕʔεૢ࡞ • URLͱσʔλϕʔεૢ࡞͕ରԠ • Create : POST /users : INSERT • Read : GET /users : SELECT • Update : PUT /users/:id : UPDATE • Delete : Delete /users/:id : DELETE
Slide 12
Slide 12 text
دΓಓ 4 RESTful API • REST ͳ URL ͷ API • Ϩεϙϯε͕JSONܗࣜ • JavaScriptϓϩάϥϛϯάͰѻ͍͍͢ • Htmlѻ͍ʹ͍͘
Slide 13
Slide 13 text
γʔέϯεʹԊͬͯιʔείʔυղઆ
Slide 14
Slide 14 text
͍͍ͯΔҊ݅ • RESTful API͕͋Δ • ը໘ͷσβΠϯ͕֬ఆࡁΈ • jQueryΛ͏ • Internet ExplorerରԠ
Slide 15
Slide 15 text
͍͍ͯͳ͍Ҋ݅ • JavaScriptͰσʔλΛѻ͏ίʔυ͕গͳ͍ • ྫʣtextae8739ߦத978ߦʢ11%ʣ
Slide 16
Slide 16 text
ࢀߟࢿྉ • backbonejs.org • ࠷৽API͕Θ͔Δ • Backbone.jsೖ (શ22ճ) - ϓϩάϥϛϯ άͳΒυοτΠϯετʔϧ • ϓϩάϥϛϯάͷखॱ͕Θ͔Δ • ೖBackbone.js • શମ૾͕͔ͭΊΔ