Model-View-Controller Architecture in a Systems Analysis and Design Course

1
Model-View-Controller Architecture in a Systems
Analysis and Design Course

• Dr. Robert F. Zant
• Illinois State University

2
The Plan

• Curriculum overview
• MVC Concepts
• Example MVC implementation

3
Curriculum Structure
4
Systems Development I

• Taken by all IS majors
• Covers Traditional and Object-Oriented SAD

5
Systems Development II

• Taken by IS majors in Systems Development/Analyst
  Sequence
• Covers Traditional SAD
• Includes Simulated Project

6
OO Systems Development

• Taken by IS majors in Web Application Development
  Sequence
• Covers Object Oriented SAD
• Includes Simulated Project

7
Directed Project in Information Technology

• Taken by IS majors in both sequences
• Includes Real-World Project

8
Curriculum Structure
9
MVC Architecture

• Used in both second level courses as a unifying
  theme
• Provides an architectural template for novice
  system developers
• Use is prevalent in industry

10
MVC Structure
11
MVC

• Controller - Interprets user requests and invokes
  Model and View
• Model - contains application logic and access
  logic for persistent data
• View - displays model results to user

12
Primary Data Flow
13
Server Side Programming
14
Client Side Interface Design
15
Guidelines

• All responses from users are processed first by a
  Front Controller
• Communication of user responses to the Front
  Controller is by name (e.g., field names on HTML
  forms)
• A Front Controller invokes a Page Controller, not
  a Model or View
• A Page Controller invokes one Model and one View

16
Guidelines (cont.)

• A Model executes application logic and accesses
  data stores (contains no HTML)
• A Model creates an XML file or an object
  containing its results
• Communication of Model results to a View are by
  name (e.g., tags in XML)

17
Guidelines (cont.)

• A View creates a presentation stream
• A View contains no application logic
• A View obtains all non-constant text data from
  the XML file or result object produced by the
  Model
• A View does not directly reference any data in a
  Model or URL for the site

18
Example Front Controller
lt NOTE This is the Front Controller
DEFAULT pc "menu", sys_base
path_Translated_dir"/", url_base
http"//"server_namepath_info_dir"/",
home url_baseindex.odb SESSION LOGIN
"login.odb?frompc", TIMEOUT 10 INCLUDE
sys_base"c/"pc".c" gt
19
Example Page Controller
lt NOTE Page Controller to List Products
INCLUDE sys_basem/Products/table1.m
INCLUDE sys_basev/Products/table1.v gt
20
Example Model
lt NOTE Model to List Products DATABASE
"DSNmyProducts" SELECT Category, ProductID,
Heading, Description, UnitPrice,
UnitsOnHand FROM Products ORDER BY
ProductID OUTPUT xmlfile NOTE
xmlfile defined during login gt lt?xml
version"1.0" ?gt lt?xml-stylesheet
type"text/xsl href"xslt?gt ltrootgt
ltlinksgt lthomegthomelt/homegt lt/linksgt

21
Example Model (cont.)
ltproductsgt lt EACHROW gt ltrowgt
ltProductIDgtProductIDlt/ProductIDgt
ltCategorygtCategorylt/Categorygt
ltDescriptiongtDescriptionlt/Descriptiongt
ltUnitPricegtUnitPricelt/UnitPricegt
ltUnitsOnHandgtUnitsOnHandlt/UnitsOnHandgt
lt/rowgt lt ENDROW gt lt/productsgt lt/rootgt
lt OUTPUT gt
22
Example XML File
lt?xml version"1.0"?gt lt?xml-stylesheet
type"text/xsl" href"xslt" ?gt ltrootgt ltlinksgt
lthomegthttp//localhost/new/widgets/index.odblt/ho
megt lt/linksgt ltproductsgt ltrowgt
ltProductIDgt3lt/ProductIDgt
ltHeadinggtReinforced plastic 8 inchlt/Headinggt
ltCategorygtPlastic Widgetslt/Categorygt
ltDescriptiongtOversized polyethelene with
steellt/Descriptiongt ltUnitPricegt10.0000lt/Un
itPricegt ltUnitsOnHandgt70lt/UnitsOnHandgt
lt/rowgt lt/productsgt lt/rootgt
23
Example View
SET xslt url_base"v/Products/xslt/table1.xslt"
INCLUDE xmlfile
24
Example XSL
lt?xml version"1.0"?gt ltxslstylesheet
version"1.0" xmlnsxsl"http//www.w3.org/
1999/XSL/Transform"gt ltxsloutput method"html"
omit-xml-declaration"yes"/gt ltxsltemplate
match"/"gt lthtml xmlns"http//www.w3.org/1999/xht
ml" lang"en" xmllang"en"gt ltheadgt ltmeta
http-equiv"content-type" content"text/html"
/gt lttitlegtWorld Wide Widgetslt/titlegt ltstyle
type"text/css"gt _at_import url(v/widgets.css)lt/styl
egt lt/headgt ltbodygt
25
Example XSL (cont.)
ltdiv id"pageHeader"gt ltagtltxslattribute
name"href"gt ltxslvalue-of selectroot/links/h
ome"/gt lt/xslattributegtlth1gtWorld Wide
Widgetslt/h1gtlt/agt lt/divgt lt!-- End of Page Header
--gt ltxslapply-templates /gt ltdiv
id"pageFooter"gt ltagtltxslattribute name"href"gt
ltxslvalue-of selectroot/links/home"/gt
lt/xslattributegtContinue...lt/agt lt/divgt lt!--
End of Page Footer --gt lt/bodygt lt/htmlgt lt/xsltempl
ategt
26
Example XSL (cont.)
ltxsltemplate matchproducts"gt lttablegt
ltcaptiongtProductsltbr /gtby Product IDlt/captiongt
lttrgt ltthgtProduct IDlt/thgtltthgtProductlt/th
gt ltthgtCategorylt/thgtltthgtDescriptionlt/thgt
ltthgtPricelt/thgtltthgtOn Handlt/thgt
lt/trgt ltxslapply-templates selectrow"/gt
lt/tablegt lt/xsltemplategt
27
Example XSL (cont.)
ltxsltemplate matchrow"gt lttrgt
lttdgtltxslvalue-of selectProductID" /gtlt/tdgt
lttdgtltxslvalue-of select"Heading" /gtlt/tdgt
lttdgtltxslvalue-of select"Category" /gtlt/tdgt
lttdgtltxslvalue-of select"Description"
/gtlt/tdgt lttdgtltxslvalue-of
select"format-number
(UnitPrice,',0.00')" /gtlt/tdgt
lttdgtltxslvalue-of select"UnitsOnHand" /gtlt/tdgt
lt/trgt lt/xsltemplategt lt/xslstylesheetgt
28
Recommended Software

• ODB Script
• http//odbscript.com/
• Abyss Web Server
• http//www.aprelium.com/
• Cooktop
• http//xmlcooktop.com/
• TextPad
• http//www.textpad.com/

29
Thank You

• Questions?