1

Web Applications
and Frameworks
By Joscelyn Dias
Outline
Web Application
Frameworks
Web Application Frameworks
MVC Architecture
Rich Internet Applications
Web application (Web-app)
Application accessed via web browser
Over Internet / Intranets networks
Web browser as thin client
Eg. Webmail, Auction sites
2-tier to n-tier structured architecture
Tier 1 Presentation : Web browser
Tier 2 Middle/Application logic
CGI, PHP, JSP/Java, ASP, .NET, Coldfusion
Tier 3 Storage : Database
N-tiers : business logic, integration
Web Applications features
Greatly reduced upgrade of user machines
Negligible installation (User downloadable,
easily available, self installable) software on
user machines
Assets all reside in corporate servers, under IT
control.
Updates to systems easily coordinated.
Standards compliance
Reliance on files accessed from remote servers
Software Frameworks
Common code provides generic functionality
Users (programmers) code provides specific,
customized functionality
By selectively Specializing, Overriding
Program's flow of control dictated by framework
Inversion of control : In software libraries dictated by
caller
Frozen/Fixed spots:
basic components and relationships
Hot/Change spots:
Add code/functionality, use framework for their
projects
Web application frameworks
Frameworks designed for support of development of
application on the web like dynamic websites and web-
services.
Advent of Web Apps, Rapid Application Development,
GUIs, Toolkit/Application frameworks
Common web development activities
Libraries for database access : variety of DBs with no
code changes, connection pooling, object mapping
Templates: Distinguish between static and dynamic part
of web pages for various situations
Security: Authentication and authorization frameworks
Session management
Technologies : JavaEE, Eclipse, .Net,
App-on-app : Joomla! Content mgmt. framework
2
Web Application Frameworks
+ves
Facilitates RAD, Saves time working the lower
levels
Programmer defines high-level description of the
program Designers/programmer focus on
software requirements, business problems
Make code simpler, Reduce program errors
Use of best practices
-ves
Frameworks may bloat the code
One has to learn to use the framework.
Model-View-Controller
Architectural / Design pattern
Model represents information/data
View elements of the user interface
Controller manages the communication
of data, business rules used to manipulate
the data to and from the model
MVC Control Flow
1. The user interacts with the user interface in some way
(for example, presses a mouse button).
2. The controller handles the input event from the user
interface, often via a registered handler or callback.
3. The controller notifies the model of the user action,
possibly resulting in a change in the model's state. (for
example, the controller updates the user's shopping cart)
4. A view uses the model indirectly to generate an
appropriate user interface (for example, the view lists the
shopping cart's contents). The view gets its own data
from the model. The model and controller have no direct
knowledge of the view.
5. The user interface waits for further user interactions,
which restarts the cycle.
MVC features
Used correctly it separates business logic from
user interface
Modify either application UI or underlying
business rules without affecting the other.
Eg: JavaEE as a combined framework
Model
Java classes; application to store, move data
View
JSP pages; data transported to page in
HttpServletRequest, HttpSession
Controller
Servlet communicates with View
Loads HttpServletRequest/HttpSession with appropriate
data, Forwards HttpServletRequest/Response to the
JSP using a RequestDispatcher.
MVC Architectural Description
Model - The model represents enterprise data and the business rules that
govern access to and updates of this data. Often the model serves as a
software approximation to a real-world process, so simple real-world
modeling techniques apply when defining the model.
View -The view renders the contents of a model. It accesses enterprise data
through the model and specifies how that data should be presented. It is the
view's responsibility to maintain consistency in its presentation when the
model changes. This can be achieved by using a push model, where the
view registers itself with the model for change notifications, or a pull model,
where the view is responsible for calling the model when it needs to retrieve
the most current data.
Controller - The controller translates interactions with the view into actions
to be performed by the model. In a stand-alone GUI client, user interactions
could be button clicks or menu selections. The actions performed by the
model include activating business processes or changing the state of the
model. Based on the user interactions and the outcome of the model
actions, the controller responds by selecting an appropriate view.
3
AJAX
Asynchronous JavaScript and XML
Group of interrelated web technologies
Web applications can retrieve data from the server
asynchronously in the background without interfering
with the display and behavior of the existing page.
Result: more responsive feel web applications.
Methodology
Web pages by exchanging small amounts of data with
the server behind the scenes,
Entire web page not reloaded each time the user
requests a change.
Result : increase the web page's interactivity, speed, and
usability.
AJAX
Group of interrelated web technologies
XHTML, CSS for presentation
DOM for dynamic display of and interaction with data
XMLHttpRequest object for asynchronous communication
XML for the interchange, XSLT manipulation and display of data,
JavaScript to bring above technologies together
Today
JavaScript can be replaced by VBScript
XML/XSLT use not actually required
JavaScript Object Notation (JSON) can be used
Requests need not necessarily be asynchronous.
Standards still in progress at W3C
AJAX
Group of interrelated web technologies
XHTML, CSS for presentation
DOM for dynamic display of and interaction with data
XMLHttpRequest object for asynchronous communication
XML for the interchange, XSLT manipulation and display of data,
JavaScript to bring above technologies together
Today
JavaScript or VBScript
XML/XSLT use not actually required
JavaScript Object Notation (JSON) can be used
Requests need not necessarily be asynchronous.
Rich Internet Applications
Web-apps with richness of interfaces, media,
content
Thick client characteristics similar to desktop,
client-server applications
Greater programmer control over UI
Alternative to Web-apps termed as Rich Internet
Application (RIA).
Delivered via proprietary web-browser plug-ins
With most web browsers support plug-ins
Newer web standards like HTML 5 and AJAX
have provided for full-fledged application
platform which could be run outside browser too
RIA Features and Issues
Features Richness: with native browser support
RIA framework installation required before
execution
RIA can then be downloaded, verified, updated
Increased user experience : Advanced
communications with optimized network
protocols, asynchronous I/O
Reliable broadband Internet connections
Deployment, design development more complex
than web-apps
As complex as desktop apps
RIA Technologies
JavaFx
Uses Java components, over JRE and JavaME
Apps across connected devices like desktops,
mobiles, browsers
Integrate with desktop: Drag-to-install feature.
MS Silverlight
Uses web browser plug-in
Support for .NET CLR languages and development
tools
Programmable for animation, graphics and audio-
video playback