web application architectures - sti innsbruck › sites › default › files › ... · web...
TRANSCRIPT
![Page 1: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/1.jpg)
1© Copyright 2013 Ioan Toma, Srdjan Komazec, Nelia Lasierra
Web Engineering
Web ApplicationArchitectures
![Page 2: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/2.jpg)
2
Where we are?
# Date Title
1 5th March Web Engineering Introduction and Overview
2 12th March Requirements Engineering for Web Applications
3 19th March Web Application Modeling
4 26th March Web Application Architectures
5 16th April Developing Applications with WebML
6 23rd April Testing and Usability
7 30th April Web Technologies I
8 7th May Web Technologies II
9 21th May Web Application Development Process
10 28th May Project Management for Web Applications
11 11th June Web Application Security
12 18th June Mobile Application Development
13 25th June Final Exam
![Page 3: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/3.jpg)
3
Where we are?
# Date Title
1 5th March Web Engineering Introduction and Overview
2 12th March Requirements Engineering for Web Applications
3 19th March Web Application Modeling
4 26th March Web Application Architectures
5 16th April ------
6 23rd April Developing Applications with WebMLTesting and Usability
7 30th April Web Technologies I
8 7th May Web Technologies II
9 21th May Web Application Development Process
10 28th May Project Management for Web Applications
11 11th June Web Application Security
12 18th June Mobile Application Development
13 25th June Final Exam
![Page 4: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/4.jpg)
4
Overview
• Web Application Architectures– Introduction
• Software architectures• Architectures development• Patterns and frameworks• Specifics of Web applications
– Web Application Architectures• Architecture types• MVC, Client-Server, N-Layer, JSP Model 1 and 2, Apache Struts
• Summary
![Page 5: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/5.jpg)
5
INTRODUCTIONWhat is an architecture?
![Page 6: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/6.jpg)
6
Software Architectures
• “Architecture is defined [...] as the fundamental organization of a system, embodied in its components, their relationships to each other and the environment, and the principles governing its design and evolution.”(IEEE Architecture Working Group, P1471, 1999)
• Architectures describe structure– Components of software systems, their interfaces and relationships– Static as well as dynamic aspects– Blueprint of software system
• Architectures connect software development phases– Requirements mapped iteratively to components and their relationships
![Page 7: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/7.jpg)
7
Software Architectures
• “Architecture is the set of design decisions [...] that keeps its implementers and maintainers from exercising needless creativity.”(Desmond F. D’Souza and Alan C. Wills, 1999)
• Architectures describe different viewpoints– conceptual view: entities of application domain and their relationships– process view: system runs, concurrency, synchronization– implementation view: software artifacts (subsystems, components, source code)– runtime view: components at runtime and their communication
• Architectures make systems comprehensible and controllable– structuring according to different viewpoints– enables communication between different stakeholders
![Page 8: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/8.jpg)
8
Developing ArchitecturesInfluences on Architectures
Architecture
Functional Requirements• Clients• Users• Other Stakeholders
Non-Functional Requirements• Performance• Scalability• Reusability• Other?
![Page 9: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/9.jpg)
9
Developing ArchitecturesInfluences on Architectures
Technical Aspects• Operating System• Middleware• Legacy Systems• Other?
Architecture
Experience with• Existing Architecture• Patterns• Project Management• Other?
![Page 10: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/10.jpg)
10
Developing Architectures
• Remember, requirements are always subject to change– Organizational & environment changes– Ambiguous requirements initially
• Thus, iterative approaches are the suggested means of development– Pro: Helps to mitigate design risks– Caution: Doesn’t guarantee a good architecture
![Page 11: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/11.jpg)
11
Patterns & Frameworks
• Patterns describe recurring design problems
• 3 types of patterns– Architecture patterns (e.g. MVC)– Design patterns (e.g. Publisher-Subscriber)– Idioms (e.g. Counted-Pointer in C++)
• They are a guideline, implementation must be grounded to the specific problem
• Patterns need to be “integrated” amongst each other!
![Page 12: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/12.jpg)
12
Patterns & Frameworks
• Frameworks: another option to reuse existing architecture– Something that provides you a frame to be filled!
• Reuse of existing software objects that just need to be properly configured
• Bound to a specific technology– Require training– High cost of switch– Level of customization not always acceptable
• Together with design patterns – help to improve software quality – reduce development time
![Page 13: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/13.jpg)
13
Model View Controller
• Architectural Pattern from Smalltalk (1979)– Architectural pattern for user interfaces
• Decouples data and presentation• Divides the application into 3 interconnected parts• Express a solution to be adopted in each system• Eases the development• Independent of any technology
![Page 14: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/14.jpg)
14
Model View Controller
• This design pattern separate the concerns of the application: modelling, presentation and actions:
• Model– Deals with the data itself of the application and the captures the behaviour– Directly manages the data and the rules (logic to process the data)
• View – Deals with the visualization of the data– Gets the data from the model and present to the user
• Controller– Handles the actions/input from the user– Acts on both the model and the view– Control the data flow takes the input from the view and passes it to the model
through the adequate action
![Page 15: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/15.jpg)
15
Model View Controller
• Model– encapsulate application state– responds to state queries– exposes application functionality– notifies views of changes
• View– renders the models– requests updates from models– sends user interaction to controller– allows controller to select view
• Controller– defines application behavior– maps user actions to model updates– selects view for response– one for each functionality
Generic MVC Structure, courtesy of Sun
![Page 16: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/16.jpg)
16
Specifics of Web apps
• High quality demands– Security– Extensibility– Adaptability– Stability– Performance
• Broad range of technical solutions that can be integrated. – Hard to evaluate quality demands (various components)– Hard to solve (where is the problem?)
![Page 17: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/17.jpg)
17
Specifics of Web apps
• Inhomogeneity and immaturity of technical solutions– Fast product lifecycles– Many components: open source – quality? – Lack of standards
• Global requirements– Multi linguality– Cultural adaptation?
• E.g. Google for Korea
![Page 18: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/18.jpg)
18
WEB APPLICATION ARCHITECTURES
![Page 19: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/19.jpg)
19
Architecture Types
• Layering Aspect– “Separation of concerns”– How many concurrent users are you serving?– Shared needs among multiple applications? (e.g., security)
• Data Aspect– What kind(s) of data are you delivering?
• Structured vs. non-structured• On-demand vs. real-time
– What are the bandwidth requirements?• Size & nature of data• Again, audience concerns
![Page 20: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/20.jpg)
20
Architecture Types
• Web Platform Architecture (WPA)– Platform = Infrastructure
• Hardware• Software modules & configurations• Choice of software platform (e.g., J2EE, .NET)
• Web Application Architecture (WAA)– Conceptual view of how key business processes and needs are separated &
implemented– Often domain-specific– Greater complexity requires greater modularity
![Page 21: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/21.jpg)
21
Generic Web (Platform) Architecture
• A web platform includes the software & hardware modules on top of which the web application is going to be built.
• These modules offer a set of services (or “capabilities”) that are going to be used by the web application.
• Network/Communication capabilities TC/IP (Internet) and HTTP • Data store capabilities Database• Visualization capabilities e.g. show graphically the information• Logic execution capabilities
• A web “platform” is based on:– TCP/IP– HTTP– HTML
![Page 22: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/22.jpg)
22
Generic Web (Platform) Architecture
• It’s essentially a Client/Server architecture!– In term of patterns one of the simplest ones
Client
Web Server
request
response
HTTP(s)TCPIP
Physical Layer
HTTP(s)TCPIP
Physical LayerIP
Physical Layer
![Page 23: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/23.jpg)
23
Generic Web (Platform) Architecture
• But still things can get complex…– Components on the network (firewall, proxy, load balancer)– Components in the intranet (Web server, application server, data base, legacy
systems, web services)
Web Server
firewallclient
proxy
![Page 24: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/24.jpg)
24
Example of a WAA
Web Application
Presentation Business Logic Data Management
Personalization Security Search
![Page 25: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/25.jpg)
25
Platform vs application architecture
Image taken from: Guide to Web Application and Platform ArchitecturesBy Ilia Petrov, Christian Meiler, Udo Mayer
https://books.google.at/books?id=Ajn-nP7IdRQC&pg=PA28&lpg=PA28&dq=web+platform+architecture&source=bl&ots=GmSoxC_oyY&sig=AzVXag6gnUiMRk7ZRfRAP6PHv2c&hl=en&sa=X&ei=Zs8SVdXeCsbqUufNgrAM&ved=0CEUQ6AEwBg#v=onepage&q=web%20platform%20architecture&f=false
![Page 26: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/26.jpg)
26
N-tier/layer Architectures
• N-tier/layer architectures– Separate components according to different layers/tiers:
• Presentation: user interaction with the system• Logic: core functionality of the system• Data: access to the data to be used in the system
– This separation can be:• Tiers : physical separation• N-tier architectures:
– 2-tier architecture: client/server – 3-tier architecture: client-server-dataserver
• Layers : logical separation– Layers group the software components that make up the application or service.– These layers may be located on the same physical tier, or may be located on separate tiers.– 3 – layer architecture:
» Presentation» Logic» Data
![Page 27: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/27.jpg)
27
Client/Server (2-Layer)
Client
Web/App Server
Database
Services
Dynamic HTMLStatic HTML
Client
Server
![Page 28: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/28.jpg)
28
N-Layer Architectures
Client
Application Server(Business Logic, Connectors,Personalization, Data Access)
Presentation Layer
Firewall
Proxy
Web Server
DBMS B2B
Backend(Legacy Application,
Enterprise Info System)
Business Layer
Data Layer
![Page 29: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/29.jpg)
29
Why an N-Layer Architecture?
• Separating services in business layer promotes re-use among applications
– Loose-coupling – changes reduce impact on overall system.– More maintainable (in terms of code)– More extensible (modular)
• Trade-offs– Needless complexity– More points of failure
![Page 30: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/30.jpg)
30
JSP-Model-1 Architecture
http://www.java-samples.com/showtutorial.php?tutorialid=349
- Easier way to deploy a JSP based web site.- Some separation between content (Model JavaBeans) and presentation (JSP). - This architecture is good enough for small applications.- Larger applications have a lot of presentation logic increase of code in the JSP
JSPJava
Beans
1 2 3
4
browser sends request
response
Access model and invoke business logic
Connects to the datastore and get/save data
![Page 31: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/31.jpg)
31
JSP-Model-1 Architecture
• Advantages:– Easy and quick development
• Disadvantages:– Navigation control is decentralized– Time consuming– Hard to extend
http://www.javatpoint.com/model-1-and-model-2-mvc-architecture
![Page 32: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/32.jpg)
32
Model-View-Controller 2 (MVC 2)
• Adaptation of MVC for the Web
– Model 2 (Sun) MVC architecture for Web-based applications– stateless connection between the client and the server– notification of view changes– re-querying the server to discover modification of application’s state
![Page 33: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/33.jpg)
33
1) HTTP requests are passed from the client to the Controller 2) The Controller updates the Model (for the selection of the appropriate action)3) Then invokes the controller decides on the appropriate view according to the
last action and the output.4) The appropriate view is shown to the users
Model-View-Controller 2 (MVC 2)
Image from : http://www.9lessons.info/2011/02/getting-start-with-ruby-on-rails.html
![Page 34: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/34.jpg)
34
JSP-Model-2 Architecture
http://kb.deister.net/index.php/JSP_Acces_Models
(Controller)Servlet
(View)JSP
ModelJava Bean
12
3
45
request
response
instantiate
1. user request2. create/change model3. create/change view4. generate output5. server response
![Page 35: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/35.jpg)
35
Frameworks
• Web application frameworks based on MVC– Struts 1 and Struts 2
• Strut 1: – Action servlet, action, action form, jsp
» Ex: http://www.javaguru.biz/struts1-framework-architecture/– Struts.xml, web.xml
• Strut 2: – Actions, Interceptors …
» Ex: http://www.tutorialspoint.com/struts_2/struts_architecture.htm
– Ruby on Rails» Ex: http://www.9lessons.info/2011/02/getting-start-with-ruby-on-rails.html
(*) Worth to take a look to …http://hibernate.org/ :Provides a framework for mapping an object oriented domain model to a traditional relational database.
Spring: https://spring.io/guides
![Page 36: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/36.jpg)
36
JSP-Model-2 Architecture
• Advantages:– Navigation control is centralized.– Easy to maintain– Easy to extend– Easy to test– Better separation of concerns
• Disadvantages:– You need to write the controller code
http://www.javatpoint.com/model-1-and-model-2-mvc-architecture
![Page 37: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/37.jpg)
37
Apache Struts Architecture
Enhances the JSP model 21. user request2. forwarding to controller3. Selecting model in form of Java bean4. Selecting view to represent contents5. generate output6. server response http://struts.apache.org/
![Page 38: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/38.jpg)
38
WRAP-UP
![Page 39: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/39.jpg)
39
Things to keep in mind(or summary)
• Good design of architecture is crucial
• You can leverage on patterns and frameworks– Both have advantages and disadvantages
• Design is constrained on Web “infrastructure”
• MVC is the most commonly used pattern
![Page 40: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/40.jpg)
40
Bibliography
• Mandatory reading– Kappel, G., Proll, B. Reich, S. & Retschitzegger, W. (2006). Web Engineering, Wiley &
Sons. 4th Chapter
• Web links– Model-View-Controller pattern http://en.wikipedia.org/wiki/Model-View-Controller
![Page 41: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/41.jpg)
41
Next Lecture
# Date Title
1 5th March Web Engineering Introduction and Overview
2 12th March Requirements Engineering for Web Applications
3 19th March Web Application Modeling
4 26th March Web Application Architectures
5 16th April ------
6 23rd April Developing Applications with WebMLTesting and Usability
7 30th April Web Technologies I
8 7th May Web Technologies II
9 21th May Web Application Development Process
10 28th May Project Management for Web Applications
11 11th June Web Application Security
12 18th June Mobile Application Development
13 25th June Final Exam
![Page 42: Web Application Architectures - STI Innsbruck › sites › default › files › ... · Web Engineering Introduction and Overview: 2. 12. th. March](https://reader034.vdocument.in/reader034/viewer/2022042321/5f0b88837e708231d430fc43/html5/thumbnails/42.jpg)
42
Questions?