6. Anhänge
Hier erklären wir, wie man die in diesem Dokument verwendeten Tools auf Windows-7-Rechnern installiert.
6.1. Installation von STS (Spring Tool Suite)
Wir installieren die SpringSource Tool Suite [http://www.springsource.com/developer/sts], eine Eclipse-Umgebung, die bereits mit zahlreichen Plugins zum Spring-Framework sowie einer vorinstallierten Maven-Konfiguration ausgestattet ist.
![]() |
- Gehen Sie auf die Website der SpringSource Tool Suite (STS) [1], um die aktuelle Version von STS [2A] [2B] herunterzuladen.
![]() |
![]() |
- Die heruntergeladene Datei ist ein Installationsprogramm, das die Verzeichnisstruktur [3A] [3B] erstellt. In [4] starten wir die ausführbare Datei,
- in [5] das IDE-Arbeitsbereichsfenster nach dem Schließen des Begrüßungsfensters. In [6] wird das Anwendungsserver-Fenster angezeigt,
![]() |
- in [7] das Serverfenster. Ein Server ist registriert. Es handelt sich um einen Tomcat-kompatiblen VMware-Server.
Die Verwendung von STS innerhalb der Anwendung wird in Abschnitt 1.3.2 erläutert.
6.2. Installation von [ WampServer]
[WampServer] ist ein Softwarepaket für die Entwicklung mit PHP/MySQL/Apache auf einem Windows-Rechner. Wir werden es ausschließlich für das MySQL-DBMS verwenden.
![]() |
- Wählen Sie auf der [WampServer]-Website [1] die passende Version [2] aus.
- Die heruntergeladene ausführbare Datei ist ein Installationsprogramm. Während der Installation werden Sie nach verschiedenen Informationen gefragt. Diese beziehen sich nicht auf MySQL, sodass Sie sie ignorieren können. Am Ende der Installation erscheint das Fenster [3]. Starten Sie [WampServer],
![]() |
- In [4] erscheint das [WampServer]-Symbol in der Taskleiste unten rechts auf dem Bildschirm [4].
- wenn Sie darauf klicken, erscheint das Menü [5]. Damit können Sie den Apache-Server und das MySQL-DBMS verwalten. Um Letzteres zu verwalten, verwenden Sie die Option [PhpMyAdmin],
- wodurch das unten abgebildete Fenster geöffnet wird,

Wir werden einige Details zur Verwendung von [PhpMyAdmin] bereitstellen. In Abschnitt 1.3.1 zeigen wir, wie man damit die Datenbank der Anwendung erstellt.
6.3. Installation von [WebStorm]
[WebStorm] (WS) ist die IDE von JetBrains zur Entwicklung von HTML/CSS/JS-Anwendungen. Ich fand sie perfekt für die Entwicklung von Angular-Anwendungen. Die Download-Seite ist [http://www.jetbrains.com/webstorm/download/]. Es handelt sich um eine kostenpflichtige IDE, aber eine 30-Tage-Testversion steht zum Download bereit. Es gibt erschwingliche Versionen für Privatpersonen und Studenten.
Die Verwendung innerhalb der Anwendung wird in Abschnitt 1.3.3 beschrieben. Um JS-Bibliotheken in einer Anwendung zu installieren, verwendet WS ein Tool namens [bower]. Dieses Tool ist ein Modul von [node.js], einer Sammlung von JS-Bibliotheken. Zusätzlich werden JS-Bibliotheken aus einem Git-Repository abgerufen, was einen Git-Client auf dem Rechner erfordert, der den Download durchführt.
6.3.1. Installation von [node.js]
Die Download-Seite für [node.js] lautet [http://nodejs.org/]. Laden Sie das Installationsprogramm herunter und führen Sie es aus. Das ist vorerst alles, was Sie tun müssen.
6.3.2. Installation des [bower]-Tools
Das [bower]-Tool, mit dem Sie JavaScript-Bibliotheken herunterladen können, lässt sich auf verschiedene Arten installieren. Wir werden es über die Befehlszeile installieren:
C:\Users\Serge Tahé>npm install -g bower
C:\Users\Serge Tahé\AppData\Roaming\npm\bower -> C:\Users\Serge Tahé\AppData\Roaming\npm\node_modules\bower\bin\bower
bower@1.3.7 C:\Users\Serge Tahé\AppData\Roaming\npm\node_modules\bower
├── stringify-object@0.2.1
├── is-root@0.1.0
├── junk@0.3.0
...
├── insight@0.3.1 (object-assign@0.1.2, async@0.2.10, lodash.debounce@2.4.1, req
uest@2.27.0, configstore@0.2.3, inquirer@0.4.1)
├── mout@0.9.1
└── inquirer@0.5.1 (readline2@0.1.0, mute-stream@0.0.4, through@2.3.4, async@0.8
.0, lodash@2.4.1, cli-color@0.3.2)
- Zeile 1: Der [node.js]-Befehl, der das [bower]-Modul installiert. Damit der Befehl funktioniert, muss sich die ausführbare Datei [npm] im PATH des Rechners befinden (siehe Absatz unten);
6.3.3. Installation von [Git]
Git ist ein System zur Versionskontrolle von Software. Unter der URL [http://msysgit.github.io/] ist eine Windows-Version namens [msysgit] verfügbar. Wir werden [msysgit] nicht zur Verwaltung der Versionen unserer Anwendung verwenden, sondern lediglich zum Herunterladen von JS-Bibliotheken, die auf Websites wie [https://github.com] zu finden sind und ein spezielles Zugriffsprotokoll erfordern, das vom [msysgit]-Client bereitgestellt wird
Der Installationsassistent umfasst mehrere Schritte, darunter die folgenden:
![]() | ![]() |
Bei den übrigen Installationsschritten können Sie die vorgegebenen Standardwerte übernehmen.
Sobald Git installiert ist, überprüfen Sie, ob sich die ausführbare Datei im PATH Ihres Computers befindet: [Systemsteuerung / System und Sicherheit / System / Erweiterte Systemeinstellungen]:
![]() | ![]() |
Die PATH-Variable sieht wie folgt aus:
D:\Programs\devjava\java\jdk1.7.0\bin;D:\Programs\ActivePerl\Perl64\site\bin;D:\Programs\ActivePerl\Perl64\bin;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\client;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\client\bin;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\server\bin;...;D:\Programs\javascript\node.js\;D:\Programs\utilitaires\Git\cmd
Stellen Sie sicher, dass:
- der Pfad zum Installationsordner von [node.js] vorhanden ist (hier D:\Programme\javascript\node.js);
- der Pfad zur ausführbaren Datei des Git-Clients vorhanden ist (hier D:\Programme\Utilities\Git\cmd);
6.3.4. Konfigurieren von [WebStorm]
Überprüfen wir nun die [WebStorm]-Konfiguration
![]() | ![]() |
![]() |
Wählen Sie oben die Option [1] aus. Die Liste der bereits installierten [node.js]-Module wird unter [2] angezeigt. Diese Liste sollte nur die Zeile [3] für das [bower]-Modul enthalten, wenn Sie den vorherigen Installationsprozess befolgt haben.
6.4. Installation eines Android-Emulators
Die im Android SDK enthaltenen Emulatoren sind langsam, was von ihrer Verwendung abhält. Das Unternehmen [Genymotion] bietet einen wesentlich leistungsfähigeren Emulator an. Er ist unter der URL [https://cloud.genymotion.com/page/launchpad/download/]
(Februar 2014).
Sie müssen sich registrieren, um eine Version für den privaten Gebrauch zu erhalten. Laden Sie das [Genymotion]-Produkt mit der virtuellen Maschine VirtualBox herunter;

Installieren Sie [Genymotion] und starten Sie es anschließend. Laden Sie als Nächstes ein Image für ein Tablet oder Smartphone herunter:
![]() |
- Fügen Sie unter [1] ein virtuelles Gerät hinzu;
- Wählen Sie unter [2] ein oder mehrere Geräte zur Installation aus. Sie können die angezeigte Liste verfeinern, indem Sie die gewünschte Android-Version [3] und das Gerätemodell [4] angeben;
![]() |
- Sobald der Download abgeschlossen ist, sehen Sie [5] eine Liste der virtuellen Geräte, die zum Testen Ihrer Android-Apps zur Verfügung stehen;
6.5. Installation des Chrome-Plugins [Advanced Rest Client]
In diesem Dokument verwenden wir den Chrome-Browser von Google (http://www.google.fr/intl/fr/chrome/browser/). Wir werden die Erweiterung [ Advanced Rest Client] hinzufügen. So geht’s:
- Rufen Sie den [Google Web Store] (https://chrome.google.com/webstore) über den Chrome-Browser auf;
- suchen Sie nach der App [Advanced Rest Client]:
![]() |
- Die App steht dann zum Download bereit:
![]() |
- Um sie zu erhalten, müssen Sie ein Google-Konto erstellen. Der [Google Web Store] fordert Sie dann zur Bestätigung auf [1]:
![]() |
- Unter [2] ist die hinzugefügte Erweiterung in der Option [Apps] [3] verfügbar. Diese Option erscheint auf jedem neuen Tab, den du im Browser erstellst (STRG-T).

















