Save 37% off PRO during our Black Friday Sale! »

使用 ASP.NET MVC 開發SPA網站-微軟實戰課程日

Da5dec3f0447a582c1f9d650edbe0142?s=47 twMVC
May 06, 2013

使用 ASP.NET MVC 開發SPA網站-微軟實戰課程日

此為台灣微軟實戰課程日時由 twMVC 的 demo 以及 study4 的 Sky 聯合主講的「使用 ASP.NET MVC 開發SPA網站」

Da5dec3f0447a582c1f9d650edbe0142?s=128

twMVC

May 06, 2013
Tweet

Transcript

  1. None
  2. None
  3. None
  4. None
  5. 前端設計與後端設計混合 設計人員可能會看不懂@ 與前端資料無法完全分離!! 有多個平台,產生資料的邏輯重複

  6. None
  7. None
  8. None
  9. None
  10. Application

  11. None
  12. None
  13. None
  14. http://blogs.msdn.com/b/chack/archive/2012/02/28/single-page-application-spa-mvc-4.aspx

  15. 圖片取自 ASP.NET MVC4 網站開發美學

  16. JSON Controller ( MVC Web API ) Controller ( MVC

    ) View ( MVC ) View HTML & CSS ViewModel JS Model ( JSON ) RESTful ( Get ) RESTful (Post) Binding Use RESTful (Delete) RESTful (Put) 渲染 Post Action Put Action Delete Action Get Action J S M V V M 資料來源 Sky Demo
  17. 17

  18. • M • V • V M 18

  19. 19

  20. 20

  21. 21

  22. Demo

  23. 23

  24. None
  25. 資料來源 JSON Controller ( MVC Web API ) Controller (

    MVC ) View ( MVC ) View - HTML & CSS ViewModel - JS Model – JS ( JSON ) RESTful ( Get ) RESTful (Post) Binding Use RESTful (Delete) RESTful (Put) 渲染 Post Action Put Action Delete Action Get Action J S M V V M 資料來源 Sky Demo
  26. None
  27. None
  28. Demo

  29. None
  30. 資源 GET PUT POST DELETE 一組資源的URI http://example.com /resources/ 取出一整組 Select

    替換一整組 Update 創建一整組 Insert 刪除 整組 Delete 單個資源的URI http://example.com /resources/142 取出單筆 Select 替換單筆 Update 創建單筆 Insert 刪除 單筆 Delete
  31. None
  32. None
  33. Demo

  34. 34 EmberJS http://mvc.tw/000u

  35. 35 Knockout.js RequireJS http://mvc.tw/000t

  36. 36 Knockout.js Breeze.js Bootstrap http://mvc.tw/000v

  37. 37 BACKBONE.js TypeScript Bootstrap http://mvc.tw/000q

  38. 38 AngularJS Breeze.js http://mvc.tw/000r

  39. 39 Breeze.js http://mvc.tw/000s

  40. 40 ASP.NET SPA Ember Durandal Breeze/ Kunckout Breeze/ Angular Hot

    Towel ToDo sample ★ ★ ★ ★ Bare template ★ ★ Uses Angular ★ Uses Breeze ★ ★ ★ Uses Durandal ★ ★ Uses Ember ★ Uses Knockout ★ ★ ★ ★ Navigation and history ★ ★ ★ ★
  41. 41 ASP.NET SPA Ember Durandal Breeze/ Kunckout Breeze/ Angular Hot

    Towel ToDo sample ★ ★ ★ ★ Bare template ★ ★ Uses Angular ★ Uses Breeze ★ ★ ★ Uses Durandal ★ ★ Uses Ember ★ Uses Knockout ★ ★ ★ ★ Navigation and history ★ ★ ★ ★
  42. None
  43. 資料來源 JSON Controller ( MVC Web API ) Controller (

    MVC ) View ( MVC ) View - HTML & CSS ViewModel - JS Model – JS ( JSON ) RESTful ( Get ) RESTful (Post) Binding Use RESTful (Delete) RESTful (Put) 渲染 Post Action Put Action Delete Action Get Action J S M V V M 資料來源 Sky Demo
  44. None
  45. None
  46. None
  47. Demo

  48. None
  49. None
  50. None
  51. None
  52. None
  53. http://kevintsengtw.blogspot.tw/2011/10/entity-framework-json-3.html#.UYPUocq5L_w http://kevintsengtw.blogspot.tw/2011/10/entity-framework-json-2.html#.UYPUp8q5L_w http://kevintsengtw.blogspot.tw/2011/10/entity-framework-json-1.html#.UYPUq8q5L_w 資料來源mrkt 的程式學習筆記

  54. http://aspnetwebstack.codeplex.com/wikipage?title=CORS%20support%20for %20ASP.NET%20Web%20API&referringTitle=Specs

  55. 55

  56. 56

  57. 57

  58. 58

  59. 59

  60. None
  61. Blog : http://demo.tc twMVC: http://mvc.tw G+: http://demo.tc/+ FB: http://fb.me/demo.fan Plurk:

    http://plurk.com/demoshop
  62. Blog : http://blog.sanc.idv.tw FB: http://fb.me/SKY.CHANG.50 Study4.TW: http://www.study4.tw Study4.TW FB: https://www.facebook.com/Study4.tw

  63. 雲端資源下載 • Free Trial Link: • http://www.windowsazure.com/en-us/pricing/free- trial/?WT.mc_id=WWE001_1032548834 • MSDN

    Subscription Offer: • https://www.windowsazure.com/en-us/pricing/member- offers/msdn-benefits/?WT.mc_id=WWE001_1032548834 • BizSpark Offer: • https://www.windowsazure.com/en-us/pricing/member- offers/bizspark-benefits/?WT.mc_id=WWE001_1032548834 • MPN Offer: • https://www.windowsazure.com/en-us/offers/ms-azr- 0002p/?WT.mc_id=WWE001_1032548834
  64. 64 提醒 上滿4堂課 交回問卷 問卷禮 + 抽獎

  65. http://mvc.tw/000p 活動中有知名部落客/IT Pro蛙大與南霸天Jason方丈與您分享

  66. 第二屆V-Day 虛擬化戰士英雄會5月 8日 https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032548843& Culture=zh-TW&community=0

  67. • 本投影片所包含的商標與文字皆屬原著作者所有。 • 本投影片使用的圖片皆從網路搜尋。 • 本著作係採用 Creative Commons 姓名標示-非商業性-相同方式分享 3.0

    台灣 (中華民國) 授權條款授權。 http://study4.tw http://mvc.tw