Transcript WebApplicationDesign

Web Application Design
Web Application Design
• Data
– What data is available?
– How do we store it or how is it stored in
the DB?
• Schema
• Data types
• Etc.
– Where is the data?
Web Application Design
• Define Use cases
– What are the use cases?
– What services are provided for each use case?
• Define generic and specific services
– Accomplish tasks of use cases
• Define flow through use cases
– Not pages, just flow of operations
– Also flow of data
• This stage may force changes in data
Web Application Design
• Organize flow through use cases into pages
– Be sensible, follow good examples
• Remember front controller design
– Access to pages should flow through front controllers
– Front controllers should
• Determine use
• Do any necessary filtering
• pass necessary arguments to view
• Design exception handling
– Part of normal flow
Web Application Design
• Look and feel
– Define a consistent look and feel
– Banners, contents, etc.
• All views
– Based on one view
– Include appropriate elements
• Using info from front controller
QuickTime™ and a
TIFF (Uncompressed) decompressor
are needed to see this picture.
Web Application Design
• Design Data Access Objects
– Contain all database interaction
• Keep View and Controller as separate as
possible
– Design functions that interact with controller
– View contains as little code as possible
• Function calls, etc.
– Keep code away from web designer
Design Document
• Data Definition
– Database schema
– Data description
• Use Cases
– Definition & Description
• Controller Functionality and API
– Define interface to Data (Data Access Object)
– Define interface to Views
• View & Data Flow
– Define necessary page elements
– Define data flow through pages
– Define AJAX elements
• Layout
Project
• Team Building & Psychology Website
• Users take Personality Quizzes that
are analyzed and then suggestions are
made to team supervisors and users
to improve team relationships, etc.
Data Definition
• Database Schema
– Quiz Answers
• uid, specializer, harmonizer, organizer, and analyzer
– Users
• uid, name, password, address, company, and whether or not this UID
has administrative privileges.
– Analyses
• uid, analysis
• Describe each
–
–
–
–
More detail
Type,
purpose,
use, etc.
+------------+--------------+------+-----+---------+----------------+
| Field
| Type
| Null | Key | Default | Extra
|
+------------+--------------+------+-----+---------+----------------+
| id
| int(11)
| NO
| PRI | NULL
| auto_increment |
| username
| varchar(255) | YES |
| NULL
|
|
| password
| varchar(255) | YES |
| NULL
|
|
| name
| varchar(255) | YES |
| NULL
|
|
| address
| varchar(255) | YES |
| NULL
|
|
| phone
| varchar(255) | YES |
| NULL
|
|
| company
| varchar(255) | YES |
| NULL
|
|
| department | varchar(255) | YES |
| NULL
|
|
| role
| varchar(255) | YES |
| NULL
|
|
+------------+--------------+------+-----+---------+----------------+
Use Cases
• Administrative Use Case
• Do Analysis
– List users that need analysis
– Record analysis
• Manage Users
– Add, Modify, Delete Users
• Registered User Case
• Take Quiz
• See resulting analysis (upon later login)
• See group members analysis if group admin
• Guest User
• Register
Controller Functionality & API
• Data Access Object
–
–
–
–
getAnalysisList
getUsers
updateUser
recordAnalysis
Define full calls
parameters, etc.
• Front Controllers
– Administrator
• Assure login as admin
– User
• Assure login
• Next View
• State always contains userid, role, page id and link id
= AJAX
View & Data Flow
Login
Logged In?
No
Menu
Username
Passwd
LoginMessage
UserRole = ?
Home Page
Yes
About Us
Take Quiz
View Analysis
Admin Users
Do Analysis
Session Info
UserID
UserRole
Page
Link
Quiz1 Ans
Quiz2 Ans
Quiz3 Ans
Registration
Username
Passwd
Name, Address, Etc.
Admin Menu
Admin Users
Do Analysis
User Menu
Take Quiz
View Analysis
Guest Menu
Register
Quiz1
Quiz2
Quiz3
Layout