Seite 2: Beispielprojekt

Inhaltsverzeichnis

Ein Beispielprojekt mit Spring 3 MVC

Zur Veranschaulichung von Spring 3 MVC entsteht nun die Beispielapplikation "Cities", die einige der größten Städte der Welt in einer Tabelle anzeigt und sich außerdem pflegen beziehungsweise aktualisieren lässt. Für jede Stadt erfasst sie das zugehörige Land, den Bezirk und die Einwohnerzahl. Die Anwendung gibt die Städte geordnet nach Größe aus und erlaubt es, neue Städte hinzuzufügen oder bestehende zu entfernen. Der erste Artikel erstellt dafür das "Grundgerüst". Der zweite ergänzt die Suchfunktion um eine Auto-Vervollständigung bei der Eingabe des Suchbegriffs. Weiterhin kommt eine Fehlerkorrektur dazu, die bei Schreibfehlern Vorschläge für verwandte Städtenamen ausgibt.

Sämtliche Daten hält eine MySQL-Datenbank vor. Die Ausgabe der Daten erfolgt in einer optisch ansprechenden Tabelle, die das DataTables-Plug-in für jQuery umsetzt. Die Anwendung soll dem Prinzip des "Progressive Enhancement" folgen. Das heißt, Nutzer mit alten Browsern oder deaktiviertem JavaScript und/oder CSS sollen das Angebot zumindest noch rudimentär nutzen können. jQuery und jQuery UI folgen dem Prinzip, indem sie das DOM gegebenenfalls ergänzen, aber nicht verstümmeln.

Die Grundlagen der Umgebung

Die Ausgangsbasis für das Projekt ist ein installiertes Eclipse for Java Developers (Indigo, Service Release 2; das neue Eclipse Juno dürfte einem ersten Test zufolge ebenfalls funktionieren). Für die Auflösung der Abhängigkeiten kommt Maven zum Einsatz. Jedes Maven-Projekt benötigt einen passenden Archetype (= Vorlage für ein Softwareprojekt), der die benötigten Komponenten einrichtet. Ein guter Ausgangspunkt für das Projekt ist der Archetype spring-mvc-jpa-archetype (zu finden unter der Group-ID org.fluttercode.knappsack im Katalog NexusIndexer). Er setzt noch Spring 3.0.5 voraus, was für das Szenario aber genügt. Möglicherweise ist er nicht direkt verfügbar, da Eclipse beim Erstaufruf die Liste der Maven-Repositories im Hintergrund aktualisiert. Der Fortschritt lässt sich gut in der Progress View beobachten, eventuell kann man in der View "Maven-Repositories" mit einem Klick auf Rebuild Index nachhelfen.

Die weiteren Angaben sind frei wählbar, als Group-ID bietet sich eine Domain an, etwa com.example.spring3mvc. Als Artifakt-ID setzt man den Projektnamen, z. B. "cities". Das "package" wird freigelassen. Eclipse erstellt das Projekt und lädt die Bibliotheken herunter.

Im Projekt sind bereits eine Menge XML-Konfigurationsdateien für den Servlet-Container und Spring vorhanden, was zunächst verwirrend ist. Es empfiehlt sich aber, die Unterteilung weitgehend beizubehalten, damit die Konfigurationsbereiche auch in größeren Projekten überschaubar bleiben. Hier eine kurze Erklärung:

• src/main/webapp/web.xml: die Basis-Konfigurationsdatei für alle Webangebote (Servlets), in der unter anderem die gewünschten Spring-Module gesetzt werden.
• src/main/webapp/spring/root-context.xml: konfiguriert den globalen Application Context, der für alle auf dem Server laufenden Spring-Anwendungen gilt.
• src/main/webapp/spring/db.xml: übergreifende Konfiguration der Datenbank und des zu verwendenden ORM (z. B. Hibernate).
• src/main/resources/META-INF/persistence.xml: sammelt ORM-spezifische Einstellungen.
• src/main/webapp/spring/app/servlet-context.xml: die wesentliche Spring-Konfigurationsdatei für eine spezifische Anwendung, hier für das DispatcherServlet als Grundlage von Spring MVC.
• src/main/webapp/spring/app/controllers.xml: listet alle Controller der Anwendung beziehungsweise setzt das Basis-Package für die automatische Suche nach Controllern.

Für die lokale Entwicklung benötigt der Entwickler einen Server, etwa Tomcat 7.0. Dieser lässt sich nach der Installation komplett über Eclipse steuern. In der IDE sind noch einige Plug-ins zu installieren. Alle in der Folge gelisteten Module sind unter dem Knoten "Web, XML, Java EE and OSGi Enterprise Development" der Indigo-Release-URL verfügbar:

• Eclipse Java EE Developer Tools
• Eclipse Java Web Developer Tools
• Eclipse Web Developer Tools
• JavaScript Development Tools
• JST Server Adapters
• JST Server Adapters Extensions

Die ersten drei Module sind für die Web- und JavaScript-Entwicklung hilfreich, die JST-Server-Adapter benötigt der Entwickler für die Verbindung zwischen dem lokal installierten Tomcat und Eclipse. Der Server lässt sich nach dem Neustart von Eclipse in der View "Servers" anlegen und starten.

Die Anwendung liest die Städtedaten aus einer MySQL-Datenbank, obgleich sich auch andere Datenbanken mit JDBC-Connector nutzen ließen. Nach der Installation des MySQL Community Server ist auszuwählen, ob MySQL als Dienst (also bei jedem Systemstart im Hintergrund) oder manuell gestartet werden soll. Für den lokalen Test ist Letzteres besser, zum manuellen Start im Installationsverzeichnis muss der Entwickler die \bin\mysqld.exe-Datei ausführen

Für die Anwendung benötigt er nun noch eine Datenbank mit Städtedaten. Eine brauchbare Grundlage findet man hier. Die Datenbank enthält die gewünschten Angaben. Die Daten sind nicht auf dem aktuellen Stand, genügen aber für das Beispiel. Für Fortgeschrittene wäre die freie Geodatenbank von Maxmind eine Alternative, da sie umfangreicher und aktueller ist. Für das Einstiegsbeispiel hier ist sie aber etwas überdimensioniert.

Das Einrichtungsskript world.sql nutzt leider die Zeichenkodierung latin1. Vor der Einrichtung sollte der Anwender das auf UTF-8 ändern. Dazu muss er das Skript in einem UTF-8-fähigen Texteditor (z. B. Notepad++) öffnen, die Zeichenkodierung auf UTF-8 umstellen und am Anfang des Skripts folgende Zeilen einfügen:

SET NAMES utf8;
SET character_set_client = utf8;

Dann hat er per Suchen und Ersetzen alle latin1-Vorkommen in utf8 zu ändern und zu speichern. Nun lässt sich die Datenbank sauber in UTF-8 importieren.

Unter Windows gibt es viele Tools zur MySQL-Verwaltung, etwa HeidiSQL. Um eine neue Datenbank anzulegen, muss der Entwickler sich zunächst mit den Benutzerdaten (Nutzername root, kein Passwort) auf dem MySQL-Server einloggen. Danach hat er eine neue Datenbank "world" mit den Parametern wie im Screenshot anzulegen sowie das eben bearbeitete Skript world.sql zu importieren und auszuführen. Nach kurzer Wartezeit sollte die Tabelle "city" 4079 Einträge haben.

Mit HeidiSQL lassen sich komfortabel neue Nutzer anlegen und Passwörter ändern, was für den Nutzer "root" im Produktivbetrieb dringend zu empfehlen ist.

Damit der Entwickler im Eclipse-Projekt den installierten Tomcat-Server zuweisen kann, aktiviert er unter dem Punkt "Project Facets" in den Projekteigenschaften "Dynamic Web Project". Standardmäßig sieht Eclipse als Ausgabeverzeichnis den Ordner "WebContent" vor, der im Projekt aber nicht existiert – stattdessen wird das Verzeichnis "webapp" genutzt. Man muss also in Eclipse in den Projekteigenschaften unter "Deployment Assembly" den Ordner "src/main/webapp" hinzufügen. Den Ordner "WebContent" kann der Entwickler hier und auf der Festplatte löschen. Außerdem sind die von Maven bereitgestellten Bibliotheken einzubinden, das geht im selben Fenster über Add | Java Build Path Entries | Maven Dependencies.

Nun sollte den Leser eine funktionierende Anwendung begrüßen – dazu muss er das Projekt "cities" dem Tomcat in der View "Servers" hinzufügen und den Server starten. Im Browser erscheint nun unter http://localhost:8080/cities ein "Hello World!".