CSE 136 - Lecture 7   Presentation Overview   MVC (Model, View, Controller)   ASP.NET MVC 3.0     Routing in detail   ...
Introduction
Presentation Layer   It’s what users see   Handling complicated page flows   Two components of the presentation layer  ...
Presentation model vs Business model
MVC - Model View Controller
MVC
MVC - Pro and Con   Pro     Decoupling    – GUI/CSS developers do their      job, C# developers code the Controller, mod...
ASP.NET   Uses .NET Framework   Compiled   Multi-language (C#, VB, C++, etc)   Host under CLR   Code execution (i.e. ...
ASP.NET - Page Class Functions   Request - Handle request from user       Request.QueryString.Get("pid");       Request...
ASP.NET MVC   Powerful Routing System     Good  for search engine     Friendly URL (copy & paste)   Builds on ASP.NET ...
MVC Architecture 1
MVC Architecture 2 Some companies Use the same model
MVC Web - Directories Directory    Purpose /Controllers Where you put Controller classes that handle URL requests /Models ...
MVC Web - Routing
MVC Web - Routing example  URL  /  /Students/  /Students/Details/1  /Students/Edit/1  /Books/  /Books/List
MVC Web - Routing order
MVC Web - more Routing    http://www.mysite.com/Catalog/Red    http://www.mysite.com/Catalog
MVC Web - Generate URL
MVC Web - controller 1
MVC Web - controller 2
MVC Web - controller input 1     Request.QueryString       NameValueCollection        GET variables sent with this request...
MVC Web - controller input 2       Request.QueryString /index.aspx?id=12345       Request.Form        <input type=text nam...
MVC Web - controller output 1
MVC Web - controller output 2
MVC Web - controller output 3
MVC Web - controller output 4
MVC Web - View 1
MVC Web - View 2
MVC Web - View 3
MVC Web - View 4
MVC Web - View 5
MVC Web - View 6Output:
MVC Web - View 7
MVC Web - View 8   Partial Views    A  Web Forms user control (i.e., an ASCX file)     Compiled as a class that inherit...
Break time   MVC Model will be in the demo
Demo   Service Layer code   MVC tutorial   MVC 136 solution – debugged mode     Model  (including service call)     V...
Review question   What are the 5 page class functions?   Does the routing order matter?   Where is the controller recei...
Your assignment   Due next Thursday   GUI Implementation using ASP.NET MVC 3.0     Model, view, controller     MVC Tes...
References   .NET : Architecting Applications for the    Enterprise   MVC 3.0
Upcoming SlideShare
Loading in …5
×

Day7

409 views

Published on

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
409
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
10
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Day7

  1. 1. CSE 136 - Lecture 7 Presentation Overview MVC (Model, View, Controller) ASP.NET MVC 3.0  Routing in detail  Controller in detail  View in detail
  2. 2. Introduction
  3. 3. Presentation Layer It’s what users see Handling complicated page flows Two components of the presentation layer  User Interface - What you see & interacting with  Presentation Model/Logic - Data flow between the business logic and presentation layer
  4. 4. Presentation model vs Business model
  5. 5. MVC - Model View Controller
  6. 6. MVC
  7. 7. MVC - Pro and Con Pro  Decoupling – GUI/CSS developers do their job, C# developers code the Controller, model and tests  You can test the logical flow by a test program to talk to the Controller directly Con  Viewhas intimate knowledge of the Model (when page refresh)
  8. 8. ASP.NET Uses .NET Framework Compiled Multi-language (C#, VB, C++, etc) Host under CLR Code execution (i.e. Garbage collection) Object-oriented AJAX development
  9. 9. ASP.NET - Page Class Functions Request - Handle request from user  Request.QueryString.Get("pid");  Request.Form.Get("first_name");  HttpCookie myCookie = Request.Cookies["user_id"]; Response - Handle response to user  Response.Redirect("newpage.aspx");  Response.Cookies.Add(myHttpCookie); Server - URL encode/decode  Server.URLEncode(url1); Application - Application variables (name/value pair)  Application["imageDir"] = "image.myserver.com";  <img src="<%= Application["imageDir"]%>/images/1.gif"> Session - Storage per user. It Expires/times out  Session["first_name"] = "John";
  10. 10. ASP.NET MVC Powerful Routing System  Good for search engine  Friendly URL (copy & paste) Builds on ASP.NET platform  object oriented  multiple languages Easy to develop (debugging) Easy to deploy (going live, updates)
  11. 11. MVC Architecture 1
  12. 12. MVC Architecture 2 Some companies Use the same model
  13. 13. MVC Web - Directories Directory Purpose /Controllers Where you put Controller classes that handle URL requests /Models Where you put classes that represent and manipulate data /Views Where you put UI template files that are responsible for rendering output /Scripts Where you put JavaScript library files and scripts (.js) /Content Where you put CSS and image files, and other non-dynamic/non-JavaScript content /App_Data Where you store data files you want to read/write. Site master files (header, footer, leftnav, etc)
  14. 14. MVC Web - Routing
  15. 15. MVC Web - Routing example URL / /Students/ /Students/Details/1 /Students/Edit/1 /Books/ /Books/List
  16. 16. MVC Web - Routing order
  17. 17. MVC Web - more Routing http://www.mysite.com/Catalog/Red http://www.mysite.com/Catalog
  18. 18. MVC Web - Generate URL
  19. 19. MVC Web - controller 1
  20. 20. MVC Web - controller 2
  21. 21. MVC Web - controller input 1 Request.QueryString NameValueCollection GET variables sent with this request Request.Form NameValueCollection POST variables sent with this request Request.Cookies HttpCookieCollection Cookies sent by the browser with this request Request.HttpMethod string The HTTP method (verb, e.g., GET or POST) used for this request Request.Headers NameValueCollection The full set of HTTP headers sent with this request Request.Url Uri The URL requested Request.UserHostAddress string The IP address of the user making this request RouteData.Route RouteBase The chosen RouteTable.Routes entry for this request RouteData.Values RouteValueDictionary Active route parameters (either extracted from the URL, or default values) HttpContext.Application HttpApplicationStateBase Application state store HttpContext.Cache Cache Application cache store HttpContext.Items IDictionary State store for the current request HttpContext.Session HttpSessionStateBase State store for the visitor’s session User IPrincipal Authentication information about the logged-in user TempData TempDataDictionary Temporary data items stored for the current user (more about this later)
  22. 22. MVC Web - controller input 2 Request.QueryString /index.aspx?id=12345 Request.Form <input type=text name="City"> RouteData.Values /Catalog/Red
  23. 23. MVC Web - controller output 1
  24. 24. MVC Web - controller output 2
  25. 25. MVC Web - controller output 3
  26. 26. MVC Web - controller output 4
  27. 27. MVC Web - View 1
  28. 28. MVC Web - View 2
  29. 29. MVC Web - View 3
  30. 30. MVC Web - View 4
  31. 31. MVC Web - View 5
  32. 32. MVC Web - View 6Output:
  33. 33. MVC Web - View 7
  34. 34. MVC Web - View 8 Partial Views A Web Forms user control (i.e., an ASCX file)  Compiled as a class that inherits from ViewUserControl (which in turn inherits from UserControl, the base class for all Web Forms user controls)
  35. 35. Break time MVC Model will be in the demo
  36. 36. Demo Service Layer code MVC tutorial MVC 136 solution – debugged mode  Model (including service call)  View (including ascx)  Site.Master  Controller  Unit Test
  37. 37. Review question What are the 5 page class functions? Does the routing order matter? Where is the controller receiving its input value from? When do you use ViewData[“”]? What is the keyword to access the view model?
  38. 38. Your assignment Due next Thursday GUI Implementation using ASP.NET MVC 3.0  Model, view, controller  MVC Tests  Write DTO between SL and PL in Presentation Layer Must implement one user control (ascx) of some kind (see 136 sample mvc3 project) Use simple CSS if possible
  39. 39. References .NET : Architecting Applications for the Enterprise MVC 3.0

×