Web Application Design Notes N-Tier Architecture Tier Architecture

Web Application Design Notes Jeff Offutt http://www.cs.gmu.edu/~offutt/ SWE 642 Software Engineering for the World Wide Web

N-Tier Architecture

network

Client

middleware

middleware

Web Server

Application Server

DB Server

Client-server … 3-tier … N-tier …

3 December 2013

© Offutt

2

1

Design Goals • A major design goal of the N-tier architecture is separation of concerns : 1. 2. 3.

Presentation Logic Data

• Also to support our seven criteria : 1. Maintainability 2. Securityy 3. Scalability 4. …

3 December 2013

© Offutt

3

Separation of Concerns • Presentation

HTML & JSP

• Data content

Servlets & beans Data structures

• Data representation

Beans & java classes Data base & files

• Data storage

3 December 2013

Oracle, sql

© Offutt

4

2

Separation of Concerns (2) • doGet() and doPost() should be simple and short – Shift processing to other methods and classes

• Put complicated logic in non-servlet classes • Put almost no logic in JSPs – JSPs should present data they get from other classes JJSP

• Use servlets to process user input • Use JSPs to present data that is on server

Beans & Java classes

DB

Servlet 3 December 2013

© Offutt

5

Design Specification pecification— —Good Habits • Software Requirements Baseline • Information Architecture Specification – Site map, Web Page Flows, Compositions, Labeling, Data Element Mappings

• Web Application Design – – – – –

3 December 2013

High-Level Software Design Software Architecture and System Architecture Diagram Class Diagrams g Sequence Diagrams Class Specifications

© Offutt

6

3

Model--ViewModel View-Controller (MVC) • The MVC architecture is a common abstraction in web application design – Divides the responsibilities of objects – Decreases coupling between objects and layers (supports easier maintenance) – Helps divide the work – supports development expertise areas • One O off the h first f webb design d patterns • Probably over-used • If I only have one tool, a hammer, all problems look like nails … 3 December 2013

© Offutt

7

Model--ViewModel View-Controller (MVC) Model

method calls

• Encapsulates application state p to state qqueries • Responds • Exposes application functionality • Notifies views of changes

events

state query

change notification

View • Renders the model • Requests updates from the model • Sends user inputs to controller • Allows controller to select view

HTML / JSP

view select user inputs

data structures

state change Java servlets

Controller • Defines application behavior • Maps M user actions i to model d l updates d • Selects a view for response • One view for each function

Graphic from Designing Enterprise Applications with the Java 2 Platform, Enterprise Edition, Nicholas Kassem et al., October 2000 3 December 2013

© Offutt

8

4

Web Application Design Complexity Complexity HTML Pages

Basic JSPs and Servlets

JSPs with Modular Components

Design frameworks with Modular Components and Enterprise beans

HTML pages

HTML pages JSPs servlets

HTML pages JSPs servlets JavaBeans components custom tags

HTML pages JSPs servlets JavaBeans components custom tags templates enterprise beans

SWE 642

Graphic from Designing Enterprise Applications with the Java 2 Platform, Enterprise Edition, Nicholas Kassem et al., October 2000 3 December 2013

© Offutt

9

Common Design Mistakes • No design specifications and no comments in code • Overly limiting collaboration amongst the development team — only 1-2 people understanding and owning the d i design • Coding for future requirements – Don’t code ahead—requirements will always be different – Instead, use a flexible design • Choosing a design framework that is too complicated – Then making it worse by only using part of the framework

• Using the “be lazy” parts of agile processes without using the “do it better” parts 3 December 2013

© Offutt

10

5

Best Practices • Establish a Software Requirements Baseline • Create design specifications • Use Java Doc • Train all of the development team on the design patterns and design constructs selected for the application, especially the connection points between tiers – 30 minute rule—every person can explain design in 30 minutes

• Design/develop adaptable systems, using object-oriented principles • Use meaningful package, class, method, and variable names 3 December 2013

© Offutt

11

Web Application Design Summary • SWE 642 teaches the basics, but only scratches the surface of designing web applications • SWE 642 gives i a solid lid grounding, di but b t your knowledge k l d is i far from complete • Dozens of design frameworks are available to help build better web applications – Be sure to learn the concepts, not just the syntax !

• Practitioners and educators are learning more every day • The web changes every aspect of software engineering

3 December 2013

© Offutt

12

6