TIE-13100 / TIE-13106 Tietotekniikan projektityö / Project Work on Pervasive Systems

Architecture Workshop

Hadaytullah

Marko Leppänen

21.10.2014

Workshop Plan

Technologies Table

(Collaboration)

Workshop Groups

Warm-up Thoughts

(Presentation)

Questions For Each Workshop

Group

Open Discussion

Workshop Start

End

What is software architecture and why it is important?

Architectural Specification

An abstract view of the system

Communication

Work Distribution

Pre-Dev. Testing

Analysis

Logical View

Development View

Process View

Physical View

Scenarios or Use cases

Architecting in Real

Logical View

Development View

Process View

Physical View

Functional Goals

Non-Functional

Goals

D

D

D

D

Decisions

D

D

D

Goals Architecture

Cross-cutting concerns A

rchite

cture

Freedom of choice?

• Dictators

– Frameworks (Web Frameworks)

– Eco System (iOS MVC, Delegate, Protocol, Singleton)

– Technologies (AngularJMVC)

– Organization of Team

Evaluation: ATAM

1 Stake

holders

2 Goals

3 Scenarios

4 Simulate Analyze

5 Satisfied?

Architecture

up

dat

e

Designing and Documenting using UML

Use Cases Sequence Diagram

Class Diagram

State Diagram

Activity Diagram

Package Diagram

Deployment Diagram

…

…

Scenarios Behavior

Behavior

Behavior

Structure

Development

Physical

Integration & Testing

Big Bang Putting all together at once and testing

Continuous Develop, test and deploy as you go

• Why? – Feeling lazy?

– No continuous integration tools?

• Don’t do it. Why? – Time consuming

– Whose component is failing?

– Origin of bugs is hard to trace

– Trust me, there will be many bugs!

• Why? – It makes more sense – Tools available, automated

unit testing scripts

• Do it. Why? – Automatable – If build FAILS, the last commit

is the potential culprit – Automated deployment, if

build PASSES – “Less last moments stress”

This is how you would do it!

Initial Architecture

Coding Black hole

Workshop

Technologies

G8

• Node.js

• AngularJS

• PostgreSQL

• Bookshelf.js

• Bootstrap

G2

• Node-RED

• Node.js

• HTML5

• AngularJS

• REST

• JSON

• MongoDB

• Linux

• Docker

• BeagleBone Black

• Raspberry Pi

G5

• PHP

• JavaScript

• jQuery

• Bootstrap

• CodeIgniter

• IIS Express server

• SQL server

• Git G3

• Back-end techology: Node.js

• Database: Sequelize

• Front-end technology: Angular.js

• Deployment: Heroku

G6 • Flask

• flask-babel • flask-sqlalchemy

• Bootstrap • d3.js • AngularJS • PostgreSQL • Git

Three Tier Architecture Client-Server

Client Server Database

• Modifiability Design Pattern – Different Technologies for each tier can be used

– Each tier can change independent of others

• Efficiency may suffer – Poor network speed or bandwidth

• Reliability – R= Client Reliability * Server Reliability * DB Reliability

• Security – Encrypt the messages

– Usually encryption is by default supported

Why Model-View-Controller?

View View Model View

Controller

Data Changed Notification

Perform action on view

User action

Update Data

Get New Data

2 3

4

1

5 User

Interface Data Synch

• MVC = Separation between Views and Application or Business Logic

• Business logic and Views can change independently • Each view can show the data in a different way (e.g., charts, table

etc.) • There can be different Views for different devices (Mobile, Tablet,

PC, TV etc.)

Questions

• (G3) How to distribute the work among the project team when the application's architecture is not yet modular and requires work on basic parts?

• (G2) What are good practices of documenting the architecture and why the customer might need it?

• (G5) What are the main pros and cons of using MVC architecture for designing a web service system? Which other arcitectural styles work well for web systems?

• (G5) How to decide which parts of the web application should run on the server, and which ones on the browser?

• (G6) Should it be the backend or the client that fetches data from third party REST interface? (In what kind of situations?)

Questions

• (G7)What kind of software architecture evaluation methods would be feasible on this project course?

• (G7) In a web application, where the backend is a REST API to a relational SQL database: What kind of software architecture would allow synchronising the data between clients efficiently? (Like in google docs for example: one user edits the document and others see the changes almost instantaneously.)

• (G8) Is a formal architecture evaluation really necessary, when developing a relatively small web application?

• (G8) What are some usual problems/considerations with tried and true web-architectures? For example nodejs backend with a REST-api and angularJS frontend.

Questions

• Why MVC models are getting more and more popular in web front ends?

• How single page application web pages affect information security when combined with MVC front end? E.g. Admin page implementation.

• How to manage the amount of javascript files on big web pages and their depedencies? Is there any options?

• When using Entity-Component design pattern for high-level architechture (for example when using Unity), what approach should be taken for project-spanning architechture?

• When the project begins with proof of concept and heavy prototyping, what is the optimal point for rebooting with production quality architechture or should it emerge gradually?

NOTE

Group Hardware Client Messaging Server ORM Database Version Control Deployment

G1 Rasberry Pi (Embedded)

HTML5, Backbone.js

on web server + Python

on RPi JSON Node.js Sequelize.js MySQL Git

Docker + SD

card image

G2

BealgleBoneBlack,

Raspberry Pi

(Embedded)

HTML5, AngularJS,

Bootstrap?, jQuery? JSON Node.js, REST ? MongoDB Git?

Docker

(Continuous?)

G3

Google glass

(Embedded) Java JSON? REST, Node.js? ? ? Bitbucket ?

G4

PC/Mac/ Mobile/

Embedded?

AngularJS, HTML5?,

Bootstrap?, jQuery? JSON? Node.js, REST? Sequelize.js ? Git?

Heroku

(Continuous?)

G5 PC/Mobile(tablet)

HTML, Javascript,

jQuery, Bootstrap JSON

PHP(CodeIgniter

),IIS Express

Server

CodeIgniter's

"Active record" SQL Server Git ?

G6

PC/Mac/ Mobile/

Embedded?

Flask, d3.js,

AngularJS, Bootstrap,

Html5? JSON? ? ? PostgreSql Git ?

G7

PC/Mac/ Mobile/

Embedded?

HTML5, AngularJS,

Bootstrap, jQuery JSON?

REST w/ C#,

Apache Custom PostgreSql Git ?

G8 PC/Mac/ Mobile

HTML5, AngularJS,

Bootstrap JSON Node.js, REST Bookshelf.js PostgreSql Git ?

G9 PC/Mac C#, Unity - - - -

Bitbucket/

SourceTree ?

G10 Mobile / Desktop

Java, HTML5, CSS,

Javascript, AngularJS JSON

Python(Django),

REST, MongoDB Git ?

- The assistants have filled in some missing technologies and marked them with "?" mark. Remove the "?" mark if you are using the technology or

- If your product does not fit into Client-Server paradigm, please add free form text stating your technologies to the table.

- Deployment: Does your tool support continuous integration? if Yes, please add "(Continuous)" .

Theoretical

1. (G3) How to distribute the work among the project team when the application's

architecture is not yet modular and requires work on basic parts?

- Define the architecture and interfaces and distribute them.

- Coming up with initial architecture should not be that challenging.

- Design for the team or team for the design, choose what is possible for you. In this

course work, perhaps, teams are already fixed, therefore your design should follow the

team structure (keeping in mind team member skills).

2. (G2) What are good practices of documenting the architecture and why the customer

might need it?

- Document minimum as needed according to customer demands. Use figures to show

big picture of the architecture.

- Agile manifesto view: Working software over comprehensive documentation. See: A.

Rüping: Agile Documentation

- It should be possible to trace the architectural choices back to the goals or requirements.

Therefore, not only document the architecture but also the decisions or rationale that

explains why the architecture is the way it is. It is good for transfer of knowledge when

the architect leaves the teams in companies. Tech savvy customer may want to see the

architecture to confirm that it delivers what he or she has demanded from you. Customer

may internally conduct (or demand from you) formal evaluation/review of the

architecture for further satisfaction.

3. When the project begins with proof of concept and heavy prototyping, what is the optimal

point for rebooting with production quality architecture or should it emerge gradually?

- If something is expected to change in future, make is modifiable.

- Build your MVP first and then see if it can be extended without so many problems,

otherwise go for next prototype. Throwing away might be sensible if fixing cost more

- An old saying states that PoC’s and prototypes should always be thrown away. When

starting the actual product, PoCs and prototypes work as ideas how to design the actual

architecture. So, play with prototypes, make quick’n’dirty solutions, but when you have

learned enough, start with a scratch.

4. (G7)What kind of software architecture evaluation methods would be feasible on this

project course? (G8) Is a formal architecture evaluation really necessary, when

developing a relatively small web application?

- Full-scale evaluation might take too much time to deliver any real value for anyone.

However, could some things from evaluation methods be applied to your context too?

For example, documenting arch. decisions and their rationale for future use? Could

scenarios help to facilitate discussion with stakeholders?

5. (G10) Should the architecture be designed so that it's easily tested even if it could

severly cripple other aspects of the architecture? And how much weight should be given

for the testability when planning the architecture?

- If your tools dictate wrong methods that will cripple the architecture, try finding other

tools that may work for your architecture.

- Architecture is enabler of multiple cross-cutting concerns (functionality vs testability vs

efficiency vs reliability). Find a balance among them or overweight one over another

according to your application’s needs or stakeholders interests.

Patterns

6. MVC: (G5) What are the main pros and cons of using MVC architecture for designing a

web service system? Which other architectural styles work well for web systems? How

single page application web pages affect information security when combined with MVC

front end? E.g. Admin page implementation.

- See workshop slides on MVC for introduction to the pattern.

- MVC alternative- Presentation Abstraction Control (PAC) Design Pattern (Agents

hierarchy + separate MVC per view or agent at every level, no connection between

Model:Abstraction and Views:Presentation, Centralized at Controller)

- Security; Each view is restricted to show (and receive) some part of the information

available in the model. This inherently enables some level of secure data visualization.

7. CLIENT-SERVER: (G5) How to decide which parts of the web application should run on

the server, and which ones on the browser?

- Computation intensive parts and databases usually go to the server side.

- See workshop slides on Three Tier Architecture.

8. (G6) Should it be the backend or the client that fetches data from third party REST

interface? (In what kind of situations?)

- Technically it should be possible to access a third part REST API from your client unless

the owner of the API restricts such access. Another option is to build a proxy server for

the third party API, if allowed.

Technical

9. (G7) In a web application, where the backend is a REST API to a relational SQL

database: What kind of software architecture would allow synchronising the data

between clients efficiently? (Like in google docs for example: one user edits the

document and others see the changes almost instantaneously.)

- use sockets

- This approach works for cloud based apps. All major ecosystems have their own

solutions. e.g., Google cloud messaging and their Backup API for Android OS. iCloud

support data synchronization as a built-in feature. Microsoft Sync Framework for SQL

server.

10. (G8) What are some usual problems/considerations with tried and true web-

architectures? For example node.js backend with a REST-api and angular.js frontend.

- NodeJS and its technologies are still immature, so keep expectations a bit lower. For

example, is NodeJS and technologies built upon it are powerful enough to support the

incoming traffic or a large database? How many parallel connections can it support

without crashing? Are the NodeJS ORMs really good as traditional tools like

HIBERNATE etc.

11. How to manage the amount of javascript files on big web pages and their

dependencies? Is there any options?

- TaskRunner, Grunt (watch out for circular dependencies)

- RequireJS

12. (G10) An external system contains large amounts of location based data which is

accessed through an API which doesn't fit our needs. Could there be any other viable

options than to replicate the entire external database which will make the size of our own

database huge?

- If the owner’s API provide restrictive access then even your own API has to obey such

restrictions. Otherwise, it might be time consuming, however, could be possible to adapt

the external API for you needs by creating a Proxy server? (OR) Partially or fully

replicate the database on your own server and write a fresh API satisfying your

application’s needs, if possible.

Other

13. When using Entity-Component design pattern for high-level architecture (for example

when using Unity), what approach should be taken for project-spanning architecture?

- Unity dictates it own solutions and constraints