![Page 1: Web-Anwendungsentwicklung à la MVC. Übersicht Über Georg Heeg Ein industrielles Beispiel Web-Anwendungen aus Smalltalker-Sicht MVC für das Web Programmierdemo](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/1.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/2.jpg)
Ü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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/3.jpg)
Ü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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/4.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/5.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/6.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/7.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/8.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/9.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/10.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/11.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/12.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/13.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/14.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/15.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/16.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/17.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/18.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/19.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/20.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/21.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/22.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/23.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/24.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/25.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/26.jpg)
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](https://reader035.vdocuments.mx/reader035/viewer/2022062512/55204d6849795902118bdf27/html5/thumbnails/27.jpg)
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