SlideShare uma empresa Scribd logo
1 de 39
CSE 136 - Lecture 7
   Presentation Overview
   MVC (Model, View, Controller)
   ASP.NET MVC 3.0
     Routing in detail
     Controller in detail

     View in detail
Introduction
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
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, 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)
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
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";
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)
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      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)
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
     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)
MVC Web - controller input 2




       Request.QueryString /index.aspx?id=12345
       Request.Form        <input type=text name="City">
       RouteData.Values    /Catalog/Red
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 6




Output:
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 inherits from
      ViewUserControl (which in turn inherits from
      UserControl, the base class for all Web Forms
      user controls)
Break time
   MVC Model will be in the demo
Demo
   Service Layer code
   MVC tutorial
   MVC 136 solution – debugged mode
     Model  (including service call)
     View (including ascx)

     Site.Master

     Controller

     Unit Test
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?
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
References
   .NET : Architecting Applications for the
    Enterprise
   MVC 3.0

Mais conteúdo relacionado

Mais procurados

Jdbc (database in java)
Jdbc (database in java)Jdbc (database in java)
Jdbc (database in java)
Maher Abdo
 
Microsoft SQL Server 2008
Microsoft SQL Server 2008Microsoft SQL Server 2008
Microsoft SQL Server 2008
Hossein Zahed
 

Mais procurados (20)

Three Software Architecture Styles
Three Software Architecture StylesThree Software Architecture Styles
Three Software Architecture Styles
 
Java database connectivity
Java database connectivityJava database connectivity
Java database connectivity
 
Microsoft Entity Framework
Microsoft Entity FrameworkMicrosoft Entity Framework
Microsoft Entity Framework
 
JDBC Tutorial
JDBC TutorialJDBC Tutorial
JDBC Tutorial
 
Database and Java Database Connectivity
Database and Java Database ConnectivityDatabase and Java Database Connectivity
Database and Java Database Connectivity
 
Jdbc
JdbcJdbc
Jdbc
 
Jdbc (database in java)
Jdbc (database in java)Jdbc (database in java)
Jdbc (database in java)
 
Jdbc
JdbcJdbc
Jdbc
 
Jdbc
JdbcJdbc
Jdbc
 
Jdbc
JdbcJdbc
Jdbc
 
Microsoft SQL Server 2008
Microsoft SQL Server 2008Microsoft SQL Server 2008
Microsoft SQL Server 2008
 
Entity Framework Overview
Entity Framework OverviewEntity Framework Overview
Entity Framework Overview
 
J2EE pattern 5
J2EE pattern 5J2EE pattern 5
J2EE pattern 5
 
Overview Of JDBC
Overview Of JDBCOverview Of JDBC
Overview Of JDBC
 
jsf2 Notes
jsf2 Notesjsf2 Notes
jsf2 Notes
 
Entity framework and how to use it
Entity framework and how to use itEntity framework and how to use it
Entity framework and how to use it
 
Ajp notes-chapter-05
Ajp notes-chapter-05Ajp notes-chapter-05
Ajp notes-chapter-05
 
Jdbc complete
Jdbc completeJdbc complete
Jdbc complete
 
Jdbc drivers
Jdbc driversJdbc drivers
Jdbc drivers
 
J2EE PPT --CINTHIYA.M Krishnammal college for women
J2EE PPT --CINTHIYA.M Krishnammal college for womenJ2EE PPT --CINTHIYA.M Krishnammal college for women
J2EE PPT --CINTHIYA.M Krishnammal college for women
 

Semelhante a Day7

Java Spring MVC Framework with AngularJS by Google and HTML5
Java Spring MVC Framework with AngularJS by Google and HTML5Java Spring MVC Framework with AngularJS by Google and HTML5
Java Spring MVC Framework with AngularJS by Google and HTML5
Tuna Tore
 
springmvc-150923124312-lva1-app6892
springmvc-150923124312-lva1-app6892springmvc-150923124312-lva1-app6892
springmvc-150923124312-lva1-app6892
Tuna Tore
 
quickguide-einnovator-7-spring-mvc
quickguide-einnovator-7-spring-mvcquickguide-einnovator-7-spring-mvc
quickguide-einnovator-7-spring-mvc
jorgesimao71
 

Semelhante a Day7 (20)

ASP.NET - Building Web Application..in the right way!
ASP.NET - Building Web Application..in the right way!ASP.NET - Building Web Application..in the right way!
ASP.NET - Building Web Application..in the right way!
 
ASP.NET - Building Web Application..in the right way!
ASP.NET - Building Web Application..in the right way!ASP.NET - Building Web Application..in the right way!
ASP.NET - Building Web Application..in the right way!
 
Bt0083 server side programing
Bt0083 server side programing Bt0083 server side programing
Bt0083 server side programing
 
Spring 3.x - Spring MVC - Advanced topics
Spring 3.x - Spring MVC - Advanced topicsSpring 3.x - Spring MVC - Advanced topics
Spring 3.x - Spring MVC - Advanced topics
 
Jsp/Servlet
Jsp/ServletJsp/Servlet
Jsp/Servlet
 
Web api
Web apiWeb api
Web api
 
Knowledge Sharing : Java Servlet
Knowledge Sharing : Java ServletKnowledge Sharing : Java Servlet
Knowledge Sharing : Java Servlet
 
Building RESTful applications using Spring MVC
Building RESTful applications using Spring MVCBuilding RESTful applications using Spring MVC
Building RESTful applications using Spring MVC
 
Web Component Development Using Servlet & JSP Technologies (EE6) - Chapter 4...
 Web Component Development Using Servlet & JSP Technologies (EE6) - Chapter 4... Web Component Development Using Servlet & JSP Technologies (EE6) - Chapter 4...
Web Component Development Using Servlet & JSP Technologies (EE6) - Chapter 4...
 
Java Spring MVC Framework with AngularJS by Google and HTML5
Java Spring MVC Framework with AngularJS by Google and HTML5Java Spring MVC Framework with AngularJS by Google and HTML5
Java Spring MVC Framework with AngularJS by Google and HTML5
 
springmvc-150923124312-lva1-app6892
springmvc-150923124312-lva1-app6892springmvc-150923124312-lva1-app6892
springmvc-150923124312-lva1-app6892
 
Spring mvc
Spring mvcSpring mvc
Spring mvc
 
SharePoint Client Object Model (CSOM)
SharePoint Client Object Model (CSOM)SharePoint Client Object Model (CSOM)
SharePoint Client Object Model (CSOM)
 
Asp.Net MVC3 - Basics
Asp.Net MVC3 - BasicsAsp.Net MVC3 - Basics
Asp.Net MVC3 - Basics
 
Asp.net
Asp.netAsp.net
Asp.net
 
Java Web Programming [2/9] : Servlet Basic
Java Web Programming [2/9] : Servlet BasicJava Web Programming [2/9] : Servlet Basic
Java Web Programming [2/9] : Servlet Basic
 
JAX-RS 2.0 and OData
JAX-RS 2.0 and ODataJAX-RS 2.0 and OData
JAX-RS 2.0 and OData
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
 
Spring WebApplication development
Spring WebApplication developmentSpring WebApplication development
Spring WebApplication development
 
quickguide-einnovator-7-spring-mvc
quickguide-einnovator-7-spring-mvcquickguide-einnovator-7-spring-mvc
quickguide-einnovator-7-spring-mvc
 

Último

1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
QucHHunhnh
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
AnaAcapella
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
ZurliaSoop
 

Último (20)

1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 
Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 

Day7

  • 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
  • 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. Presentation model vs Business model
  • 5. MVC - Model View Controller
  • 6. MVC
  • 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. 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. 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. 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)
  • 12. MVC Architecture 2 Some companies Use the same model
  • 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. MVC Web - Routing
  • 15. MVC Web - Routing example URL / /Students/ /Students/Details/1 /Students/Edit/1 /Books/ /Books/List
  • 16. MVC Web - Routing order
  • 17. MVC Web - more Routing http://www.mysite.com/Catalog/Red http://www.mysite.com/Catalog
  • 18. MVC Web - Generate URL
  • 19. MVC Web - controller 1
  • 20. MVC Web - controller 2
  • 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. MVC Web - controller input 2 Request.QueryString /index.aspx?id=12345 Request.Form <input type=text name="City"> RouteData.Values /Catalog/Red
  • 23. MVC Web - controller output 1
  • 24. MVC Web - controller output 2
  • 25. MVC Web - controller output 3
  • 26. MVC Web - controller output 4
  • 27. MVC Web - View 1
  • 28. MVC Web - View 2
  • 29. MVC Web - View 3
  • 30. MVC Web - View 4
  • 31. MVC Web - View 5
  • 32. MVC Web - View 6 Output:
  • 33. MVC Web - View 7
  • 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. Break time  MVC Model will be in the demo
  • 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. 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. 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. References  .NET : Architecting Applications for the Enterprise  MVC 3.0