Blog ENI : Toute la veille numérique !
🐠 -25€ dès 75€ 
+ 7 jours d'accès à la Bibliothèque Numérique ENI. Cliquez ici
Accès illimité 24h/24 à tous nos livres & vidéos ! 
Découvrez la Bibliothèque Numérique ENI. Cliquez ici
  1. Livres et vidéos
  2. Java Spring
  3. Spring et JHipster
Extrait - Java Spring Le socle technique des applications Jakarta EE (4e édition)
Extraits du livre
Java Spring Le socle technique des applications Jakarta EE (4e édition) Revenir à la page d'achat du livre

Spring et JHipster

Introduction

Pour illustrer une utilisation avancée de Spring, nous regarderons quelques éléments de configuration d’un projet JHipster.

JHipster est un générateur d’application interactif. Il est basé sur Spring Boot et Angular avec Yeoman, Maven et/ou Gradle. Nous regarderons, dans ce chapitre, la partie back de l’application et la partie front avec Angular. JHipster évolue très rapidement, car il est très utilisé et a un très grand nombre de contributeurs.

La particularité principale de ce générateur est d’être en open source et que l’on peut assez facilement modifier les templates de génération pour générer ses propres applications. Il est très en vogue et les frameworks qu’il utilise en profitent pour s’améliorer en le prenant comme vecteur d’amélioration et comme démonstrateur. L’outil JHipster et ses templates sont écrits en JavaScript.

Nous ne verrons que quelques parties, car cet outil, qui est orienté DevOps, est très modulaire et couvre énormément de combinaisons de technologies.

L’outil JHipster est personnalisable, mais cette personnalisation n’est nécessaire que si on souhaite générer plusieurs applications. Pour un projet unique, deux points de vue s’opposent : partir...

Généralités

JHipster est un outil qui a été créé en 2014 par Julien DUBOIS, expert Spring et Java, entre autres.

Les statistiques indiquent plus de 168000 téléchargements par mois, 19335 étoiles sur GitHub et plus de 800 contributeurs. Plus de 300 entreprises utilisent officiellement JHipster. Le budget de sponsoring avoisine les 50k dollars par an et sert à financer les frais d’hébergement, les bugs Bounties, la correction de bugs ou des évolutions importantes et complexes.

Il est totalement déposé sous licence open source et collaboratif, l’URL du projet est https://www.jhipster.tech/. Il est composé d’un projet principal et de sous-projets.

Le but du projet est de nous aider à générer une application full stack, en un minimum de temps, avec un système de templates et de questions/réponses. Les aspects full stacks incluent le backend basé sur Springboot, la base de données et la partie front qui est basée sur les SPA (Single Page Applications) avec de l’Angular, du React, du Vue. Il inclut également le côté production avec la possibilité de préparer des environnements cloud et dockérisés. Il inclut aussi les tests et apporte ainsi une vision de bout en bout sur le projet.

L’adoption de l’outil par une grande communauté a permis de définir un certain nombre de bonnes pratiques. L’outil JHipster est disponible en ligne de commande et sous la forme d’une application web.

La ligne de commande permet de tout faire et il est possible de scripter. La version web est une version simplifiée qui est plutôt utilisée pour débuter.

1. JHipster web

Voici un exemple simple avec la version en ligne disponible à l’adresse : https://start.jhipster.tech/

Cette version est gratuite et open source. Il est tout à fait possible de la modifier pour la rendre disponible aux développeurs d’une société en personnalisant les modèles.

images/19EP01N.png

Il faut tout d’abord s’enregistrer, afin d’être dirigé sur la page principale.

images/19EP02N.png

La génération du projet s’effectue en deux étapes :

  • Génération d’un squelette applicatif vide.

  • Ajout...

Créer un blueprint

La documentation officielle est ici : https://www.jhipster.tech/modules/creating-a-blueprint

Un blueprint JHipster est un générateur Yeoman qui est composé à partir d’un sous-générateur JHipster spécifique pour étendre les fonctionnalités de ce dernier. Le blueprint peut remplacer tout getter défini du sous-générateur et fournir ses propres modèles et fonctionnalités. Les blueprints JHipster sont répertoriés sur le marketplace JHipster avec l’étiquette jhipster-blueprint. Cela permet de créer des blueprints tiers qui peuvent remplacer une partie spécifique de JHipster.

Pour utiliser un blueprint, exécutez la commande ci-dessous :

jhipster --blueprint <blueprint name> 

Il faut retenir qu’un blueprint JHipster possède les caractéristiques suivantes :

  • C’est un package NPM, et c’est un générateur Yeoman.

  • Il suit une extension des règles Yeoman répertoriées sur https://yeoman.io/generators/ et peut être installé, utilisé et mis à jour à l’aide de la commande yo. Au lieu d’être préfixé par generator-, il est préfixé par generator-jhipster-, et au lieu d’avoir juste le mot clé yeoman-generator, il doit avoir deux mots-clés, yeoman-generator et jhipster-blueprint.

Un blueprint ne peut étendre que les sous-générateurs suivants (sous le dossier générateurs) :

  • common

  • client

  • server

  • entity

  • entity-client

  • entity-server

  • entity-i18n

  • languages

  • spring-controller

  • spring-service

Si on souhaite modifier un autre pack , il faut forker le générateur generator-jhipster. Un fork est plus complexe à maintenir par rapport aux évolutions des versions de JHipster.

1. Blueprint pour utiliser lombok dans le domain

Pour créer un blueprint, nous pouvons utiliser le générateur de blueprints JHipster ou cloner et modifier un blueprint existant en prenant par exemple le blueprint jhipster-kotlin ou le blueprint jhipster-nodejs. Pour trouver un projet à reprendre, on peut lister les extensions du marketplace https://www.jhipster.tech/modules/marketplace/#/list et filtrer sur les tags yeoman-generator jhipster-blueprint...

JHipster comme outil multi-technologies

L’outil JHipster est un très bon outil pour essayer des technologies et voir comment elles s’articulent entre elles. Il essaie d’en montrer l’état de l’art et les bonnes pratiques JHipster supporte de nombreux frameworks et de nombreuses technologies.

Dans sa version 7, il gère les technologies suivantes :

1. Côté client

Côté client

Fonctionnalités

HTML5

HTML5 est la dernière révision majeure du HTML (format de données conçu pour représenter les pages web).

CSS3

Feuilles de style en cascade version 3.

BootStrap

Collection d’outils pour la création du design de sites et d’applications web.

TypeScript

Langage de programmation qui améliore et sécurise la production de code JavaScript.

Angular

Angular est un framework JavaScript qui permet de développer des pages web.

React

React est une bibliothèque JavaScript pour faciliter la création d’application web monopage, via la création de composants dépendant d’un état et générant une page (ou portion) HTML à chaque changement d’état.

Vue

Framework JavaScript pour la création d’interfaces utilisateurs.

Redux

Redux est un conteneur d’état prédictible pour les applications JavaScript.

JQuery

JQuery est une bibliothèque JavaScript pour faciliter l’écriture de scripts côté client dans le code HTML des pages web.

Websocket

WebSocket est un protocole réseau web basé sur des canaux de communication full-duplex par-dessus une connexion TCP.

Yarn

Yarn met en cache chaque package installé afin de ne plus avoir à les télécharger.

Webpack

Webpack récupère des dépendances et des modules JavaScript entre autres pour générer des fichiers statiques.

Gulp

Gulp est un outil pour l’automatisation des tâches du flux de travail de développement.

Sass

Sass (Syntactically Awesome Stylesheets) est un langage de génération de feuilles de style.

Browsersync

Browsersync synchronise les URL, les interactions et les changements de code dans un navigateur sur plusieurs appareils. 

Test

Outil de test JavaScript (https://jestjs.io/)

Protractor

Protractor est un framework...

Structure du projet

Nous allons illustrer l’architecture des applications générées avec JHipster via l’étude d’un cas de génération d’application simple Angular/Spring Boot simple.

1. La partie front

La partie front peut utiliser par exemple Angular. Elle est « responsive », c’est-à-dire que l’affichage se réorganise si nous changeons la taille de la zone d’affichage du navigateur web. Il s’agit d’une « Single Page Application», c’est-à-dire qu’il n’y a qu’une page qui se met à jour par AJAX. L’application générée utilise HTML5 Boilerplate (https://html5boilerplate.com/) et Twitter Bootstrap (http://getbootstrap.com). Des tests sont générés pour Karma.

Pour le développement de la partie front, JHipster utilise Yeoman avec Angular, React ou Vue.

Ce générateur utilise en fait tous les meilleurs frameworks clients utilisables actuellement.

2. Les grandes lignes de la partie back

Nous ne présentons ici que les grandes lignes de la partie back.

Nous utilisons pour cet exemple une application monolithe avec une base SQL H2 et un front Angular.

La partie front Angular n’est pas présentée, car elle sort du cadre de cet ouvrage. Le lecteur pourra s’appuyer sur le livre "Angular - Développez vos applications web avec le framework JavaScript de Google" de Sébastien OLLIVIER, Daniel DJORDJEVIC et William KLEIN, paru aux Éditions ENI.

La partie back utilise Maven, Spring, Spring MVC REST et Spring Data JPA. Elle est centrée sur l’utilisation de Spring.

a. Spring Boot

Le générateur JHipster profite de la possibilité de générer directement une application Spring Boot préconfigurée. Il est très facile de changer la configuration pour être dans une stack Spring classique dans le cas où vous ne pourriez pas utiliser Spring Boot. Pour ce faire, le plus simple est de regarder le pom.xml effectif déduit par votre outil de développement préféré et de refaire le lanceur.

Spring Boot permet donc de créer rapidement une application fonctionnelle. La configuration est simplifiée.

Système de gestion...

JHipster et WebFlux

WebFlux a été intégré dans JHipster 6 et amélioré dans JHipster 7.

Cet ajout était très attendu par les utilisateurs. Il est déjà très complet et permet les expérimentations.

Au niveau des bases de données, il nous propose :

  • SQL (H2, MySQL, PostgreSQL, MSSQL)

  • MongoDB

  • Cassandra

  • Couchbase

  • [BETA] Neo4j

  • No database

Si on choisit SQL, il propose alors en utilisant R2DBC :

  • MySQL

  • PostgreSQL

  • Microsoft SQL Server 

Les couches domain, service, web sont conformes aux spécifications que nous avons vu dans le chapitre sur WebFlux.

Le fait d’avoir une application réactive change un peu certaines classes de configurations.

1. Configuration DatabaseConfiguration

Pour les bases sql, jHipster utilise R2DBC avec l’annotation @EnableR2dbcRepositories dans la classe DatabaseConfiguration.

Nous avons des convertisseurs pour les dates :

@Bean  
public R2dbcCustomConversions r2dbcCustomConversions(R2dbcDialect 
dialect) {  
 List<Object> converters = new ArrayList<>();  
 converters.add(InstantWriteConverter.INSTANCE);  
 converters.add(InstantReadConverter.INSTANCE);  
 converters.add(BitSetReadConverter.INSTANCE);  
 converters.add(DurationWriteConverter.INSTANCE);  
 converters.add(DurationReadConverter.INSTANCE);  
 converters.add(ZonedDateTimeReadConverter.INSTANCE);  ...

Points clés

  • JHipster génère une application Spring propre qui peut servir de modèle et propose un bon support de l’hypermédia et de HATEOAS.

  • JHipster permet de tester et de comparer différentes options de générations.

  • JHipster est très bien pour découvrir les technologies du moment.

  • Nous pouvons facilement personnaliser le code généré par JHipster.