An introduction of the Backbone.js

Transcript

1. Backbone.js ͷ঺հ 2016/05/13 גࣜձࣾϥάβΠΞ தౡ࣎

2. Backbone.js ͱ͸ • ΫϥΠΞϯταΠυJavaScriptϑϨʔϜϫʔΫ • ϒϥ΢βͰಈ͘ • Single Page ApplicationΛ࡞ΔͨΊʹ࢖͏

3. ओͳ࢖༻ྫ • Hulu • Airbnb • Foursquare • ͦͷଞ

4. Single Page Applicationͱ͸ • ୯ҰϖʔδʹΑΔWebΞϓϦέʔγϣϯ • ྫɿGoogleϚοϓɺGmail • ϖʔδ͸DOMͷૢ࡞ʹΑΓ੾Γସ͑Λߦ͏ •

   αʔόͱͷ΍ΓͱΓ͸Ajax΍WebSocketʹΑΓ ߦ͏

5. σϞ έ◦ΩʔϥΠηϯε؅ཧΞϓϦέʔγϣϯ • Rails::API • Backbone.js

6. ಛ௃ 1 ރΕ͍ͯΔ • 2010೥ੜ·Ε • ࡞ऀ • Jeremy Ashkenas

   • CoffeeScriptͱUnderscore.jsͷ࡞ऀ • ͜ͷઌɺେ͖ͳมߋ͕ͳ͍ • ϓϥάΠϯ͕ॆ࣮

7. ಛ௃ 2 ໾ׂ෼୲͕໌֬ • ViewͱModelʹ෼͚Δ • View • Πϕϯτϋϯυϥʔͷએݴ •

   DOMͷੜ੒ • Model • σʔλͷอ࣋ • RESTfulAPIͱͷ௨৴

8. ಛ௃ 3 RESTful APIΛ࢖͍΍͍͢ • RESTful API਌࿨ੑ • ModelʹAPIͷurlΛઃఆ •

   ModelͷfetchϝιουͰऔಘ • saveϝιουͰอଘ • CREATEͱUPDATEΛࣗಈ൑ผ

9. دΓಓ 1 CRUD • CRUD • σʔλૢ࡞ͷछྨʢྫ͑͹σʔλϕʔεʣ • Create •

   INSERT • Read • SELECT • Update • Delete

10. دΓಓ 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

11. دΓಓ 3 RESTͱσʔλϕʔεૢ࡞ • URLͱσʔλϕʔεૢ࡞͕ରԠ • Create : POST /users

    : INSERT • Read : GET /users : SELECT • Update : PUT /users/:id : UPDATE • Delete : Delete /users/:id : DELETE

12. دΓಓ 4 RESTful API • REST ͳ URL ͷ API

    • Ϩεϙϯε͕JSONܗࣜ • JavaScriptϓϩάϥϛϯάͰѻ͍΍͍͢ • Html͸ѻ͍ʹ͍͘

13. γʔέϯεʹԊͬͯιʔείʔυղઆ

14. ޲͍͍ͯΔҊ݅ • RESTful API͕͋Δ • ը໘ͷσβΠϯ͕֬ఆࡁΈ • jQueryΛ࢖͏ • Internet

    ExplorerରԠ

15. ޲͍͍ͯͳ͍Ҋ݅ • JavaScriptͰσʔλΛѻ͏ίʔυ͕গͳ͍ • ྫʣtextae͸8739ߦத978ߦʢ11%ʣ

16. ࢀߟࢿྉ • backbonejs.org • ࠷৽API͕Θ͔Δ • Backbone.jsೖ໳ (શ22ճ) - ϓϩάϥϛϯ

    άͳΒυοτΠϯετʔϧ • ϓϩάϥϛϯάͷखॱ͕Θ͔Δ • ೖ໳Backbone.js • શମ૾͕͔ͭΊΔ