Introduction to Model-View-Controller Framework.pptx

MVC Framework

1. Model-View-Controller (MVC) Software Design Pattern

2. Web Programming

3. What is Web programming ? The non-design aspects of building Web sites - writing markup and coding Developing web applications of all scales accessed with a Web browser over a network such as the Internet or an intranet. Web applications are popular due to the ubiquity of the browser as a client ( a thin client ) The ability to update and maintain Web applications without distributing and installing software on client-side. Web applications are used to implement Webmail , online retail sales, online auctions, wikis , Weblogs , and ....

4. Webapps S ummary Accessed with a Web Browser (client) Over a network Code is mainly run on server Exception: client-side script (also: Java, Flash,..) Code is loaded from server Data is mainly stored on server Webapps can be updated easily ….. without updating the clients!

5. General 3 - T iered S tructure First tier: client side code (web-browser), e.g. (X)HTML, Javascript , Java, Flash Second tier: server side code, e.g. C/C++, Perl, PHP, Java, Ruby, Python Third tier: server side database

6. Software-Design Pattern

7. Architectural Pattern from Smalltalk (1979) Decouples D ata and P resentation Eases the D evelopment Model View Controller

8. Short Introduction of Smalltalk Smalltalk was the first graphical language tool support live programming and advanced debugging techniques such as on-the-fly inspection and code changes during execution in a very user-friendly format Smalltalk was created to investigate teaching programming to children. Smalltalk isn't popular but still widely used by JPMorgan, Telecom Argentina, UBS, Florida Power & Light, Desjardins, Texas Instruments, Siemens AG, ...

9. First thought (ok, but not far enough): Tier 1: View (Client) Tier 2: Controller (Server) Tier 3: Model (Database) Database Client Server

10. Presentation: View is the user interface (e.g. button) Controller is the code (e.g. callback for button) Data: Model is the database Database Presentation Data

11. Example Control Flow in M V C User interacts with the VIEW UI CONTROLLER handles the user input (often a callback function attached to UI elements) CONTROLLER updates the MODEL VIEW uses MODEL to generate new UI UI waits for user interaction

12. MVC – general example