JHipster

I parte: Introduciamo JHipster con un esempio praticodi e e

Introduzione

Il termine “JHipster” deriva da “Java Hipster” perché il suo obiettivo iniziale era quello di utilizzare tutti gli strumenti moderni più cool con una forte attenzione sulla produttività degli sviluppatori.

JHipster fornisce gli strumenti per generare un progetto con uno stack Java sul lato server basato su Spring e un front-end web evoluto sul lato client con AngularJS e Bootstrap.

 

Che cosa è JHipster

JHipster è un code generator, o meglio, un application generator usato per la creazione guidata di una moderna web application basata su Spring Boot e AngularJS.

JHipster è inoltre basato sul tool di scaffolding di Yeoman e sfrutta strumenti di build di pacchetti come Gulp, NPM e Bower.

Figura 1 – I principali framework e tool utilizzati da JHipster.

Figura 1 – I principali framework e tool utilizzati da JHipster.

Installazione di JHipster

Le precondizioni per utilizzare JHipster sono le seguenti:

  • utilizzare la versione 8 di Java [4]
  • Git [5]
  • js [6]
  • Maven [7]

Dopo avere installato questi tool bisogna lanciare da riga di comando i seguenti comandi.

Per Yeoman:

npm install –g yo

Per Bower

npm install –g bower

Per Gulp:

npm install –g gulp

A questo punto si può finalmente installare JHipster:

(0)npm install -g generator-jhipster

 

Un’applicazione di esempio: jhmoka

Per mettere in evidenza le potenzialità di JHipster creamo una semplice applicazione di esempio: jhmoka (JHipster MokaByte). Si tratta di una rubrica per poter censire gli autori di Mokabyte.

Primi passi

Il primo step è creare una directory ad hoc per l’applicazione di esempio di nome jhmoka:

(1) mkdir jhmoka

Il secondo step è lanciare JHipster nella directory jhmoka appena creata.

(2) yo jhipster

Verrà presentata la shell di JHipster che guiderà la creazione della web application tramite una serie di domande relative alla configurazione.

Figura 2 – Le domande richieste da JHipster per la creazione dell’architettura dell’applicazione jhmoka.

Figura 2 – Le domande richieste da JHipster per la creazione dell’architettura dell’applicazione jhmoka.

Le caratteristiche di jhmoka

Nel nostro esempio vogliamo generare un’applicazione Web “monolitica” che:

  • utilizzi come naming delle classi mokabyte.jhmoka;
  • utilizzi il DBMS MySQL;
  • faccia uso di EHCache;
  • gestisca l’internazionalizzazione (i18n) in inglese e italiano;
  • utilizzi Maven come tool di software configuration management.

Fatto questo, JHipster avvia la generazione di quanto richiesto. Alla fine della generazione bisogna invocare il comando per lanciare Maven all’interno della directory jhmoka.

(3) mvnw.cmd

Terminata l’esecuzione di Maven, l’applicazione jhmoka generata sarà disponibile al seguente URL:

(4) http://127.0.0.1:8080
Figura 3 – Avvio applicazione jhmoka generata da JHipster.

Figura 3 – Avvio applicazione jhmoka generata da JHipster.

 

Una volta inserito l’URL, compare la home page.

Figura 4 – Home page applicazione jhmoka.

Figura 4 – Home page applicazione jhmoka.

 

Dalla home page è possibile fare il login utilizzando come utente e password “admin” selezionando in alto a destra Account e Sign In.

Figura 5 – Login applicazione jhmoka.

Figura 5 – Login applicazione jhmoka.

Creare le entità

A questo punto è possibile creare delle entità (Entity) nella nostra applicazione mediante il comando da riga di comando sempre all’interno della home directory jhmoka.

(5) yo jhipster:entity Author

Per ogni campo, il tool JHipster richiederà:

  • il nome;
  • il tipo;
  • il controllo sintattico che si vuole implementare;
  • la tipologia del controllo sintattico.

Ad esempio, nel nostro caso vogliamo creare un’entità di nome Author (l’autore di articoli di MokaByte) con:

  • nome articolista Mokabyte (name);
  • cognome articolista Mokabyte (surname);
  • email articolista Mokabyte (email).
Figura 6 – Creazione del campo “name” dell’Entità “author”.

Figura 6 – Creazione del campo “name” dell’Entità “author”.

 

Richiediamo che il campo name sia una stringa e richiediamo i seguenti due controlli sintattici usando la barra spaziatrice:

  • obbligatorietà del campo e una lunghezza minima (figura 6);
  • lunghezza minima di 2 caratteri (figura 7).
Figura 7 – Lunghezza minima di 2 caratteri del campo “name”.

Figura 7 – Lunghezza minima di 2 caratteri del campo “name”.

 

Stesso discorso lo richiediamo per il secondo campo: surname.

Per il terzo e ultimo campo email, aggiungiamo anche il controllo relativo alla seguente espressione regolare per verificare l’indirizzo di posta elettronica:

^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$
Figura 8 – Creazione del campo email dell’entità “author” con espressione regolare da controllare.

Figura 8 – Creazione del campo email dell’entità “author” con espressione regolare da controllare.

 

Alle successive domande bisogna esplicitare l’utilizzo del mapping e dell’implementazione dei servizi.

Ultimi passaggi

JHipster crea una directory di nome “.jhipster” e un file di nome “Author.json” includendo tutti i controlli richiesti. Questo file sarà usato dalla parte web per controllare i dati input per ogni autore che verrà creato.

Figura 9 – File \jhmoka\.jhipster\Author.json

Figura 9 – File \jhmoka\.jhipster\Author.json

 

Rilanciamo l’applicazione con il comando mvnw.cmd e colleghiamoci con il browser all’URL http://127.0.0.1:8080. A questo punto si effettua il login si seleziona in alto a destra “Entities”: scegliendo dal menu a tendina la voce “Author”, compare la pagina web che ci permette, in modalità CRUD, di creare, leggere, aggiornare ed eliminare entità di tipo Author.

Figura 10 – Pagina CRUD.

Figura 10 – Pagina CRUD.

 

In modo agevole è possibile creare (Create a new author) una lista di autori con i loro relativi dati, visualizzarli (VIEW), modificarli (EDIT) o eliminarli (DELETE).

In fase di creazione / editing di un’entità “Author”, vengono utilizzati tutti i controlli sintattici precedentemente richiesti.

Figura 11 – Creazione di un’entità Author e relativi controlli sintattici.

Figura 11 – Creazione di un’entità Author e relativi controlli sintattici.

 

Da notare che JHipster ha inoltre già implementato anche una paginazione basica della lista degli elementi.

Figura 12 – L’applicazione jhmoka in azione.

Figura 12 – L’applicazione jhmoka in azione.

 

Che dire? In modo veloce ed elegante abbiamo ottenuto in pochi minuti un’applicazione semplice, ma efficace e robusta, che gestisce una lista di elementi, nel nostro caso appunto gli autori di MokaByte.

 

Conclusioni

In questo primo articolo abbiamo introdotto le principali caratteristiche e potenzialità del tool JHipster. Inoltre abbiamo visto un primo esempio che ha messo in evidenza i vantaggi e la semplicità della generazione automatica del codice di JHipster.

Nel prossimo articolo daremo uno sguardo dietro le quinte, andando a vedere cosa e come viene generato da JHipster.

 

Riferimenti

[1] JHipster

https://jhipster.github.io/

 

[2] Tutorial JHipster

https://jhipster.github.io/presentation/#/

 

[3] La voce “JHipster” su Wikipedia

https://en.wikipedia.org/wiki/JHipster

 

[4] Download di Java SE

http://www.oracle.com/technetwork/java/javase/downloads/

 

[5] Download di Git

https://git-scm.com/downloads

 

[6] Download di Node.js

https://nodejs.org/en/download/

 

[7] Download di Apache Maven

https://maven.apache.org/download.cgi

 

Condividi

Pubblicato nel numero
220 settembre 2016
Stefano Rossini è nato a Giussano (MI) il 29/10/1970 e ha conseguito il diploma universitario in Ingegneria Informatica presso il Politecnico di Torino. Ha maturato più di venti anni di esperienza in diversi progetti Enterprise mission-critical ricoprendo i ruoli di IT Program Manager, Project Manager & Software Architect presso importanti…
Marco Luly è nato a Messina l’8 luglio 1982. Da dieci anni lavora nella progettazione e sviluppo di applicazioni enterprise per enti pubblici, per il mercato Fashion/Luxury, per l’Automotive e per il settore bancario: da software strategici/gestionali a sistemi di autenticazione/SSO. Nei vari progetti in cui è stato coinvolto ha…
Davide Dello Preite è nato a San Pietro Vernotico il 21 agosto 1987. Da diversi anni lavora nella progettazione e sviluppo di applicazioni enterprise per il core business bancario ricoprendo nel tempo i ruoli di Software Engineer, Team Leader e Scrum Master. In questi anni di esperienza ha acquisito anche…
Articoli nella stessa serie
  • JHipster
    II parte: Uno sguardo dietro le quinte
Ti potrebbe interessare anche