A:gon Solutions GmbH 29.04.2013

11

»The native web – mobile Architekturen mit HTML5

und PhoneGap

Juri Urbainczyk

Forum „A:gon meets Technology“

26. Februar 2013

A:gon Solutions GmbH 29.04.2013

22

Worum geht‘s?

Mobile und mehr

Wie den phone gap

überwinden?

Warum RIA und HTML5?

A:gon Solutions GmbH 29.04.2013

33

Motivation

A:gon Solutions GmbH 29.04.2013

44

Alternativen mobiler Architekturen

Server derAnwendung

Client derAnwendung

Daten

Native App Mobile Webapplikation Mobile RIA

Brow

ser

Webclient

Services

Server derAnwendung

Daten

Brow

serRIAWebclient

Server derAnwendung

Daten

Services

Daten Devices Daten Devices Daten Devices

HTML5JavaScript

Install

Hybrid RIA

Runtim

e RIAWebclient

Server derAnwendung

Daten

Services

Daten Devices

HTML5JavaScript

Install

Request/Reply

A:gon Solutions GmbH 29.04.2013

55

Die Frage nach „mobile“ greift zu kurz!

TabletsSmartphones

DesktopsLaptops

NetbooksNavigation Systems

Game ConsoleKiosk

…

iOSLinux

WindowsChromeMacOSAndroid

BlackBerry…

Safari v5.1 +Chrome v15 +

IE v9 +Firefox v8 +

Opera v11.1 +

Devices

OperatingSystems Web Browsers

Eine gemeinsame Basis wird benötigt!

A:gon Solutions GmbH 29.04.2013

66

Not talking about…

Games

High-performance Real-time applications

Business Applications

A:gon Solutions GmbH 29.04.2013

77

Die gemeinsame Basis

A:gon Solutions GmbH 29.04.2013

88

Was ist HTML5?

A:gon Solutions GmbH 29.04.2013

99

Was ist HTML5?

Offline-Webanwendungen

A:gon Solutions GmbH 29.04.2013

1010

������������

A:gon Solutions GmbH 29.04.2013

1111

�������� ���

A:gon Solutions GmbH 29.04.2013

1212

ServerServer

Business Logik

RIA Architektur

Browser

Datenbank

Model Controller

View

Browser

RIA Webclient

Datenbank

Services

Model

ControllerViewSeite

ResponseRequest InitialerDownload

Service Layer

Warum RIA?

» Bandbreite

» Skalierung

» Performance

» Layout & Design

» Programmiermodell

» Entkopplung

» Testbarkeit

» Offline

*RIA = Rich Internet Application

Web „Standard“ Web RIA

Business Logik

HTML5 Framework

Warum HTML5?

» Keine Plugins

» Cross-Plattform

A:gon Solutions GmbH 29.04.2013

1313

The phone gap

Browser

RIA Webclient

ControllerView

InitialerDownload

*RIA = Rich Internet Application

HTML5 Framework

?

?Daten Devices

Install

?

A:gon Solutions GmbH 29.04.2013

1414

PhoneGap = Apache Cordova

A:gon Solutions GmbH 29.04.2013

1515

PhoneGap: How it works

Server-Rechner

Tablet / Smartphone

PhoneGapBrowser

Devices

Server-Anwendung

HTML / CSS / JS

PhoneGap API

ServicesPhoneGap Build

A:gon Solutions GmbH 29.04.2013

1616

PhoneGap Build

A:gon Solutions GmbH 29.04.2013

1717

PhoneGap Feature Support

A:gon Solutions GmbH 29.04.2013

1818

PhoneGap Source Code Example

A:gon Solutions GmbH 29.04.2013

1919

������������������

A:gon Solutions GmbH 29.04.2013

2020

HTML5 und RIA:Folgen für die Architektur

» Gleiche Dienste auf verschiedenen Endgeräten

» RIA bringt stärkere Client/Server Entkopplung

� service-orientierte Architekturen

» Mächtigkeit der Technologien nimmt zu

» Die Komplexität nimmt zu!

� keine weitere unnötige Komplexität

� Blueprints („Standardarchitektur“) notwendig

� Qualitätsmanagement für Architekturen

A:gon Solutions GmbH 29.04.2013

2121

HTML5 und RIA:Organisatorische Folgen

» Leichtgewichtigkeit ermöglichen

� Nicht durch „Überbau“ zerstören

� Durch „leichtgewichtige“ Prozesse managen

� Agilität zulassen

» Benutzerführung:

� Kombination Grafik, Audio, Video + klassische GUI

� Neue Möglichkeiten nutzen � Kreativität gefragt!

A:gon Solutions GmbH 29.04.2013

2222

Fazit

Eine Architektur –Sonderlösungen nur

im Sonderfall

Die Folgen: SOA + Blueprints

HTML5 ist die Basis

A:gon Solutions GmbH 29.04.2013

2323

A:gon Solutions GmbH 29.04.2013

2424

Vielen Dank für die Aufmerksamkeit.

Juri UrbainczykProject Manager, Bereichsleiter

juri.urbainczyk@agon-solutions.de

A:gon Solutions GmbHFrankfurter Straße 71-75

65760 Eschborn