JHipster: Die Framework-Suite für moderne Webanwendungen

Wenn Sie heutzutage eine Webanwendung entwickeln, stehen Ihnen diverse Code-Generatoren und Frameworks zur Verfügung, die Ihnen als Werkzeug undCode-Basis für Ihr Projekt eine Menge Arbeit ersparen. Dabei ist es jedoch häufig gar nicht so einfach, solche Bausteine zu finden und zusammenzubringen, die optimal miteinander harmonieren und insbesondere auch zu Ihrer Applikation passen. Aus diesem Grund hat das Team von JHipster einige der beliebtesten Frameworks zur Front- und Backend-Entwicklung in seiner gleichnamigen Plattform vereint. Der Mix aus Spring Boot, AngularJS, Bootstrap und vielen anderen Komponenten ist komplett Open Source und perfekt für die Kreation moderner Webanwendungen und Microservices geeignet.

Was ist JHipster?

Gemeinsam mit einer Handvoll anderer Entwickler veröffentlichte Julien Dubois im Oktober 2013 das Projekt JHipster (Kurzform für „Java Hipster“). Der Name stand dabei in erster Linie für das Konzept des Webanwendungs-Generators, denn JHipster sollte Java und alle zu diesem Zeitpunkt angesagten Tools der Webentwicklung vereinen. Heute zielt die Framework-Kollektion insbesondere auf den Enterprise-Sektor ab, wobei der Fokus darauf liegt, eine hohe Produktivität während des Entwicklungsprozesses sowie eine exzellente Qualität der entwickelten Anwendung zu ermöglichen. Für die stetige Weiterentwicklung ist ein Team aus mehr als 15 Kernentwicklern und hunderten Mitwirkenden verantwortlich. Der JHipster-Code, der unter der Apache-2.0-Lizenz vertrieben wird, steht dabei allen Interessierten auf GitHub zur freien Verfügung.

Die Komponenten von JHipster im Überblick

JHipster liefert sowohl Lösungen zur Kreation und Gestaltung des Frontends als auch die notwendigen Tools für die Backend-Entwicklung. So stellt beispielsweise das Framework Spring Boot die perfekte Grundlage bereit, um einen robusten Java-Stack auf der Server-Seite zu generieren, der sich spielend einfach an diverse Datenbanken, Virtualisierungs-Engines und Monitoring-Tools anbinden lässt und via REST-Schnittstelle mit dem Frontend verknüpft ist. Unter anderem unterstützt JHipster folgende serverseitige Optionen:

  • Datenbanken: MariaDB, PostgreSQL, Oracle, MySQL, MongoDB
  • Virtualisierung: Docker, Kubernetes, AWS
  • Testumgebung: Karma, Cucumber
  • Indexierung: ElasticSearch
  • Caching: Ehcache, Infinispan
  • Monitoring: Prometheus

Was die Frontend-Entwicklung betrifft, setzt JHipster vor allem auf das JavaScript-Framework Angular.js und die JavaScript-Bibliothek React. Beide lassen sich wahlweise mit Twitter Bootstrap, seines Zeichens Vorreiter der Web-Grundgerüste, und dem alternativen Web-Template HTML5 Boilerplate kombinieren. Optional lässt sich JHipster um die Stylesheet-Sprache Sass erweitern, was die Gestaltung via CSS3 vereinfacht.

Für den optimalen Workflow bei der Nutzung dieser unterschiedlichen Out-of-the-Box-Lösungen sorgen derweil Tools wie der Code-Generator Yeoman, der JavaScript-Modulbündler Webpack oder die Build-Management-Anwendungen Gulp (für JavaScript) und Maven und Gradle (für Java).

Welche Vorteile bietet die Entwicklung mit JHipster?

Wie die obige Auflistung zeigt, zeichnet sich die JHipster-Kollektion insbesondere dadurch aus, dass die einzelnen Komponenten perfekt aufeinander abgestimmt sind. Wenn Sie Ihr Webprojekt mit Java programmieren wollen, sollten Sie den Einsatz der Suite also in jedem Fall in Erwägung ziehen. JHipster senktnicht nur die Einstiegshürden, die mit der Entwicklung verbunden sind, sondern vereinfacht und vereinheitlicht den gesamten Programmierungsprozess – sei es bei der eigentlichen Entwicklung der Applikation oder bei anschließenden Überarbeitungen und Erweiterungen des Codes. Da JHipster Ihnen außerdem direkt die wichtigsten Werkzeuge zur Entwicklung bereitstellt, können Sie durch die Nutzung der Framework-Kollektion reichlich Zeit sparen.

Mit JHipster können Sie zudem innerhalb kürzester Zeit eine Webapplikation generieren, die CRUD-Operationen unterstützt und einen klar strukturierten Quellcode aufweist. Auch weitere, nützliche Features wie Benutzermanagement oder Internationalisierung stehen zur Verfügung.

JHipster-Tutorial: Installation und erste Schritte mit dem JHipster-Paket

Nach dieser kurzen Einführung zum Konzept von JHipster erfahren Sie im folgenden Tutorial, wie Sie die Framework-Kollektion installieren. Zudem erläutern wir Ihnen die ersten Schritte, die es bei der Nutzung der Codegerüste zu bewältigen gilt.

Schritt 1: So installieren Sie JHipster

Sie haben verschiedene Möglichkeiten, um JHipster aufzusetzen. So können Sie beispielsweise auf die „development box“ zurückgreifen. Sie basiert auf der Software Vagrant und bringt JHipster auf einer virtuellen Ubuntu-Maschine zum Laufen. Für Docker-Fans dürfte hingegen der JHipster-Container auf GitHub interessanter sein, der ein Image bereitstellt, mit dessen Hilfe Sie die Framework-Suite innerhalb von Docker ausführen können. Natürlich ist auch die klassische, lokale Installation auf dem eigenen Server möglich, wobei Sie entweder npm oder Yarn als Paketmanager verwenden können. Letzterer ist die vom Entwickler-Team empfohlene Wahl, weshalb er auch in diesem JHipster-Tutorial Grundlage für den Installationsprozess ist. Dieser Prozess gestaltet sich wie folgt:

  1. Laden Sie die Installationspakete für Java SE 8 von der Oracle-Homepage herunter und installieren die Laufzeitumgebung im Anschluss.
  2. Laden Sie die Installationspakete von Node.js auf der Anbieterseite herunter und installieren Sie diese ebenfalls. Das JHipster-Team empfiehlt in diesem Zusammenhang eine 64-Bit-Version mit Langzeit-Support (LTS).
  3. Installieren Sie Yarn auf Ihrem Server, indem Sie den systemspezifischen Anweisungen im Installationsverzeichnis der Yarn-Homepage folgen.
Hinweis

Haben Sie eine oder mehrere der hier genannten Anwendungen bereits installiert, können Sie sich entsprechende(n) Installationsschritt(e) an dieser Stelle natürlich sparen.

Über den Paketmanager können Sie nun die Generator-Anwendung Yeoman und schließlich JHipster selbst beziehen und installieren. Geben Sie hierfür nacheinander folgende Befehle ein:

yarn global add yo
yarn global add generator-jhipster
Hinweis

Mit JHipster Online gibt es außerdem eine Alternative, die keinerlei Installation zur Nutzung des Framework-Pakets voraussetzt. Der Service generiert eine vollständige JHipster-Applikation, die Sie entweder auf einem bestehendenGitHub-Account hosten oder im ZIP-Format herunterladen können.

Schritt 2: Das erste eigene Projekt erstellen

Sind alle Komponenten installiert, können Sie Ihre ersten Schritte mit dem JHipster-Generator wagen und ein erstes Beispiel-Projekt erzeugen. Zu diesem Zweck benötigen Sie zunächst ein Home-Verzeichnis (hier „jhipster-beispiel“ genannt), in das die entsprechenden Dateien gespeichert werden. Selbiges lässt sich mit diesem einfachen Kommandozeilenbefehl anlegen:

mkdir jhipster-beispiel

Anschließend navigieren Sie in das angelegte Verzeichnis und führen dort den JHipster-Startbefehl aus:

yo jhipster

Der Generator präsentiert Ihnen dann eine Reihe von Fragen, anhand derer Sie den Typ Ihrer Applikation definieren und gewünschte Features und Software auswählen können. Auf diese Weise bestimmen Sie zum Beispiel, ob ein Caching-Mechanismus implementiert oder welches Tool zur Gestaltung des Backends (Gradle oder Maven) verwendet werden soll. Des Weiteren aktivieren Sie an dieser Stelle – falls benötigt – die Unterstützung zur Internationalisierung Ihres Projekts und wählen die Basissprache und zusätzliche Sprachvarianten aus. In den meisten Fällen genügt für unser Testobjekt der voreingestellte Wert.

Haben Sie das Set-up Ihrer Wahl gefunden, können Sie den Generierungsprozess starten. Läuft dieser reibungslos ab, erhalten Sie nach kurzer Zeit automatisch Rückmeldung, dass Server- und Client-Applikation erfolgreich generiert werden konnten.

Schritt 3: Serveranwendung starten und ins Backend einloggen

JHipster hat nun das Grundgerüst Ihrer Webanwendung erstellt und den dazu passenden Code in dem angelegten Verzeichnis hinterlegt. Aus diesem heraus können Sie jetzt Ihre eigene, auf Spring Boot basierende Server-Instanz starten. Mit welchem Kommando dies gelingt, hängt davon ab, für welches Tool zur Backend-Gestaltung Sie sich entscheiden. Fällt Ihre Wahl auf Maven, dann führen Sie die Server-Komponente mithilfe des in JHipster integrierten Maven-Wrappers durch folgenden Befehl aus:

./mvnw (unter macOS/Linux)
mvnw (unter Windows)

Haben Sie sich für Gradle entschieden, lautet das erforderliche Kommando:

./gradlew (unter macOS/Linux)
gradlew (unter Windows)
Hinweis

Haben Sie Maven bzw. Gradle auf Ihrem System installiert, genügen die Befehle „mvn“ bzw. „gradle“.

Haben Sie bei der Generierung Ihres JHipster-Projekts keinen anderen Port angegeben (standardmäßig ist Port 8080 reserviert), dann können Sie das Backend nun unter der Adresse „localhost“ in jedem gängigem Browser aufrufen. Dadurch öffnet sich die Startseite, über die Sie sich im Backend einloggen können.

Die Standarddaten für den Administratoren- sowie für den einfachen Nutzerzugang liefert die Seite gleich mit:

 

Administratorenkonto

Nutzerkonto

Name

admin

user

Passwort

admin

user

Schritt 4: Administration Ihres JHipster-Projekts

Im Zuge der Anmeldung im Administratorenkonto wird die Menüleiste der Server-Instanz um die beiden Punkte „Administration“ und „Entitäten“ erweitert. Erstgenannten benötigen Sie, um Ihre Webanwendung zu verwalten. Dabei stehen Ihnen folgende Optionen zur Verfügung:

  • Benutzerverwaltung: In der Benutzerverwaltung erstellen, bearbeiten und löschen Sie die Benutzerprofile, die Zugang zu Ihrer JHipster-Applikation haben. Dabei ist unter anderem auch die Verteilung von Rollen möglich.
  • Applikations-Metriken: In der Metriken-Rubrik finden Sie Angaben über die Speicherauslastung sowie Informationen über eingehende HTTP-Anfragen sowie Service- und Caching-Statistiken.
  • Applikations-Status: Unter „Gesundheit“ erhalten Sie eine kleine Übersicht über die Funktionalität Ihrer Applikations-Komponenten wie Festplattenspeicher oder Datenbanken.
  • Konfiguration: Über die Schaltfläche „Konfiguration“ öffnen Sie das Menü für die generellen Einstellungen Ihres JHipster-Projekts.
  • Audits: Die Audits gewähren Ihnen einen Überblick über erfolgreiche (AUTHENTICATION_SUCCESS) und gescheiterte (AUTHENTICATION_FAILURE) Log-in-Versuche inklusive Angaben zu Zeitpunkt und Benutzer.
  • Protokolle/Logs: Hier erhalten Sie Einsicht in aktive Log-Mechanismen. Zudem haben Sie die Möglichkeit, eine Stufe für das Logging zu definieren (Warnung, Informierung, Verfolgung, Fehlermeldung etc.).
  • API-Übersicht: In der API-Übersicht sehen Sie alle REST-Schnittstellen Ihrer Applikation inklusive der Codes zum Ansteuern dieser APIs (optional für jedes API ausklappbar).
  • Datenbank: Schließlich bietet das JHipster-Backend auch ein Interface für Ihre Datenbanken, über das Sie die Verbindung testen und aufbauen können.

Über den Reiter „Sprache“ können Sie zudem die Sprachversion der Oberfläche Ihrer Spring-Boot-Server-Instanz ändern.

Mit dem weiteren Klick laden Sie das Video von YouTube. In diesem Fall kann YouTube Cookies setzen, auf welche wir keinen Einfluss haben.

Schritt 5: Neue Entitäten erstellen

Im vorangegangenen Schritt ist der zweite wichtige Menüpunkt des JHipster-Backends, der die Bezeichnung „Entitäten“ trägt, bereits zur Sprache gekommen. Über diese Einheiten, die Sie jederzeit einsehen, bearbeiten oder löschen können (dank des bereits erwähnten CRUD-Konzepts), liefern Sie Input für Ihre Datenbanken – und damit auch inhaltlichen Input für Ihr Projekt. Um solche Entitäten in JHipster zu kreieren, haben Sie verschiedene Möglichkeiten zur Verfügung: Standardlösung ist der Entity-Sub-Generator, der sich über die Kommandozeile bedienen lässt. Die Syntax dieses Generators sieht folgendermaßen aus:

jhipster entity <entityName> -- [options]

Um die Möglichkeiten des Tools kennenzulernen, empfiehlt sich die die Eingabe von „jhipster entity --help“. Der Befehl listet Ihnen die verfügbaren Optionen auf (wie auch der folgende Screenshot zeigt):

Alternativ können Sie die Entitäten auch mithilfe eines grafischen Tools erzeugen. Hierfür haben Sie zwei Möglichkeiten: Der UML-EditorJHipster UML, den Sie auf GitHub finden, sowie die Online-AnwendungJDL-Studio, die auf der domainspezifischen Sprache JDL (JHipster Domain Language) basiert.


Auf dem Laufenden bleiben?

Jetzt für unseren Newsletter anmelden und gratis Online-Marketing Whitepaper für lokale Anbieter sichern!