how to asp.net mvc4
DESCRIPTION
原本對企業內部分享的資料,粗淺地介紹如何快速上手與體驗MVC4的優點。TRANSCRIPT
![Page 1: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/1.jpg)
How to ASP.NET MVC4
201408 Training MaterialDaniel.Chou
![Page 2: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/2.jpg)
下午好,有準備咖啡了嗎 ?
![Page 3: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/3.jpg)
希望不會 zzzZZZ…
![Page 4: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/4.jpg)
時間關係這次 MVC 中先不著墨在
Model….
![Page 5: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/5.jpg)
DEMO Project:• 歡迎下載使用,有任何建議或問題請不吝指教。• https://github.com/danielchou/MVC4Demo
![Page 6: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/6.jpg)
Agenda
• Why MVC?• How to install?• Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程– Action 決定轉出格式– View 輕薄的外衣。
• Q&A
![Page 8: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/8.jpg)
ASP.NET MVC 其實就是優點• ASP.NET MVC gives you a powerful, patterns-based way to
build dynamic websites that enables a clean separation of concerns and that gives you full control over markup for enjoyable, agile development. ASP.NET MVC includes many features that enable fast, TDD-friendly development for creating sophisticated applications that use the latest web standards.– Patterns-base 習慣大於配置– SoC ”關注點分離 !”,流程與 UI分離。– Enjoyable(?)、 agile 開發更快速– TDD-friendly 單元、整合、自動測試架構。– Latest web standards.符合最新網頁標準
![Page 9: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/9.jpg)
ASP.NET MVC 優點• 很容易:
– 開發行動裝置。– 建構 HTTP API網站。– AJAX實作。– 整合前端程式框架, jQuery、 Knockout、 AngularJS。– 分工、平行開發– 擴充架構、維護
• 特色:– 沒有 PostBack– 開放原始碼– Layout套版沒有伺服器控制項的羈絆– 支援多種 ViewEngine– Routing支援– 網頁流量低、執行速度快。
![Page 10: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/10.jpg)
ASP.NET MVC 缺點• 以下都不能:
– ViewState– Page Trace– ASP.NET Event Model– Server Control (GridView, FormView,….)
• 較辛苦,對有些人要重頭學起。– HTTP 我怎會不懂 ?– 熟悉 JavaScript… 很難 debug耶 ?– 網頁 HTML基本組成 我又不是美工 ?– 不再拖拉開發 寫得怎可能比我用拉的快 ??
– 前端 ?後端 ? ….?
![Page 11: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/11.jpg)
MVC 其實容易卡在“基礎“
![Page 12: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/12.jpg)
只是還原網頁開發應有的樣子
![Page 13: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/13.jpg)
網頁標準- Http Method• 80 port、瀏覽器發出要求。
– GET– POST– PUT– DELETE– HEAD– CONNECT– …
– Ref • http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html
![Page 14: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/14.jpg)
網頁標準- Http Method - Rest 架構• 80 port、瀏覽器發出要求。
– GET 查詢。– POST 修改。– PUT 新增。– DELETE 刪除。 – HEAD– CONNECT
![Page 15: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/15.jpg)
網頁標準- Http Status Code• 解析網頁狀態很重要的 !
– 200: OK,伺服器成功傳回網頁– 301:Moved Permanently ,永久轉址。– 304: Not Modified,未修改 (Cached)– 400: Bad Request,伺服器無法解讀該要求的語法。– 403: Forbidden,權限有問題。– 404: Not Found,找不到檔案。– 500: Internal Server Error,伺服器遭遇錯誤。– ……….
– Ref:• http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html• https://support.google.com/webmasters/answer/40132?hl=zh-Hant
![Page 16: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/16.jpg)
Chrome Devtool• Or Firebug、 Fiddler….
– JS除錯、效能調教、資料查看、 Ajax、 JSON– 不熟悉的可來這邊免費上課
• http://discover-devtools.codeschool.com/
![Page 17: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/17.jpg)
ASP.NET Webform 為何以前不用懂這些 ?• 歷史淵源的• 網頁程式剛崛起• 大家習慣Winform開發,事件驅動• 在無狀態的Web上硬是模擬出狀態 (ViewState)
![Page 18: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/18.jpg)
學這麼多永遠學不完阿
![Page 19: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/19.jpg)
討論一下你的學習 c/p 值• 微軟
• MVC2 2010• MVC3 2011• MVC4 2012• MVC5 2013• vNext 2014• 真是沒完沒了… .XD (我會建議選取部分使用… .)
• 網頁開放標準– Javascript EMCAcript6– CSS CSS3– HTML(4) HTML5
• JSP,PHP,Ruby,Python…甚至 mobile也利用這些標準
![Page 20: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/20.jpg)
User 的需求、喜好永遠推動新技術的產生
![Page 21: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/21.jpg)
當系統功能日益龐大複雜…
![Page 22: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/22.jpg)
MVC 架構分工、維護、擴充
會讓你蠻開心的
![Page 23: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/23.jpg)
MVC 就是切三層,各司其職• Model資料 要厚肥• Controller 流程 要清楚• View 外皮 要簡單
![Page 24: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/24.jpg)
MVC 實務上的架構是這樣…• Model
– Repository 資料倉儲– Service 商業邏輯– Interface 介面層
• Controller• View
– Helpers– JS
• KnockoutJS、 AngulerJS
![Page 25: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/25.jpg)
應該切入正題了…
![Page 26: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/26.jpg)
Agenda
• Why MVC?• How to install? • Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程– Action 決定轉出格式– View 輕薄的外衣。
• Q&A
![Page 27: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/27.jpg)
Which version?• VS2010 MVC4 今天介紹這個• VS2012 MVC5
– .NetFramework 4.5+– Visual Studio 2012
• VS2014 MVC6 – vNext– No more System.Data, lighter...– Linux、MAC、 RaspbarryPi… available.– Azure Cloud
![Page 28: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/28.jpg)
ASP.NET MVC4 features.• 對行動裝置平台支援更好,更加開放標準 !!
– ASP.NET web API– Project templates enhancements– Mobile project template– JQuery mobile and View switcher– Bundling and minification JS,CSS– OAuth, OpenID
![Page 29: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/29.jpg)
MVC4 tools update for VS2010• http://www.microsoft.com/en-us/download/details.aspx?id=30683
![Page 30: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/30.jpg)
新增專案
![Page 31: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/31.jpg)
Create a new project
• 預設是這些– Empty– Basic– Internet App– Intranet App– Mobile App– Web Api
• 還有很多其他…– SingalR(Real-Time)
• By NeGet install.
![Page 32: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/32.jpg)
ASP.NET Family
![Page 33: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/33.jpg)
現在你可以做到這樣…
PHPNodeJS Django
Portable、Mobile Devise
![Page 35: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/35.jpg)
預設登入功能• 自動產生MSSQL.EXPRESS• Responsive Website
– 考慮平板裝置模板。– MVC5支援 Bootstrap。
![Page 36: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/36.jpg)
看一下產生了哪些檔案 ?• 參考 HomeControlls對應的 ViewPage
![Page 37: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/37.jpg)
DEMONew a MVC4 project.
![Page 38: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/38.jpg)
可收工了…
![Page 39: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/39.jpg)
No, 只是先幫你 Scalffolding…
![Page 40: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/40.jpg)
該怎改起 ?
![Page 41: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/41.jpg)
Agenda
• Why MVC?• How to install?• Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程– Action 決定轉出格式– View 輕薄的外衣。
• Q&A
![Page 42: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/42.jpg)
MVC 資料流向
1
2 3 4
5
![Page 43: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/43.jpg)
HTTP Request.
• 先討論 Controller怎接收 URL?
1
![Page 44: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/44.jpg)
其實中間有個 RoutingManager 會幫你處理 .
Routing Manager
![Page 45: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/45.jpg)
你組出的 URL 是不一樣的。• Webform的網址
– http://Server/Products/ProductDetails.aspx?kind=sport&id=3• MVC的網址
– http://Server/Products/Details/sport/3 – Why Rewrite Routing
• URL更直覺、有意義、更易 SEO!• Webform也做得到,但你不會想這樣做。• IIS改裝後會不穩定、效能差。
• 其實MVC網站各種 URL都可以解析得出來 !
![Page 46: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/46.jpg)
RoutingTable !!!
![Page 47: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/47.jpg)
從 Global.asax –RoutingConfig開始
– 初始化就產生了。– System.Web.Routing;– App_Start/RouteConfig.cs.– 但 Global.asax 在MVC6之後消失了
![Page 48: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/48.jpg)
APP_Start 內其他類別的作用 ?• AuthConfig.cs
• 跟 Google、 FB、 Twitter、MS認證接通。• BundleConfig.cs
• 壓縮 js、 css檔案、最小化,網站效能更好。• FilterConfig.cs
• 註冊過濾器,讓程式碼共用更簡單。• WebApiConfig.cs
• WebApi routing path設定。• More…
![Page 49: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/49.jpg)
再回到 Routes.MapRoute
• 網址樣式解說:• name:可設定多組 route(樣式 ),但名稱需要唯一• url: 除了controller,action不變之外,其他可自訂• defaults:傳入的網址或比對不到就以此決定, id沒有設定也會通過。
• 比對順序條件– 由上至下。– 對了才會 mapping到 controller內。
![Page 50: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/50.jpg)
Route 比對順序
• 如果遇到下列網址,該如何比對 ?– http://localhost/– http://localhost/About– http://localhost/Account/Register
![Page 51: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/51.jpg)
Route 比對順序
• 將 Pitfall routing打開,測試看看。– http://localhost/ Home/Index OK– http://localhost/About/ Home/AboutOK– http://localhost/Account/Register Hom/Account/Register 404? 找不到了
![Page 52: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/52.jpg)
靈活設計你的 URL
• 不用費心自己處理解析 mapping的問題。• NuGet上有很多知名的 Routing的套件。
– http://www.codeproject.com/Articles/641783/Customizing-Routes-in-ASP-NET-MVC
![Page 53: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/53.jpg)
How to Debug Routing?• 新手很需要這工具 !• NuGet a RouteDebugger
– Current Version 2.1.4– https://www.nuget.org/packages/routedebugger/
![Page 54: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/54.jpg)
How to Debug Routing?• 長在你頁面最下方。• Dev時可觀察• Release移除。
![Page 55: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/55.jpg)
Demo-Route
![Page 56: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/56.jpg)
Agenda
• Why MVC?• How to install?• Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程 – Action 決定轉出格式– View 輕薄的外衣。
• Q&A
![Page 57: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/57.jpg)
Controller :負責控制流程• 直接產生, ex:ProductionController
– Scaffold選項。
![Page 58: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/58.jpg)
假設為 ProductController• 繼承 Controller• Index ActionResult預設會產生。
– 預設為 [HTTPGet]– 這時候還沒有 ViewPage。
![Page 59: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/59.jpg)
ActionResult 之間資料傳遞• 種類:
– ViewData• 最主要的方式• 只活在同一個 Action內。
– ViewBag• 同 ViewData• 支援物件式寫法, this.ViewBag.Title=“Hello, ViewBag”;
– TempData• 可活在同一個 Request, 可跨 Action傳遞。
• 可從 Controller內丟到 ViewPage外面。• 上面的雖好用,但建議用強型別 (物件 )傳遞資料。
![Page 60: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/60.jpg)
ActionResult 接收表單資料• 同樣可以用 Request物件• 建議用強型別 (物件 )傳遞資料。• DefaultModelBinder類別
– 自動化資料轉換– 又稱為“Model Binding”– 可重複使用
![Page 61: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/61.jpg)
就這樣很簡單,看你 Controller 怎設計而已
![Page 62: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/62.jpg)
DEMO
ViewData 拋到 ViewPageDefaultModelBinder
![Page 63: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/63.jpg)
Agenda
• Why MVC?• How to install?• Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程– ActionResult 決定轉出格式– View 輕薄的外衣。
• Q&A
![Page 64: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/64.jpg)
Controller 與 View 中間還有個 Action
• 嚴格說 View只是一個 ActionResult其中一個可轉化的選項。
ActionResult
![Page 65: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/65.jpg)
ActionResult 超好用 !• ActionResult 格式 產出什麼 ?
– ViewResult HTML– PartialViewResult HTML– ContentResult 純文字– EmptyResult 空白內容– FileResult File(Img,PDF,….)– HttpStatusCodeResult Http Response Status– JavaScriptResult Javascript– JsonResult JSON– RedirectResult 轉址– RedirectToActionResult 轉到某個 Action
![Page 66: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/66.jpg)
參考 AccountController 的 Action Filter
![Page 67: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/67.jpg)
Action Filter• 屬性類別 (Attribute Class)
– 可套用到 Controller層級。– Action方法執行過程中,增加固定動作。– 程式碼更乾淨,好維護 !
• 依照實作介面可區分為:– Action Filter– Result Filter– Authorize Filter– Exception Filter
![Page 68: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/68.jpg)
Agenda
• Why MVC?• How to install?• Start MVC Project
– URL 發動 !– Routing 解析– Controller 決定流程– ActionResult決定轉出格式– View 輕薄的外衣
• Q&A
![Page 69: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/69.jpg)
DEMO
自訂 CROS Attribute.改造我的 JSONResult.
![Page 70: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/70.jpg)
ViewPage 如何新增 ?• 按右鍵出現加入檢視。• 主版頁面
![Page 71: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/71.jpg)
自動產生 Views/Production/Index.cshtml• @: Razor符號
– 新 ViewEngines, MVC3開始支援。– 簡潔、速度快、易學– 可通透到 Server端 C# code,但注意效能。– Layout套用主版面
![Page 72: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/72.jpg)
_Layout.cshtml– 共用 template、主版頁面都放在 Views/Shared內。– @RenderBody() 由內往外執行
![Page 73: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/73.jpg)
Web Helpers• 取代 ASP.NET Server控制項• 內建、第三方、擴充自建。• 內建舉例如下:
– @Html.TextBoxFor(m=>m.Birthday)– @Html.HiddenFor(m=>m.ID)– @Html.ActionLink(“linkText”,”Action”,”Controller”,new{});– @Html.Partial(“ViewPageName”,Model);– ….太多了
![Page 74: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/74.jpg)
DEMO
Razor 運算式
![Page 75: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/75.jpg)
流程、 UI 可以分工了 !!關注點分離 SoC
Seperation of Concern
![Page 76: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/76.jpg)
佈署注意事項• .Net Framework 4+,注意獨立安裝程式。• IIS中新增萬用字元對應 (因為不在用副檔名對應了 )
• Windows 2003 sp2 + IIS 6.0也可,請參照:• http://danielchou4.blogspot.tw/search/label/ASP.NET%20MVC
![Page 77: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/77.jpg)
M 、 V 、 C 每一塊都可著墨很多,
但 Routing 最重要 !
![Page 78: How to ASP.NET MVC4](https://reader036.vdocuments.pub/reader036/viewer/2022081420/555e0699d8b42a9e188b46bf/html5/thumbnails/78.jpg)
Q & A