Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel...

27
Web-Anwendungsentwicklung à la MVC

Transcript of Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel...

Page 1: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web-Anwendungsentwicklungà la MVC

Page 2: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Übersicht

• Über Georg Heeg• Ein industrielles Beispiel • Web-Anwendungen aus Smalltalker-Sicht• MVC für das Web• Programmierdemo• Zusammenfassung• VisualWaf als Produkt

Page 3: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Über Georg Heeg eK

• 100% Smalltalk seit 1987• Geschäftsstellen in

– Dortmund– Köthen (Anhalt)– Zürich (CH)

• Beratung und Produktentwicklung• VisualWorks Support EMEA für Cincom• Windows CE Plattform

Page 4: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Ein Industrielles Beispiel

• MSR-Spezifikationswerkzeug für Anlagenplanung und –bau

• Wissensbasiertes System• Standardisierungsprojekt (DIN)• Pay-per-use oder Hersteller-spezifisch

SpecSheet

Page 5: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Ein Industrielles Beispiel

• Domain– 12 Packages– 111 Klassen mit 612 Methoden

• Web-Applikation– 10 Packages– 53 Klassen mit 403 Methoden– 9 Tasks, 6 Views, 1 Controller– 57 SSP-Pages

SpecSheet

Page 6: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Ein Industrielles Beispiel

Page 7: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web–Anwendungen

• VisualWorks enthält das WebToolkit– Genaue Implementierung von JSP/ASP

• Server-Script-Page• Eigener Web-Server oder Brücken• Verwaltung von Web-Sites

– Scripten in Smalltalk-Syntax

Page 8: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web–Anwendungen

• Web-Anwendung aus Smalltalk-Sicht primitive „Neandertal-Technologie“– Ausgabe: HTML-Strings für Werte– Eingabe: Dictionary von Strings– Zustandslos– Sehr einfacher Satz von Widgets (ST80 2.2,

ca. 1986)• TN3270 in bunt mit Musik

Page 9: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Die Versorgungslücke

Request

Browser

Smalltalk Domäne

Außenwelt

app domain

Application Model

Response

Page 10: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web-Anwendungen

• Smalltalker arbeiten mit– Reicher Menge an Widgets– MVC als Modell der Anwendungsarchitektur– ValueModel und Aspect-Kanäle zur

Verbindung von GUI und Anwendungsmodell– Event-getriebene Anwendungssteuerung– Komplette Abstraktion der

Präsentationsimplementierung (nur Smalltalk-Werte)

Page 11: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

VisualWaf™ Ziele

• Web-Anwendungsentwicklung so einfach wie GUI-Entwicklung machen

• GUI-Konzepte erhalten• Web-Konzepte erhalten• Die Zusammenarbeit von Web-Designern

und Smalltalk-Entwicklern fördern

Page 12: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

VisualWaf™ Ziele

• Einfach zu schnellen Ergebnissen• Tragfähig für anspruchsvollste

Anwendungen• Effizient für hohen Datendurchsatz

Page 13: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

MVC à la GUI

View Controller Smalltalk Domain

Outside Domain

aspect messageaspect value

app domain

Application ModelProgrammierung

Konfiguration

Page 14: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

MVC für das Web

• View = Response-Service– Darstellung der Smalltalk-Domäne in HTML– Erzeugung von HTML-Elementen– Optional Erzeugung ganzer Webseiten

• Controller = Request-Service– Interpreter der HTTP-Requests (Formulare)– Interpreter der String-Werte als Smalltalk-Werte

• Gröbere Granularität als GUI-MVC– Inhalte ganzer Seiten statt– Inhalte einzelner Widgets

Page 15: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Die Versorgungslücke

Request

Browser

Smalltalk Domäne

Außenwelt

app domain

Application Model

Response

Page 16: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

MVC für das Web

Request

Browser

Smalltalk Domäne

Außenwelt

property

app domain

Application Model

Task

action

Response

Programmierung

Konfiguration

...

PageView PageController

Page 17: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Live Demo

Page 18: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Live Demo Zusammenfassung

• Anwendungsmodell WebApplication– Site- und Task-Konfiguration– Schnittstelle zur Domain-Logik– ≈ApplicationModel

• Anwendung zusammengesetzt aus Tasks– Modell der verarbeiteten Webseiten– Empfänger der HTTP-Request-Inhalte– Verantwortlich für Workflow– ≈ApplicationModel eines SubCanvas

Page 19: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Live Demo Zusammenfassung

• Modell von Web-Pages– Name, URL– Values mit Typen

• Optionale View und Controller pro Page– Custom-HTML für Scripten auf Webseiten– Servlet für HTTP-Transaktionsverarbeitung– Spezifische Verarbeitung der Werte

• Typ-Konvertierung• Fehlerbehandlung• Fachliche Prüfung

• Deklarative Verbindung von Controller und Task– ≈Aspects

Page 20: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Einige Features

• Präzise Workflow-Kontrolle durch Positionen

• Modell für Web-Komponenten• Nebenläufiger Workflow auf einer Seite• Mehrfache States pro Session

Page 21: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Positionen

• „You are here!“-Zeichen• Position = State#+ Task+ Page+ Task-

Internal• Eine Position pro Seite und pro Web-

Komponente

• Schlüssel für kontrollierten Workflow• aPosition gotoTask: aTask page: aPage

Page 22: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web-Komponenten

Page 23: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Web-Komponenten

• <!-- #include region=„Workspace„• Fügt Komponente ein• Welche? Das wird durch die Position

„Workspace“ bestimmt

Fortschreiten der Positionen erfolgt unabhängig von einander

Page 24: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

VisualWaf™ Features

• Application-server combined with server-script/servlet engine• Choice of SSP-pages and application generated HTML on per page basis• Multiple states per session allows synchronous browser windows• Pages aggregated from regions: multiple independent workflow

• Well-defined abstraction of Web concepts for application developers• Model of pages allows runtime inspection and adaptation• Prepared for content management systems• Automated Web value conversion with rich error handling

• Slim, powerful and well documented: easy to understand, use and adapt• Same application concepts as traditional GUI development• Very rapid prototyping of Web applications: 2 classes with 7 methods• Based on WebToolkit

Page 25: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Zusammenfassung

• Web-Anwendungsentwicklung „kein Problem“• Bekannte Architekturkonzepte• Gute Koexistenz von GUI und Web• Entwicklungskosten GUI und Web vergleichbar• Freie Wahl von SSP-Seiten und Servlet-

erzeugten Seiten• Basiert auf WebToolkit

Page 26: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

VisualWaf™

• Ein Georg Heeg eK Produkt• Version 3.0 verfügbar• CPU-basiertes Lizenzmodell• Consulting- und Entwicklungsunterstützung

• Wenden Sie sich an Andreas Tönne [email protected] für eine Evaluationslizenz

VisualWaf™ is a trademark of Georg Heeg eK

Page 27: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo.

Georg Heeg eKBaroper Str. 337D-44227 DortmundTel: +49-231-97599-0Fax: +49-231-97599-20

Email: [email protected]://www.heeg.de

Georg Heeg AGRiedtlistr. 8

CH-8006 ZürichTel: +41-1-356 3311Fax: +41-1-356 3312

Georg Heeg eKMühlenstr. 19

D-06366 KöthenTel: +49-3496-214 328Fax: +49-3496-214 712