34
2 December 2005 Web Information Systems Web Application Frameworks Prof. Beat Signer Department of Computer Science Vrije Universiteit Brussel http://www.beatsigner.com

Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Embed Size (px)

DESCRIPTION

This lecture is part of a Web Information Systems course given at the Vrije Universiteit Brussel.

Citation preview

Page 1: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

2 December 2005

Web Information SystemsWeb Application Frameworks

Prof. Beat Signer

Department of Computer Science

Vrije Universiteit Brussel

http://www.beatsigner.com

Page 2: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 2October 24, 2014

Web Application Frameworks

There exist dozens of web application frameworks!

A web application framework is a software framework that

is designed to support the development of dynamic web-

sites, web applications, web services and web resources.

The framework aims to alleviate the overhead associated

with common activities performed in web development.

For example, many frameworks provide libraries for

database access, templating frameworks and session

management, and they often promote code reuse.[http://en.wikipedia.org/wiki/Web_application_framework]

Page 3: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 3October 24, 2014

Web Application Frameworks ...

A web application framework offers libraries and

tools to deal with web application issues template libraries, session management, database access

libraries etc.

Some frameworks also offer an abstraction from the

underlying enabling technologies e.g. automatic creation of Java Servlets

Many frameworks follow the Model-View-Controller

(MVC) design pattern no mix of application logic and view (e.g. not like in JSP)

increases modularity and reusability

Lead to a faster and more robust development process

Page 4: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 4October 24, 2014

Model-View-Controller (MVC)

Model data (state) and business logic

multiple views can be defined for a single model

when the state of a model changes, its views are notified

View renders the data of the model

notifies the controller about changes

Controller processes interactions with the view

transforms view interactions intooperations on the model (statemodification)

Model

Controller

View

notifies

modifies

state

selects view

notifies

gets

state

Page 5: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 5October 24, 2014

Apache Struts 2

Free open source framework for creating enterprise-

ready Java-based web applications

Action-based MVC Model 2 (Pull MVC) framework

combining Java Servlets and JSP technology model

- action (basic building blocks) from which the view can pull information via the

ValueStack

- action represented by POJO (Plain Old Java Object) following the JavaBean

paradigm and optional helper classes

view

- template-based approach often based on JavaServer Pages (JSP) in

combination with tag libraries (collection of custom tags)

controller

- based on Java Servlet filter in combination with interceptors

Page 6: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 6October 24, 2014

MVC Model 2 (MVC 2) in Struts 2

Model

POJOs

Database

Controller

Servlet

View

e.g. JSP

Browser

1

2

3

4

5

6

Page 7: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 7October 24, 2014

Apache Struts 2 Architecture

Servlet request standard filter chain

- interception of requests and

responses

- reusable modular units

- e.g. XSLT transformation

StrutsPrepareAndExecute

Filter consults controller(ActionMapper)

ActionProxy is called if

action has to be executed consult Configuration-Manager

create ActionInvocation[http://struts.apache.org/2.1.6/docs/big-picture.html]

Page 8: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 8October 24, 2014

Apache Struts 2 Architecture ...

invoke any interceptors (controller) before Action

Action class updates the model

ActionInvocation does

a lookup for the Result based on Action result code

mappings in struts.xml

Result execution (view) often based on JSP template

interceptors in reverse order

Send response again through filter chain

[http://struts.apache.org/2.1.6/docs/big-picture.html]

Page 9: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 9October 24, 2014

Apache Struts 2

ValueStack temporary objects, Action objects, ...

access from JSP via Object Graph Navigational Language (OGNL)

Multiple view alternatives JSP, XSLT, Velocity, ...

Simplifies web development convention over configuration

intelligent default values reduce the size of configuration files

fosters modularity and loose coupling (dependency injection)

standard development process for Struts 2 web applications

Requires no changes to the servlet container regular servlet application

Page 10: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 10October 24, 2014

Apache Struts 2 web.xml

<web-app id="WebApp1" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://java.sun.com/xml/ns/j2eehttp://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

<filter><filter-name>struts</filter-name><filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter </filter-class>

<init-param><param-name>actionPackages</param-name><param-value>be.ac.vub.wise</param-value></init-param></filter>

<filter-mapping><filter-name>struts</filter-name><url-pattern>/*</url-pattern></filter-mapping>

<taglib><taglib-uri>/WEB-INF/struts-bean.tld</taglib-uri><taglib-location>/WEB-INF/struts-bean.tld</taglib-location></taglib>...</web-app>

Page 11: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 11October 24, 2014

Tag Libraries

Introduced to encapsulate reusable Java objects in JSP provide access to methods on objects

Apache Struts 2 offers four different libraries HTML

- e.g. buttons, form fields, ...

Template

- tags that are useful for creating dynamic JSP templates

Bean

- e.g. definitions, parameters, ...

Logic

- e.g. comparisons, ...

Page 12: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 12October 24, 2014

Apache Struts 2 Hello World Example

<%@ taglib prefix="s" uri="/struts-tags" %><html><head><title>Hello World</title></head><body><h1><s:property value="message"/></h1><p>Time: <b><s:property value="currentTime" /></b></p></body></html>

HelloWorld.jsp

Page 13: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 13October 24, 2014

Apache Struts 2 Hello World Example ...

package be.ac.vub.wise;import com.opensymphony.xwork2.ActionSupport;import java.util.Date;

public class HelloWorldImpl extends ActionSupport {public static final String MESSAGE = "Hello World!";public static final String SUCCESS = "success";private String message;

public String execute() throws Exception {setMessage(MESSAGE);return SUCCESS;}

public void setMessage(String message){this.message = message;}

public String getMessage() {return message;}

public String getCurrentTime(){return new Date().toString();}} HelloWorldImpl.java

Page 14: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 14October 24, 2014

Apache Struts 2 Hello World Example ...

Execute the Hello World example by sending request to http://localhost:8080/wise/HelloWorld.action

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN""http://struts.apache.org/dtds/struts-2.0.dtd">

<struts><constant name="struts.enable.DynamicMethodInvocation" value="false"/><constant name="struts.devMode" value="true"/>

<package name="be.ac.vub.wise" namespace="/wise" extends="struts-default"><action name="HelloWorld" class="be.ac.vub.wise.HelloWorldImpl"><result>/pages/HelloWorld.jsp</result></action>...</package>...</struts>

struts.xml

Page 15: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 15October 24, 2014

Spring Framework

Java application framework

Various extensions for web applications

Modules model-view-controller

data access

inversion of control container

convention-over-configuration

remote access framework

transaction management

authentication and authorisation

Page 16: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 16October 24, 2014

Apache Flex

Software development kit for cross-platform

Rich Internet Applications (RIAs) based on Adobe Flash

Main components Adobe Flash Player runtime environment

Flex SDK (free)

- compiler and debugger, the Flex framework and user interface components

Adobe Flash Builder (commercial)

- Eclipse plug-in with MXML compiler and debugger

Separation of user interface and data user interface described in MXML markup language in

combination with ActionScript

- compiled into flash executable (SWF flash movie)

Page 17: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 17October 24, 2014

Apache Flex ...

Flex framework offers various actions e.g. HTTPRequest component

Flex applications can also be deployed as desktop

applications via Adobe AIR (Adobe Integrated Runtime)<?xml version="1.0" encoding="UTF-8" ?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal"><mx:Script><![CDATA[ import mx.controls.Alert;

private function sayHello():void { Alert.show("Hello " + user.text);} ]]></mx:Script>

<mx:Label fontSize="12" text="Name: " /><mx:TextInput id="user" /><mx:Button label="Go" click="sayHello()" /></mx:Application>

HelloWorld.mxml

Page 18: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 18October 24, 2014

Microsoft Silverlight

Microsoft's platform for Rich Internet Applications competitor to Adobe Flash

Runtime requires a browser plug-in Internet Explorer, Firefox, Safari and Google Chrome

Silverlight Core Common Language Runtime (CoreCLR)

A Silverlight application consists of CreateSilverlight.js and Silverlight.js

- initialise the browser plug-in

user interface described in the Extensible Application Markup Language (XAML)

- XAML files are not compiled indexable by search engines

code-behind file containing the program logic

Page 19: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 19October 24, 2014

Microsoft Silverlight ...

Programming based on a subset of the .NET Framework

Silverlight introduces a set of features including LocalConnection API

- asynchronous messaging between multiple applications on the same machine

out-of-browser experiences

- locally installed application that runs out-of-the-browser (OOB apps)

- cross-platform with Windows/Mac

microphone and Web cam support

Two types of Silverlight web requests WebClient class

- OpenReadAsync (for streaming), DownloadStringAsync as well as uploads

WebRequest

- register an asynchronous callback handler (based on HttpWebRequest)

Page 20: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 20October 24, 2014

OpenLaszlo

Open source RIA platform

Two main components LZX programming language

- XML and JavaScript

- similar to MXML and XAML

OpenLaszlo Server

The Open Laszlo Server compiles LZX applications into

different possible runtime components Java Servlets

binary SWF files

DHTML (HTML, DOM, JavaScript and CSS)

Page 21: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 21October 24, 2014

Ruby on Rails (RoR)

Open source web application framework

Combination of dynamic, reflective, object-oriented programming language Ruby

- combination of Perl-inspired syntax with "Smalltalk features"

web application framework Rails

Based on MVC architectural pattern structure of a webpage separated from its functionality via the

unobtrusive JavaScript technique

The scaffolding feature offered by Rails can

automatically generate some of the models and views

that are required for a website developer has to run an external command to generate the code

Page 22: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 22October 24, 2014

Ruby on Rails (RoR) ...

Ruby on Rails Philosophy Don't Repeat Yourself (DRY)

- information should not be stored redundantly (e.g. do not store information in

configuration files if the data can be automatically derived by the system)

Convention over Configuration (CoC)

- programmer only has to specify unconventional application settings

- naming conventions to automatically map classes to database tables (e.g. by

default a 'Sale' model class is mapped to the 'sales' database table)

Page 23: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 23October 24, 2014

Video: Ruby on Rails

http://media.rubyonrails.org/video/rails_blog_2.mov

Page 24: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 24October 24, 2014

Yii Framework

PHP framework for the development of Web 2.0

applications that offers a rich set of features AJAX-enabled widgets

web service integration

authentication and authorisation

flexible presentation via skins and themes

Data Access Objects (DAO) interface to transparently access different database management systems

integration with the jQuery JavaScript library

layered caching

...

Page 25: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 25October 24, 2014

Zend

Open source PHP framework offering various features MVC architectural pattern

loosely coupled components

object orientation

flexible caching

Simple Cloud API

features to deal with emails (POP3, IMAP4, …)

Page 26: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 26October 24, 2014

CakePHP

Open source PHP web application framework MVC architectural pattern

rapid prototyping via scaffolding

authentication

localisation

session management

caching

validation

Page 27: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 27October 24, 2014

Node.js

Server-side JavaScript handling post/get requests, database, sessions, …

Write your entire app in one language

Built-in web server (no need for Apache, Tomcat, etc.)

High modularity plug-ins can be added for desired server-side functionality

Other more powerful frameworks such as Express.js

build on top of Node.js

Page 28: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 28October 24, 2014

Django

Open source Python web application framework MVC architectural pattern

don't repeat yourself (DRY)

object-relational mapper

- mapping between model (Python classes) and a relational database

integrated lightweight web server

localisation

caching

...

Page 29: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 29October 24, 2014

Web Content Management Systems

Content management systems that focus on web content

Main functionality data storage and publishing, user management (including access

rights), versioning, workflows

Offline (create static webpages), online (create

webpages on the fly) and hybrid systems

Often some kind of server-side caching

Suited for non-technical users since the underlying

technology is normally completely hidden

Web CMS Examples Joomla, Drupal, ...

Page 30: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 30October 24, 2014

Exercise 5

Web Application Frameworks implementation of a Struts 2 application

Page 31: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 31October 24, 2014

References

Struts 2 Quick Guide http://www.tutorialspoint.com/struts_2/struts_quick_guide.htm

Apache Struts 2 http://struts.apache.org/2.x/

Ian Roughley, Struts 2 http://refcardz.dzone.com/refcardz/struts2

Spring Framework http://www.springsource.org

Apache Flex http://flex.org

Page 32: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 32October 24, 2014

References ...

Microsoft Silverlight http://www.microsoft.com/silverlight/

http://silverlight.net/learn/videos/silverlight-videos/net-ria-services-intro/

Open Laszlo http://www.openlaszlo.org

Ruby on Rails Video: Creating a Weblog in 15 Minutes http://www.youtube.com/watch?v=tUH1hewXnC0

Yii Framework http://www.yiiframework.com

Zend Framework http://framework.zend.com

Page 33: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

Beat Signer - Department of Computer Science - [email protected] 33October 24, 2014

References ...

CakePHP http://cakephp.org

Node.js http://nodejs.org

Django https://www.djangoproject.com

Comparision of Web Application Frameworks http://en.wikipedia.org/wiki/Comparison_of_web_application_frameworks

Page 34: Web Application Frameworks - Lecture 05 - Web Information Systems (4011474FNR)

2 December 2005

Next LectureWeb 2.0 Basics