Services – mit REST, JPA 2, EJB 3.2, JSF 2.2, Angular JS, Bootstrap, JBoss Forge

Die Beispiel-Applikation

Die JEE 7 Beispiel-Applikation ‘library‘ arbeitet mit JSF 2.2 auf Basis der Template-Technologie und ermöglicht die leichte Pflege von und die Suche nach Buchausleihen oder Ausleihen anderer Medien, z.B. PDFs, bestimmter Kategorien durch Kunden einer Stadtbücherei (Stammdatenpflege und Bestandsdatenpflege). Die Beispiel-Applikation verwendet im Backend JPA 2 – Entities und  EJB 3.2.

Mittels JBoss Forge werden sowohl JSF 2.2 Benutzerschnittstellen verfügbar gemacht, als auch die Angular JS GUIs der zweiten JEE 7 Beispiel-Applikation ‘library-angularjs‘. Mit dieser zweiten, responsiven Applikation kann  sich der Kunde der Stadtbücherei auch unterwegs im Browser auf seinem Smartphone die Bibliotheksausleihen ansehen und verwalten, oder nach interessanten Büchern stöbern. Durch diese zwei simplen, übersichtlichen JEE7 Beispielprojekten wird die Verwendung und Effektivität der eingesetzten Technologien gezeigt und diese jeweils als .war Archiv-Deployment auf dem JBoss WildFly 10 Application Server zum Test zur Verfügung gestellt. Hier das Entity-Relationship-Diagramm der ‘library’ Datenbank:

E-R-diagram
(E-R-Diagramm der Beispiel-Applikationen ‘library’ und ‘library-angularjs’)

TDD der Beispiel Applikationen

Wie zusätzliche Selenium-Tests mit dem Selenium FireFox-PlugIn durchgeführt und diese Tests gespeichert  werden können, ist bereits in diesem Blog-Eintrag hier beschrieben. Diese Selenium Tests können gespeichert und in einer Test-Suite zusammengefasst werden, um auch später jederzeit die korrekte Funktionsweise der Eingabe-Aktionen und Link-Aufrufe der Mobile Applikation automatisiert verifizieren zu können.

Bei dieser Gelegenheit darf auch das sehr effektive, interessante und erfolgreiche Seminar

“TDD mit Java”

von Binaris Informatik ebenfalls erwähnt werden.

Verwendete Technologien

a) Die Beispiel-Applikation ‘library-angularjs’:

Die Beispiel-Applikation ‘library-angularjs‘ verwendet im Frontend Angular.js und HTML5-/CSS3, als auch die JavaScript-Bibliotheken Bootstrap.js und in sehr geringem Maß jQuery.

Das MVC Framework ‘Angular JS‘ ermöglicht bekanntlich unter Einsatz des Router Design Patterns und des Front Controller Design Patterns das Erstellen von responsiven (Mobile) Applikationen zur über ein Service Interface verfügbaren Daten aus einem RESTful WebService.

In AngularJS werden mit HTML-Code deklarativ die Oberflächen gestaltet. Ein weiterer Aspekt dabei ist, dass Anwendungslogik nur in den JavaScript-Dateien definiert wird. Dieser sollte weitmöglichst unabhängig von der Benutzeroberfläche bzw. der Anwender-Schnittstelle (User interface) sein. Im Gegensatz zu anderen MVC-Frameworks erweitert AngularJS den HTML-Code, anstatt diesen komplett zu kapseln.

Um einen Bereich einer HTML-Seite von AngularJS verwalten zu lassen, muss dieser von einem Element mit dem Attribut ‘ng-app’ umschlossen sein. Nach dem Laden der Seite sucht AngularJS nach dem Atrribut ‘ng-app’ und analysiert den davon umschlossenen Bereich. ‘Controller’ werden in AngularJS mit dem Attribut ‘ng-controller’ definiert. Controller und View kommunizieren über den ‘Scope’, einen Container auf dessen Inhalt von beiden Seiten aus zugegriffen werden kann. Mit der ‘{{}}’ Notation kann mittels einem One-Way-Binding im HTML auf Elemente des ‘Scope’ zugegriffen werden. Die Daten können angezeigt, aber nicht zurückgeschrieben werden. Two-Way-Bindings ermöglichen auch das Schreiben in den ‘Scope’ und können logischerweise nur an HTML-Input-Elementen verwendet werden.

Eine Iteration über alle Elemente einer list kann in AngularJS mit der Anweisung ‘ng-repeat’ erfolgen, wie im Beispiel ‘library-angularjs‘ zu sehen ist. Innerhalb jedes ‘<li>‘ Elementes wird dann z. B. der Inhalt der Property ‘text’ jedes Listenelementes ausgegeben, welches in der Beispiel-Applikation für das jeweilige Edit-Template innerhalb des jeweilgen JavaScript edit*Controllers an die Erfordernisse angepasst werden kann und für das jeweilige Search-Template innerhalb der jeweiligen search.html.

b) Die Beispiel-Applikation ‘library‘:

Die Beispiel-Applikation ‘library‘ verwendet im Frontend JSF 2.2 und .xhtml-Templates mit HTML5-/CSS3. Hier können auch leicht Rich Faces oder Primefaces, also die jeweils gewünschte JSF-Implementierung anstatt dem MyFaces-Default zum Einsatz kommen. Zusätzlich wird die Forge TagLib verwendet (siehe /META-INF/forge.taglib.xml), welche eine modernere Version einer TagLib ist.

Über den klassischen Einsatz von Tags und TagLibs, z.B. im Zusammenhang mit dem Struts Framework, gibt es bereits einen Blog-Eintrag und oder im Zusammenhang mit Spring Roo einen weiteren Blog-Eintrag in diesem Blog.

c) Das RESTful WebService-Backend beider Beispiel-Applikationen:

Für das JAX-RS Service-Backend beider Beispiel-Applikationen kommt Java EE zum Einsatz (Stateful/Stateless EJB 3.2 und JEE 7) und im Backend Model JPA 2.1 Entities. Über ein Service Interface werden die interessierenden Daten der Beispiel-Applikationen aus einem RESTful WebService verfügbar gemacht.

Maven JEE 7 Artefakte und Dependencies

Wie die Applikationen ‘library‘ und ‘library-angularjs‘ mittels JBoss Forge erstellt werden, ist in diesem Blog-Eintrag hier bereits beschrieben worden, und wie in der pom.xml des jeweiligen Beispielprojekts nach erfolgtem  Download erkennbar ist, werden auch hier die folgenden JEE 7 Artefakte für den JBoss WildFly verwendet und  importiert:

WildFly JBoss Java EE 7 Specification APIs with Tools:
– jboss-javaee-7.0-with-tools
WildFly JBoss Java EE 7 Specification APIs with Resteasy:
– jboss-javaee-7.0-with-resteasy
WildFly JBoss Java EE 7 Specification APIs with Hibernate:
– jboss-javaee-7.0-with-hibernate

Weiterhin werden die folgenden JEE Dependencies (für das Servlet API, Annotationen, JAX-RS Implementierungen, JBoss RESTEasy, Jackson, Hibernate, JPA und EJB) verwendet:

– jboss-annotations-api_1.1_spec
– jboss-jaxrs-api_2.0_spec
– resteasy-jackson2-provider

– hibernate-jpa-2.1-api
– jboss-ejb-api_3.2_spec
– hibernate-jpamodelgen
– jboss-servlet-api_3.1_spec

Einsatz von CDI

Und ebenfalls die CDI 1.1 Dependency:

– cdi-api_1.1

Die Aktivierung von CDI erfolgt mittels beans.xml im WEB-INF Verzeichnis.

Deployment auf JBoss WildFly und Konfigurationen

Die Beispiel-Applikationen wurden auf dem ‘JBoss WildFly 8.2‘ und dem ‘JBoss EAP 6.3‘, sowie dem ‚WildFly 10‘ und dem ‚JBoss EAP 7.0‘ Applikationsserver erfolgreich deployt und getestet und können gerne weiterverwendet und als Open Source weiterentwickelt werden.

Für die Weiterentwicklung, den Build und das Deployment des Projekts ist mindestens Java 7 und Maven 3 erforderlich. Als  Entwicklungsumgebung wurde Eclipse in Form des “JBoss Developer Studios“ mit Java 7 und Java 8 verwendet und die FireFox WebDeveloper IDE/Tools. Als Datenbank wurde MySQL InnoDB 5.x eingesetzt, hier kann aber auch leicht PostgreSQL oder auch gerne eine andere Open Source-Datenbank verwendet werden.

Die Konfiguration des JBoss WildFly Application Servers 10 Final erfolgt analog der Konfigurationen der JBoss Application Server WildFly 8.1, 8.2 und 9 Final und betrifft die Datasource, die MySQL-Datenbank Inno DB 5.x, Hibernate 5, das Logging und den Connection Pool und ist, genau wie die Test-Frameworks und die Aktivierung der RESTful WebService-Schnittstelle, in Blog-Einträgen dieses Blogs bereits beschrieben.

Diese Minimal-Konfiguration betrifft:

  • die MySQL Datenbank/den Java MySQL-Datenbank-Treiber und die MySQL-Datasource der
  • ‘library‘ Beispiel-Applikation
  • die Hibernate Version und ihre interessierenden Features/Dependencies
  • das Start-Skript des WildFly Application Servers

Eine fertige Version der Beispiel-Applikation ‘library‘ kann heruntergeladen und ins Verzeichnis /standalone/deployments gespeichert werden. Genauso kann mit der Beispiel-Applikation ‘library-angularjs‘ verfahren werden. Durch Starten von standalone.bat (Windows)  oder standalone.sh (Linux) kann der JBoss WildFly gestartet werden.

Und die Beispiel-Applikation ‘library-angularjs‘ ist danach z. B. aufrufbar unter der Url: http://localhost:8080/library-angularjs

Die Test-Frameworks und die Tests

a) Arquillian Tests für das Service-Backend

b) QUnit-Tests für die REST-Services

c) Selenium Tests für die Benutzerschnittstelle

Wie Test-Suites, die mit dem Selenium IDE PlugIn durchgeführt wurden und automatisiert ausgeführt werden können, erstellt werden, wurde bereits in diesem Blog beschrieben.

Hier nun auch das Beispiel-Projekt library.zip zum Download und hier ebenfalls das Beispiel-Projekt library-angularjs.zip, in welchem mittels JBoss Forge PlugIn die ausgewählten JSF 2.2 oder Angular JS Views und der RESTful WebService generiert wurden.

Hier das SQL-Skript library.sql zum Anlegen der MySQL-Datenbank zum Download:

library.sql

Hier der WildFly 8.2 als Zip-Archiv zum Download und Entpacken:

wildfly-8.2.0.Final

Und hier auch der WildFly 10 Final als Zip-Archiv zum Download und Entpacken: Für Linux hier und für Windows hier. Voraussetzung ist jeweils Java 8. Über die Konfiguration von Hibernate, der Datasource und der MySQL 5.x Datenbank für den WildFly 9 und den WildFly 10 gibt es bereits mehr Informationen in diesem Blog.

Die fertig konfigurierte Version des WildFly 10.Final mit vielen Beispiel-Applikationen der vorigen Blog-Einträge hier zum Download bereit kann runtergeladen, entpackt und gestartet werden. Dabei ist nur der Pfad für JAVA_HOME in der standalone.xml anzupassen, damit dieser auf das tatsächliche JDK 8-Verzeichnis des Server-Systems zeigt.

Installation/Start der Beispiel-Applikation:

– Die MySQL-Datenbank per library.sql-Skript anlegen.

– JAVA_HOME, JBOSS_HOME entsprechend setzen und

in der standalone.bat oder standalone.sh verwenden oder den vorkonfigurierten Server auspacken Dann noch die folgende datasource (dieselbe für beide Beispiel-Projekte) in der standalone/configuration/standalone.xml eintragen

<datasource jndi-name=“java:jboss/datasources/LibraryDatasource“ pool-name=“LibraryDS“
        enabled=“true“>
        <connection-url>jdbc:mysql://localhost:3306/library</connection-url>
        <driver>mysql-connector-java-5.1.34.jar</driver>
        <transaction-isolation>TRANSACTION_READ_COMMITTED</transaction-isolation>
        <pool>
                <min-pool-size>10</min-pool-size>
                <max-pool-size>100</max-pool-size>
                <prefill>true</prefill>
        </pool>
        <security>
                <user-name>root</user-name>
                <password>das entsprechende Passwort</password>
        </security>
        <statement>
                <prepared-statement-cache-size>32</prepared-statement-cache-size>
                <share-prepared-statements>true</share-prepared-statements>
        </statement>
</datasource>

library.war ins Server-Unterverzeichnis /standalone/deployments speichern
library-angularjs.war ins Server-Unterverzeichnis /standalone/deployments speichern
– Server starten per standalone.bat oder standalone.sh,
http://localhost:8080/library/ bzw. http://localhost:8080/library-angularjs/ aufrufen

– Die Selenium Tests per Selenium IDE PlugIn/Recorder erstellen und ausführen.

Allen interessierten Leserinnen und Lesern weiterhin viel Freude bei der agilen Softwareentwicklung mittels  Scrum und dem Test Driven Development mit Java, sowie weiterhin eine schöne Sommerzeit.