WebApps – Wizards mit Angular JS, JQuery, REST, JEE7, Java8, MySQL 5 auf JBoss WildFly

Die Motivation

In diesem Blog-Eintrag über WebApps wird beschrieben, wie von einem Klassen-Diagramm (UML), genauer: Entity-Relationship-Diagramm, auch E-R Diagramm genannt, eine JEE7-Applikation erstellt werden kann. Diese JEE6- und JEE7-Beispielapplikationen hier liefern mit Hilfe von EJB 3-getriebenen Backends (Session Beans als DAOs, DAO-Pattern) unter Anbindung der JPA 2 Entities (Table-Per-Class-Pattern) mit Hilfe von DTOs über fachliche RESTful ServiceInterfaces oder per Microservices mit Docker, Spring Boot, siehe auch ServiceBroker-Pattern hier, die benötigten Daten zur Präsentation und Bearbeitung (Änderung, Löschen, Neuanlage) in den Web-Frontends, welche die WebServices konsumieren (ServiceConsumer-Pattern).

Der JPA-Provider ist dabei Hibernate von JBoss, welches auf dem WildFly 9 und 10 und 11 zu konfigurieren ist und mittels Criteria-API die Daten für das Frontend liefert, welche im Wizard der Umfrage (“Survey“) dann auswählbar sind. Das Durchlaufen von Step 1 bis Step 3 des Umfrage-Wizards zum Einkaufsverhalten in Online-Shops kann dann hier getestet werden. Hierbei kann entweder eine neue Umfrage eines neuen Teilnehmers mit Step1 gestartet werden, oder eine bereits begonnene Umfrage weitergeführt werden.

Die dynamische Benutzeroberfläche unter Verwendung des Angular JS Frameworks und des Bootstrap-Frameworks passt sich hierbei  an beliebige Auflösungen und Display-Größen responsiv an.

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

“TDD mit Java” von Binaris Informatik erwähnt werden.

Die ausprogrammierte JEE7-Applikation surveyapplication-angularjs mit dem Angular JS-Frontend und dem JEE-Backend mit den JPA 2 Entities kann einfach an verschiedene relationale Datenbanken (z. B. MySQL 5.x oder Postgres 9.x) angebunden werden, weshalb auch benötigte SQL-Export/-Import-Skripte zur Verfügung gestellt werden.

Die Beispiel-Applikation surveyapplication-angularjs wird dann auf dem neusten JBoss WildFly 11 Final Server, dem JBoss WildFly 10 Final Server (entspricht dem neuen JBoss EAP 7-Server) und ebenfalls auf dem JBoss WildFly 9 Final deployt. Dabei wird die Verwendung der beiden neusten JBoss WildFly JEE-Application Server noch genauer beschrieben.

Erstellung der Beispiel Applikation nach Datenmodell

Die Applikation surveyapplication-angularjs kann mittels JBoss Forge erstellt werden und dann daraus ein Wizard für die Umfrage-Beispielapplikation dieses Blog-Eintrags weiterentwickelt werden. Hier das mittels DBeaver erstellte Entity-Relationship Diagramm der surveyapplication-MySQL Datenbank

E-R-diagram
(E-R-Diagramm der Beispiel-Datenbank „surveyapplication“ ohne die MySQL-Sequence-Tabellen.)

In der pom.xml des jeweiligen Beispielprojekts nach erfolgtem Download erkennbar, wurden in der Applikation surveyapplication-angularjs ebenfalls die folgenden JEE 7 Artefakte für den JBoss WildFly identifiziert, verwendet und importiert:

Maven JEE 7 JBoss-Artefakte und Maven Dependencies

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

Und ebenfalls die CDI 1.1 Dependency:

– cdi-api_1.1

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

WildFly Anbindung an MySQL5 und WildFly 11 Hibernate-Konfiguration

Die Konfiguration des JBoss WildFly Application Servers 11 Final erfolgt analog der Konfigurationen der JBoss Application Server WildFly 8.1, 8.2, 9 und 10 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 ein wichtiges Thema, welches noch genauer beschrieben werden wird. Die Anbindung an die relationale  Datenbank MySQL 5 erfolgt übrigens analog für die JBoss Application Server WildFly 8.1, 8.2, 9, 10 und WildFly 11.

Je nach verwendeter Datenbank kann in der persistence.xml im Deployment-Paket der Beispiel-App surveyapplication-angularjs.war ein entsprechender Datenbank-Dialekt eingetragen werden:

Hier die /META-INF/persistence.xml der Beispiel-Applikation für MySQL5:

    <xml version=“1.0″ encoding=“UTF-8″?>
    <persistence version=“2.0″ xmlns=“http://java.sun.com/xml/ns/persistence“  xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance“
    xsi:schemaLocation=“http://java.sun.com/xml/ns/persistence
    http://java.sun.com/xml/ns/persistence/persistence_2_0.xsd“>
    <persistence-unit name=“SurveyapplicationPU“>
    <provider>org.hibernate.ejb.HibernatePersistence</provider>
    <jta-data-source>
            java:jboss/datasources/SurveyapplicationDatasource
    </jta-data-source>
    <properties>
    <property name=“hibernate.hbm2ddl.auto“ value=“none“/>
    <property name=“hibernate.show_sql“ value=“false“/>
    </properties>
    </persistence-unit>
    </persistence>

Dafür wird je Datenbank die folgende Datasource benötigt und ist in der standalone/configuration/standalone.xml des JBoss WildFly Servers unter den <datasources> einzutragen:

Datasource für MySQL 5:

    <datasource jndi-name=“java:jboss/datasources/SurveyapplicationDatasource“ pool-name=“SurveyapplicationDS“
    enabled=“true“>
    <connection-url>jdbc:mysql://localhost:3306/surveyapplication</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>

Für die erfolgreiche Anbindung der soeben deklarierten Datasoures werden die Datenbank-Treiber auf Modul-Ebene des JBoss WildFly konfiguriert, wie hier für den MySQL JDBC4 Treiber beispielhaft auf dem WildFly 8.2 beschrieben wurde.

Damit die Datasources die soeben konfigurierten Treiber auch finden, werden diese in der /standalone/configuration/standalone.xml bei den <datasources> deklariert:

Für MySQL 5:

<driver name=“mysql-connector-java-5.1.34.jar“ module=“com.mysql“>
   <driver-class>com.mysql.jdbc.Driver</driver-class>
   <xa-datasource-class>com.mysql.jdbc.jdbc2.optional.MysqlXADataSource
   </xa-datasource-class>
</driver>

Hier auch der komplette MySQL-Export der Beispiel-Applikation surveyapplication-angularjs:

Für MySQL 5: export_surveyapplication_database.txt

Die Hibernate-Konfiguration des WildFly 11 Final Servers ist ebenfalls leicht durchführbar. Hierfür werden im WildFly11 Server-Verzeichnis wildfly-11.0.0.Final/modules/system/layers/base/org/hibernate/main folgende Dateien hinterlegt:

– hibernate-core-5.1.10.Final.jar
– hibernate-entitymanager-5.1.10.Final.jar
– hibernate-envers-5.1.10.Final.jar
– hibernate-java8-5.1.10.Final.jar
– jipijapa-hibernate5-11.0.0.Final.jar
– module.xml
– mysql-connector-java-5.1.34.jar
– mysql-connector-java-5.1.34.jar.index

Die fertige Beispiel-Applikation surveyapplication-angularjs kann zusammen mit den anderen Beispiel-Applikationen hier betrachtet werden (MySQL5 Server, Postgres 9 auf Linux).

Hier 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.

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, wie in diesem Blog-Eintrag hier beschrieben wurde, damit dieser auf das tatsächliche JDK 8-Verzeichnis des Server-Systems zeigt und auch der Pfad für das log-Dateien Verzeichnis in der Datei [server]/standalone/configuration/logging.properties.

Hier auch der WildFly 11 Final als Zip-Archiv zum Download und Entpacken: Für Linux hier und für Windows hier. Minimale Voraussetzung ist jeweils Java 8, er wird hier aber bereits mit Java 9 betrieben. Der fertig konfigurierte WildFly 11 mit vielen weiteren Beispiel-Applikationen ist hier zum Download verfügbar, kann runtergeladen, entpackt und gestartet werden.

Auch hier ist nur der Pfad des JAVA_HOME anzupassen, damit dieser auf das tatsächliche JDK 9 – Verzeichnis des Server-Systems zeigt und ebenfalls der Pfad für das log-Dateien Verzeichnis in der logging.properties.

Die Angular JS Beispiel-Applikation dieses Blog-Eintrags kann danach selbst erneut deployt werden, ohne den bereits gestarteten WildFly 11 Application Server überhaupt stoppen oder erneut starten zu müssen. Bei laufendem Server einfach ins Server-Unterverzeichnis /standalone/deployments

– eine leere Textdatei namens surveyapplication-angularjs.war.dodeploy speichen und
sofort wird die Beispiel-Applikation deployt und in wenigen Sekunden gestartet und kann aufgerufen werden:

http://[domainname z. B. localhost]:[http-port, z. B. 8080]/surveyapplication-angularjs

Fazit: Wie man sieht, macht es einfach viel Freude, z.B. mittels JBoss Forge und JPA 2 Entities die responsiven Angular JS Apps auf dem Datenmodell zu erzeugen und weiterzuentwickeln oder eben robuste, komfortable, Browser-basierte Primefaces 6-Fontends, sei es nun für mobile IMS (Informations-Management-Systeme) oder für PIMS (Product Information Management Systems) und diese an einen neuen, die JEE7-Spezifikation erfüllenden JBoss (EAP oder WildFly 9, WildFly 10) anzubinden.

Somit besteht durchaus die Möglichkeit, dass noch weitere Blog-Einträge zu Webframeworks wie Primefaces 6, Angular JS und Bootstrap, sowie den die JEE7-Spezifikation implementierenden WebService-und Backend-Technologien folgen. Allen interessierten Leserinnen und Lesern weiterhin viel Freude bei der agilen Softwareentwicklung mittels Scrum und dem Test-Driven Development mit Java, sowie weiterhin einen schönen Frühling.