Changeset 68

Timestamp:

02/16/08 10:18:53 (5 years ago)

Author:

d0nut

Message:

smaller optimizations

Location:

documentation/trunk

Files:

• doc.tex (modified) (12 diffs)
• img/http-ajax2.png (added)

documentation/trunk/doc.tex

@@ -55 +55 @@
 
         Besonders im professionellen Umfeld wird wegen der einfachen clientseitigen Einrichtung und der strikten Server/Client Trennung verstÀrkt auf Web-Anwendungen gebaut.
-        Moderne Web-Anwendungen lassen sich kombinieren, sie greifen ineinander ÃŒber und sie reagieren sofort auf das, was der Benutzer macht.
+        Moderne Web-Anwendungen lassen sich komponentenweise kombinieren, sie greifen ineinander ÃŒber und sie reagieren sofort auf das, was der Benutzer macht.
         
         Die BrÌcke zwischen Web- und Desktop-Welt wird durch gleiche Bedienkonzepte wie z.B. Drag-Drop, AutovervollstÀndigen oder die sofortige Formularvalidierung geschlagen.
@@ -76 +76 @@
         HTTP zum Nachladen von Daten.
 
-        Das Zusammenspiel dieser Technologien erlaubt dynamische Websites, 
+        Das Zusammenspiel dieser drei Technologien erlaubt dynamische Websites, 
         die durch asynchrone Verbindungen in einer interaktiven Umgebung beliebige Datenmengen bewÀltigen können.
         
-        Der Client schickt HTTP-Requests an den Server, ohne dass die eigentliche Seite neu geladen wird oder der Benutzer wÀhrenddessen warten muss.
+        Der Client schickt HTTP-Requests an den Server, ohne dass die eigentliche Seite neu geladen wird, oder der Benutzer wÀhrenddessen warten muss.
         
         \subsection{Document Object Model} \label{sec_ajax_dom}
-        Das Document Object Model (kurz DOM) ist eine vom W3-Konsortium verabschiedete Norm fÃŒr die Definition einer Baumstruktur und ihrer Traversierungsfunktionen.
-        Mit DOM lÀsst sich das gesamte HTML Dokument in ein dynamisches Objekt binden.
+        Das Document Object Model (kurz DOM) ist eine vom W3-Konsortium verabschiedete Norm fÃŒr die Definition einer Baumstruktur und ihrer Traversierungsfunktionen in XML.
+        Mit DOM lÀsst sich damit auch ein komplettes HTML Dokument in ein dynamisches Objekt binden.
 
         Das Beispiel zeigt den DOM-Baum einer Standard-Web-Seite, mit Head- und Body-Bereich und mehreren Unterknoten.
@@ -173 +173 @@
         WÀhrend des Ladevorgangs kann der Benutzer weiter mit der Seite interagieren,
         da der Browser dafÌr sorgt, dass der asynchrone Request in einem eigenen Thread ablÀuft.
-        Dazu ist keine Socketverbindung ÃŒber TCP oder UDP notwendig.
-        
+
+        Zudem ist keine Socketverbindung auf Ebene von TCP oder UDP notwendig.  
         Verwendet man AJAX, genÃŒgt es in der Regel einzig Daten per HTTP zu ÃŒbertragen.
-        Das EinfÃŒgen in den DOM Baum macht dann JavaScript.
-        So funktioniert das Zusammenspiel der drei Technologien.
+
+        Das EinfÃŒgen in den DOM Baum erledigt dann JavaScript.
+        So funktioniert das Zusammenspiel der drei Technologien:
+        
+        Die Ajax-Engine reagiert auf einen Klick in der BenutzeroberflÀche,
+        schickt daraufhin eine HTTP-Request an den Server und sobald dieser antwortet,
+        wertet sie die Antwort aus und fÃŒgt die Informationen mit DOM-Manipulationen in das eigentlich Dokument wieder ein.
 
         \begin{figure}[htp]
@@ -185 +190 @@
         \label{fig:http-ajax}
         \end{figure}
-        
-        Die Ajax-Engine reagiert auf einen Klick in der BenutzeroberflÀche,
-        schickt daraufhin eine HTTP-Request an den Server und sobald dieser antwortet,
-        wertet sie die Antwort aus und fÃŒgt die Informationen mit DOM-Manipulationen in das eigentlich Dokument wieder ein.
 
 
@@ -268 +269 @@
         Es werden Testszenarien gebraucht die eine ServerÃŒberlastung emulieren.
         
-        Selbst fÌr den Benutzer ergeben sich Nachteile, denn das Navigieren Ìber die Browserfunktionen oder das Neuladen der Seite können ohne ein ausgeklÌgeltes Konzept zu Fehlverhalten fÌhren.
+        Selbst fÃŒr den Benutzer ergeben sich Nachteile. 
+        Denn das Navigieren Ìber die Browserfunktionen oder das Neuladen der Seite können ohne ein ausgeklÌgeltes Konzept zu Fehlverhalten fÌhren.
 
         Wie der Titel dieser Ausarbeitung nahe legt, heißt die Lösung fÃŒr all diese Probleme 'Google Web Toolkit' (oder kurz GWT).
@@ -286 +288 @@
 
         Entwickler können ihre fÌr Java bevorzugte Entwicklungsumgebung benutzen.
-        Dabei brauchen sie sich nicht mit HTML, JavaScript und vor allem den ganzen Browser-Workarounds auseinander zusetzen.
+        Dabei brauchen sie sich nicht mit HTML, JavaScript und vor allem den ganzen Browser-Workarounds auseinander zu setzen.
         Sie können GUIs programmieren, wie sie es bereits von SWING und AWT gewohnt sind, 
         ohne dabei auf vorhandene Build- und Testing-Tools verzichten zu mÃŒssen.
@@ -293 +295 @@
         \subsection{Entwicklungszyklus} \label{sec_devcycle}
         Das GWT arbeitet mit einer Standard-Verzeichnisstruktur, die entweder manuell oder unterstÃŒtzt durch die mitgelieferten Skripte erstellt werden kann.
+        FÃŒr Eclipse wird erst ein Projektverzeichnis zum Import in den Workspace erstellt und dann in Schritt zwei die Anwendung angelegt.
+        % auch wenn es wieder ein foren-tipp ist, der tipp muss einfach rein
+        Die Schritte sollten in einem eigenen Verzeichnis durchgefÃŒhrt werden, da die Verzeichnisstruktur direkt im ausfÃŒhrenden Verzeichnis abgelegt wird.
+\begin{lstlisting}[\label{lst:devcycle_projectCreator},language=bash] 
+./../gwtpfad/projectCreator -eclipse MeineErstesProjekt
+./../gwtpfad/applicationCreator -eclipse MeineErstesProjekt com.gwt.client.MeineErsteAnwendung
+\end{lstlisting}
 
         Geeignete Entwicklungsumgebungen können das Projektverzeichnis dann als normales Java-Projekt importieren und die eigentiche Programmierung kann beginnen.
-        Eine gute IDE unterstÌtzt dabei mit Debugging-Möglichkeit, Refactoring-Tools und einer Unit-Testing-Integration.
+        Die IDE kann dabei mit Debugging-Möglichkeit, Refactoring-Tools und einer Unit-Testing-Integration unterstÌtzen.
+        Die Standard-Verzeichnisstruktur enthÀlt bereits ein einfaches 'Hello World' das in den nÀchsten Schritten zu einer Anwendung wachsen soll.   
         
         WÀhrend des Testens wird öfter in den Hosted-Mode gewechselt, der einen Browser innerhalb einer Java VirtualMachine emuliert.
-        Entsprechende Break-Points vorausgesetzt, kann die Anwendung hier live getestet werden.
+        Die Anwendung kann hier live getestet und - entsprechende Break-Points vorausgesetzt - auch debuggt werden.
         
         Skriptsprachen-Programmierer mÃŒssen ihr 'Try and Run' Konzept nicht verwerfen, 
-        da der Hosted-Mode-Browser sie weder durch umstÀndliche IDE-Prozesse, noch durch lange Kompilierzeiten ausbremst.
+        da der Hosted-Mode-Browser sie weder durch umstÀndliche IDE-Prozesse, 
+        noch durch lange Kompilierzeiten ausbremst.
         Änderungen im Java Quelltext Code werden 'Just in time' ÃŒbernommen.
         
@@ -317 +328 @@
         \subsection{Compiler} \label{sec_tec_compiler}
         Der Compiler ist das HerzstÃŒck des GWT. Er verarbeitet den programmierten Java-Code und erstellt daraus einen neuen Code aus HTML und JavaScript - 
-        so wie ein klassischer Java Compiler aus Java-Code Bytecode erstellt.
+        so wie ein klassischer Java Compiler aus Java-Code einen Bytecode erstellt.
         Der Unterschied ist, dass der erstellte Code ohne Java Runtime Umgebung und mit jedem aktuellen Browser ausgefÃŒhrt werden kann.
 
@@ -363 +374 @@
         \subsection{Remote Procedure Call} \label{sec_tec_gwt_rpc}
         Bisher wurden die optimierten Frontend-Prozesse von GWT vorgestellt.
-        Damit das Gesamtsystem aber Ìberhaupt funktionieren kann, benötigt jede Anwendung auch ein Backend.
-        FÃŒr die Anbindung an das Backend nutzt das GWT 'Remote Procedure Calls' (kurz RPC), 
+        FÃŒr die Anbindung an ein Backend nutzt das GWT 'Remote Procedure Calls' (kurz RPC), 
         ÃŒber die eine Model-View-Controller Architektur umgesetzt werden kann.
 
+        Das Toolkit fasst also alles benötige in einem Paket zusammen.
         FÃŒr die Prototyp-Entwicklung des Backends bringt das Google Web Toolkit einen Tomcat Server mit.
-        Das Toolkit fasst also alles benötige in einem Paket zusammen.
         Falls kein Applikation-Server zur VerfÃŒgung steht,
         stellt dies durch die Standardisierung von Remote Procedure Calls auch kein Problem dar und 
-        es können andere Programmiersprachen wie zum Beispiel PHP, Python oder C\# im Backend genutzt werden.
+        es können andere Programmiersprachen wie PHP, Python oder C\# im Backend genutzt werden.
 
         Eine Besonderheit der RPC Implementierung des GWT, 
@@ -377 +387 @@
         sind die polymorphen Klassenhierarchien und das Durchreichen von Exceptions.
         
-        Die Implementierung von RemoteProcedure Calls erstreckt sich ÃŒber mehrere Dateien.
-        Es wird die Beispielanwendung der AJAX-Programmierung implementiert.
+        Die Implementierung von RemoteProcedure Calls erstreckt sich ÃŒber mehrere Klassen und Interfaces.
+        Aufbauen auf dem 'Hello World' wird nun die Beispielanwendung der AJAX-Programmierung implementiert.
+        
+        Nach Konvention sollten dazu neben dem existierenden Client-Paket noch ein "rpc" und ein "server" Paket angelegt werden.
+        Das rpc-Paket wird die folgende Klassenstruktur abbilden.
         
         \begin{figure}[htp]
@@ -386 +399 @@
         \label{fig:rpc}
         \end{figure}
+        
+        \newpage
         
         MailService ist ein Interface das RemoteService erweitert und die tatsÀchliche Implementierung beschreibt.
@@ -408 +423 @@
         
         Der emailService Proxy ist eine MailServiceAsync Instanz, wird aber vom GWT initialisiert.
+        Hier wird er mit der URL des RPC Moduls des GWT initialisiert.
+        Alternativ kann man hier einen Pfad zur eigenen RPC Implementierung eintragen.
 \begin{lstlisting}[caption={emailServiceAsync}\label{lst:gwtsample_emailserviceasync},captionpos=b,language=java] 
 MailServiceAsync emailService =