Architecture Workshop

TIE-13100 / TIE-13106

Tietotekniikan projektityö / Project Work on Pervasive Systems

Architecture Workshop

Hadaytullah

Marko Leppänen

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

rc

h

it

ec

tu

re

Freedom of choice?

• Dictators

– Frameworks (Web Frameworks)

– Eco System (iOS MVC, Delegate, Protocol,

Singleton)

– Technologies (AngularJMVC)

– Organization of Team

Evaluation: ATAM

1

Stake

holders

2

Goals

3

Scenarios

4

Simulate

Analyze

5

Satisfied?

Architecture

u

p

d

at

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

This is how you would do it!

Initial

Architecture

Coding

Black hole

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

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

Synch

Data

• 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

NOTE

Group Hardware

Client

Server

Database

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.

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.

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