GWT in der Praxis: Modernisierung einer Web-Applikation

Als Software-Entwickler muss man flexibel sein. Keine zwei Projekte sind identisch und jeder Kunde hat ganz individuelle Wünsche. Handelt es sich um ein neues Projekt, bei dem noch keine einzige Zeile Code geschrieben wurde, kann man sich austoben und von neuesten Techniken Gebrauch machen. Doch was, wenn es sich um eine in die Jahre gekommene Anwendung handelt, die „nur“ modernisiert werden soll? Dann gilt es, Alternativen abzuwägen und Kompromisse einzugehen. Werfen wir einen Blick auf ein solches Projekt und die Überlegungen vor, während und nach der Umsetzung.

In der Software-Entwicklung gibt es – extrem vereinfacht dargestellt – zwei Arten von Projekten: Greenfield-Projekte, deren Entwicklung quasi bei Null beginnt und bei denen keine bereits existierenden Grundlagen wie ältere Versionen oder bestehender Code zu berücksichtigen sind, und Brownfield-Projekte, die auf etwas bereits Vorhandenem aufbauen müssen.

Die Aufgabe

In unserem Fall handelte es sich um ein Brownfield-Projekt in Form einer etwas betagten, aber erfolgreich laufenden Web-Anwendung, die einst in der Programmiersprache Perl entwickelt wurde und weiterhin gepflegt wird. Diese Anwendung bestand hauptsächlich aus einem Shop-System und einem Administrationsbereich mit verschiedenen Benutzerrollen. Ziel war es nun, dessen Oberfläche – und möglichst nur diese – komplett zu erneuern und an die aktuellen technischen Möglichkeiten anzupassen. Der Nutzer sollte wieder mit einem System arbeiten können, das „state of the art“ ist.

Die Lösungsstrategien

Zunächst wurde überlegt, welche Strategien zur Umsetzung dieser Anforderungen es überhaupt gibt und mit welchen Vor- und Nachteilen diese verbunden wären. Tools und Techniken, die es in die engere Wahl geschafft hatten, wurden in einem weiteren Schritt – sofern sinnvoll – ausprobiert und genauer evaluiert. Am Ende blieben drei Alternativen übrig.

Facelifting mit CSS und Überarbeitung der HTML-Templates
Bei einem reinen Facelifting wären „nur“ Änderungen an den HTML-Templates und den dazugehörigen CSS-Layouts nötig gewesen. Was nach einer relativ schnellen und risikolosen Lösung klingt, hätte jedoch in unserem Fall einen Rattenschwanz an weiteren Anpassungen nach sich gezogen, da die Ausgabe am Frontend sehr eng mit der Anwendungslogik des Backends verbunden war. Änderungen an diesem wären somit nicht nur unvermeidbar gewesen, sondern hätten auch ein unnötig hohes Risiko für den laufenden Betrieb dargestellt.

Integration eines JavaScript-Frameworks
Der Einsatz eines Frameworks wie dojo oder qooxdoo ist zwar der vorherigen Strategie schon deutlich überlegen, aber leider noch nicht ideal: Noch bevor auch nur eine einzige Zeile Code geschrieben werden kann, müssen sich alle beteiligten Entwickler zuerst zeitintensiv in das Framework einarbeiten. Demgegenüber steht wiederum der große Pluspunkt, dass sich die Nachteile des Faceliftings vermeiden lassen, indem auf Basis eines JavaScript-Frameworks ein komplett neues Frontend implementiert wird, das per eigens entwickelter REST-API mit dem Backend kommunizieren kann. Eine Strategie, die in unseren Augen durchaus erfolgversprechend war.

Komplette Neuentwicklung eines eigenständigen Frontends
Nach einer umfangreichen Überprüfung diverser Möglichkeiten und vielen Gesprächen haben wir uns schließlich für die Entwicklung eines neuen und eigenständigen Frontends entschieden. Dank dieser zusätzlichen Schnittstelle konnte auf modernste Technologien zurückgegriffen werden und gleichzeitig das bisherige Backend unverändert bleiben, was das Risiko für den laufenden Betrieb deutlich reduzierte. Lediglich eine REST-API musste als Zwischenschicht implementiert werden. Doch dazu später mehr.

Aufgrund unserer Erfahrungen war dann auch recht schnell klar, dass die Wahl zur Entwicklung des neuen Frontends auf das Google Web Toolkit (GWT) fallen musste, das sich bei //SEIBERT/MEDIA bereits seit geraumer Zeit großer Beliebtheit erfreut. Zusätzlich haben wir uns der Erweiterung Ext GWT bedient, mit deren Hilfe wir allen Wünschen nach Modernität gerecht werden konnten, ohne unnötig viel Zeit für Eigenentwicklungen zu verlieren.

Die Herausforderung

Bevor wir als Team mit der Programmierung des Frontends beginnen konnten, mussten wir uns jedoch zunächst einmal in die Frameworks GWT und Ext GWT einarbeiten. Um diesen Prozess deutlich zu beschleunigen, wurde ein mit den Frameworks vertrauter Kollege als Berater zum Team hinzugezogen. Dieser richtete das Basissystem ein, schulte die Teammitglieder, führte Code Reviews durch und stand generell für alle Fragen stets zur Verfügung.

Die Umsetzung

Nachdem die optimale Lösungsstrategie gefunden und die Herausforderung der initialen Einarbeitung gemeistert war, konnte die Entwicklung der einzelnen Komponenten endlich beginnen.

Das Hauptaugenmerk lag natürlich auf der Programmierung des Frontends mit GWT und Ext GWT. Doch damit nicht genug: Eine weitere wichtige Einheit des neuen Systems war eine Kommunikationsschicht, die zwischen Außenwelt und Backend vermitteln sollte. Diese Schicht, die dem neuen Frontend eine API für Dateneingabe und -ausgabe zur Verfügung stellt, wurde mit dem schlanken REST-Framework Perl Dancer realisiert, einem Tool, das sich unserer Erfahrung nach optimal für derartige Aufgaben eignet, da es unkompliziert verwendet werden kann, zügig Resultate liefert und sogar den Programmierern Freude macht – drei Pluspunkte, die es uns erlaubten, mehr Zeit und Energie auf die ungleich schwierigeren Arbeiten am Frontend zu verwenden.

Zur Verwaltung des Projekts haben wir das bei uns sehr beliebte Tool Maven eingesetzt, das von der Apache Software Foundation als „software project management and comprehension tool“ beschrieben wird und sich durch seine einfache Bedienbarkeit auszeichnet.

Abschließend noch ein kompaktes Schaubild des geplanten Systems:

Fazit

Zwar hat das Ergebnis am Ende unsere Erwartungen erfüllt und wir würden die gleiche Lösungsstrategie erneut wählen, aber dennoch haben wir als Entwickler einen Fehler begangen: Wir haben den Zeitaufwand für die Einarbeitung in und Entwicklung mit GWT und Ext GWT spürbar unterschätzt. Diese anfängliche Hürde kann schnell zu Verunsicherung und Zweifeln an der gewählten Strategie führen und sollte nicht auf die leichte Schulter genommen werden.

In unserem Fall war es daher besonders hilfreich, dass uns gerade am Anfang ein erfahrener Mitarbeiter als Berater zur Verfügung gestellt wurde, der beim Meistern der ersten Hürden aktiv mitgeholfen und so den Erfolg des Projekts letztlich auch mitgetragen hat.

Weiterführende Informationen

Ihr neues Projekt soll mit neuesten Techniken entwickelt werden? Sie möchten ein bestehendes System erweitern oder eine Software-Plattform migrieren? Sie benötigen Schnittstellen zwischen Anwendungen im Unternehmen? Und bei all dem muss höchste Qualität jederzeit gewährleistet sein?

Dann ist //SEIBERT/MEDIA der richtige Partner für Sie. Wir legen größten Wert auf Erweiterbarkeit, Performanz, Skalierbarkeit, Plattformunabhängigkeit und Testbarkeit und schaffen so individuelle High-End-Software-Lösungen, die sich auch im Nachhinein flexibel ausbauen und verändern lassen. Bitte sprechen Sie uns unverbindlich an! Ausführliche Informationen finden Sie auch in unserem öffentlichen Wiki: Einstieg in die Software-Entwicklung mit //SEIBERT/MEDIA.

High-End-Java-Lösungen von //SEIBERT/MEDIA
GWT: Evolution der Internet-Anwendung
GWT im Projektseinsatz
GWT aus Entwicklerperspektive

Artikel teilen:Share on FacebookTweet about this on TwitterShare on Google+Share on LinkedInEmail this to someonePrint this page