JHipster : la suite de fra­me­works pour des ap­pli­ca­tions Web modernes

Aujourd’hui, lorsque vous dé­ve­lop­pez une ap­pli­ca­tion Web, vous avez le choix entre dif­fé­rents gé­né­ra­teurs de code et fra­me­works. Ces outils et bases de code vous per­met­tront d’éco­no­mi­ser un temps non né­gli­geable dans votre projet. Il n’est cependant pas si facile de trouver et de réunir des com­po­santes qui tra­vail­le­ront en parfaite harmonie et qui s’adap­te­ront à votre ap­pli­ca­tion. C’est la raison pour laquelle l’équipe de JHipster a rassemblé dans la pla­te­forme du même nom certains des fra­me­works les plus appréciés pour le dé­ve­lop­pe­ment des parties serveur et client. Cette com­bi­nai­son de Spring Boot, AngularJS, Bootstrap et de nom­breuses autres com­po­santes est dis­po­nible en­tiè­re­ment en open source et convient par­fai­te­ment pour la création d’ap­pli­ca­tions Web modernes et de mi­cro­ser­vices.

Qu’est-ce que JHipster ?

Avec une poignée d’autres dé­ve­lop­peurs, Julien Dubois a publié en octobre 2013 le projet JHipster (forme abrégée de « Java Hipster »). Le nom fut choisi en premier lieu pour le concept du gé­né­ra­teur d’ap­pli­ca­tions Web, puisque JHipster devait réunir Java et tous les outils de dé­ve­lop­pe­ment Web po­pu­laires à l’époque. Aujourd’hui, la suite de fra­me­works cible en par­ti­cu­lier le secteur des en­tre­prises et met l’accent sur le fait de permettre une pro­duc­ti­vité élevée lors du processus de dé­ve­lop­pe­ment ainsi qu’une ex­cel­lente qualité de l’ap­pli­ca­tion dé­ve­lop­pée. Le dé­ve­lop­pe­ment permanent de la suite est assuré par une équipe composée de 15 dé­ve­lop­peurs prin­ci­paux, et de centaines de con­tri­bu­teurs. Le code JHipster, distribué sous la licence Apache 2.0, est à la libre dis­po­si­tion de toutes les personnes in­té­res­sées sur GitHub.

Vue d’ensemble des com­po­santes de JHipster

JHipster fournit aussi bien des solutions pour la création et la con­cep­tion d’in­ter­faces que les outils né­ces­saires au dé­ve­lop­pe­ment de serveur. Le framework Spring Boot constitue par exemple une base parfaite pour générer une pile Java solide côté serveur qui pourra être connectée en toute sim­pli­cité à diverses bases de données, machines vir­tuelles et outils de mo­ni­to­ring et reliée au client via une interface REST. JHipster supporte notamment les options logiques suivantes :

• Base de données : MariaDB, Post­greSQL, Oracle, MySQL, MongoDB
• Vir­tua­li­sa­tion : Docker, Ku­ber­netes, AWS
• En­vi­ron­ne­ment de test : Karma, Cucumber
• In­dexa­tion : Elas­tic­Search
• Mise en cache : Ehcache, In­fi­nis­pan
• Mo­ni­to­ring : Pro­me­theus

En ce qui concerne le dé­ve­lop­pe­ment côté client, JHipster mise prin­ci­pa­le­ment sur le framework Ja­vaS­cript Angular.js et sur la bi­blio­thèque Ja­vaS­cript React. Ces deux outils peuvent être combinés au choix avec Twitter Bootstrap, lui-même pré­cur­seur des fra­me­works web ainsi qu’avec le modèle Web al­ter­na­tif HTML5 Boi­ler­plate. JHipster peut être complété avec le langage de feuille de style Sass qui facilite la con­cep­tion via CSS3.

Les outils tels que le gé­né­ra­teur de code Yeoman, le module bundler Ja­vaS­cript Webpack ou les ap­pli­ca­tions de gestion de build Gulp (pour Ja­vaS­cript) et Maven et Gradle (pour Java) ga­ran­tis­sent un workflow optimal lors de l’uti­li­sa­tion de ces dif­fé­rentes solutions ori­gi­nales.

Quels sont les avantages offerts par un dé­ve­lop­pe­ment avec JHipster ?

Comme le montre la liste ci-dessus, la col­lec­tion JHipster se démarque notamment par le fait que les dif­fé­rentes com­po­santes s’accordent par­fai­te­ment les unes avec les autres. L’uti­li­sa­tion de cette suite doit être im­pé­ra­ti­ve­ment prise en con­si­dé­ra­tion si vous souhaitez pro­gram­mer votre projet Web avec Java. JHipster réduit les obstacles de départ liés au dé­ve­lop­pe­ment, simplifie et uni­for­mise l’in­té­gra­lité du processus de pro­gram­ma­tion, que ce soit pour le dé­ve­lop­pe­ment de l’ap­pli­ca­tion à pro­pre­ment parler ou pour les révisions et ex­ten­sions ul­té­rieures du code. Les prin­ci­paux outils de dé­ve­lop­pe­ment étant di­rec­te­ment à votre dis­po­si­tion avec JHipster, l’uti­li­sa­tion de cette suite de fra­me­works vous fait gagner un temps con­si­dé­rable.

JHipster vous permet également de générer en un temps record une ap­pli­ca­tion web qui supporte les opé­ra­tions CRUD et dispose d’un code source clai­re­ment structuré. D’autres fonc­tion­na­li­tés telles que la gestion des uti­li­sa­teurs ou l’in­ter­na­li­sa­tion sont également dis­po­nibles.

Tutoriel JHipster : ins­tal­la­tion et premiers pas dans le pack JHipster

Après cette courte in­tro­duc­tion au concept de JHipster, le tutoriel suivant vous ex­pli­quera comment installer cette suite de frameworks. Nous vous pré­sen­tons également les premières étapes qu’il convient de maîtriser pour utiliser cette structure de code.

Étape 1 : ins­tal­la­tion de JHipster

Vous disposez de plusieurs pos­si­bi­li­tés pour installer JHipster. Vous pouvez par exemple accéder à la « de­ve­lop­ment box » qui est basée sur le logiciel Vagrant et exécute JHipster sur une machine virtuelle Ubuntu. Pour les fans de Docker, le generator jhipster sur GitHub devrait néanmoins s’avérer plus in­té­res­sant. Il fournit une image qui vous aidera à exécuter la suite de fra­me­works dans Docker. Il est bien sûr également possible de procéder à une ins­tal­la­tion locale classique sur votre propre serveur en utilisant npm ou Yarn comme ges­tion­naire de paquets. Yarn étant le choix re­com­mandé par l’équipe de dé­ve­lop­peurs, nous l’avons utilisé comme base pour le processus d’ins­tal­la­tion de ce tutoriel JHipster. Et voici le processus en question :

1. Té­lé­char­gez les paquets d’ins­tal­la­tion pour Java SE 8 depuis le site d’Oracle puis installez l’en­vi­ron­ne­ment d’exécution.
2. Té­lé­char­gez les paquets d’ins­tal­la­tion depuis Node.js sur la page du pres­ta­taire et installez-les également. L’équipe JHipster re­com­mande dans ce cadre une version 64 bits avec support à long terme (LTS).
3. Installez Yarn sur votre serveur en suivant les ins­truc­tions spé­ci­fiques à votre système dans le ré­per­toire d’ins­tal­la­tion du site de Yarn.

Le ges­tion­naire de paquets vous permet à présent d’obtenir et d’installer l’ap­pli­ca­tion du gé­né­ra­teur Yeoman et fi­na­le­ment JHipster. Pour ce faire, saisissez les commandes suivantes l’une après l’autre :

yarn global add yo
yarn global add generator-jhipster

Étape 2 : création de votre premier projet

Une fois tous les com­po­sants installés, vous pouvez faire vos premiers pas avec le gé­né­ra­teur JHipster et créer un premier projet type. Pour ce faire, vous aurez tout d’abord besoin d’un ré­per­toire sur votre système (appelé ici « exemple-jhipster ») dans lequel vous pourrez en­re­gis­trer les fichiers cor­res­pon­dants. La même chose peut être obtenue à l’aide de cette commande simple :

mkdir exemple-jhipster

Naviguez ensuite dans le ré­per­toire créé et exécutez-y la commande de lancement JHipster :

yo jhipster

Le gé­né­ra­teur vous présente alors une série de questions qui vous permettra de définir le type d’ap­pli­ca­tion et de sé­lec­tion­ner les fonc­tion­na­li­tés et le logiciel souhaités. De cette façon, vous pouvez définir si un mécanisme de mise en cache doit être im­plé­menté ou quel outil de con­cep­tion du serveur (Gradle ou Maven) doit être utilisé. D’autre part, activez si né­ces­saire la prise en charge de l’in­ter­na­tio­na­li­sa­tion pour votre projet et sé­lec­tion­nez la langue de base et les variantes lin­guis­tiques sup­plé­men­taires. Dans la plupart des cas, la valeur pré-pa­ra­mé­trée suffit pour notre projet test.

Close

Si vous avez trouvé la con­fi­gu­ra­tion de votre choix, vous pouvez lancer le processus de gé­né­ra­tion. Si ce dernier se déroule sans accroc, vous recevez au­to­ma­ti­que­ment une in­for­ma­tion d’exécution après un bref laps de temps qui vous indique que les ap­pli­ca­tions de serveur et de client ont pu être générées avec succès.

Close

Étape 3 : lancement de l’ap­pli­ca­tion serveur et connexion au serveur

JHipster a désormais créé le cadre de base de votre ap­pli­ca­tion Web et en­re­gis­tré le code cor­res­pon­dant dans le ré­per­toire créé au préalable. À partir de celui-ci, vous pouvez main­te­nant démarrer votre propre instance de serveur basée sur Spring Boot. La commande à utiliser pour y parvenir dépend de l’outil que vous avez choisi pour la con­cep­tion du serveur. Si votre choix s’est porté sur Maven, exécutez les com­po­santes du serveur à l’aide du wrapper Maven intégré à JHipster en entrant la commande suivante :

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

Si vous avez opté pour Gradle, la commande né­ces­saire est la suivante :

./gradlew (sous macOS/Linux)
gradlew (sous Windows)

Si vous n’avez pas indiqué d’autre port lors de la gé­né­ra­tion de votre projet JHipster (le port 8080 est réservé par défaut), vous pouvez à présent consulter le serveur à l’adresse “http://localhost:8080” dans tout na­vi­ga­teur courant. Vous ouvrez ainsi la page d’accueil qui vous permet de vous connecter au serveur.

Close

La page fournit également les données standard pour l’accès ad­mi­nis­tra­teur et l’accès uti­li­sa­teur simple :

Étape 4 : ad­mi­nis­tra­tion de votre projet JHipster

Dans le cadre de la connexion au compte ad­mi­nis­tra­teur, la barre de menu de l’instance de serveur est complétée avec les deux points « Ad­mi­nis­tra­tion » et « Entités ». Le premier point vous servira à gérer votre ap­pli­ca­tion web. Vous dis­po­se­rez alors des options suivantes :

• Gestion des uti­li­sa­teurs : dans la gestion des uti­li­sa­teurs, vous pourrez créer, éditer et supprimer les profils d’uti­li­sa­teur ayant accès à votre ap­pli­ca­tion JHipster. Il est notamment possible de répartir des rôles de cette façon.
• Pa­ra­mètres de l’ap­pli­ca­tion : dans la rubrique Pa­ra­mètres, vous trouverez des in­di­ca­tions sur l’uti­li­sa­tion de la mémoire ainsi que des in­for­ma­tions sur les requêtes HTTP entrantes et sur les sta­tis­tiques de service et de mise en cache.
• Statut de l’ap­pli­ca­tion : dans « Santé », vous trouverez un petit aperçu de la fonc­tion­na­lité des com­po­santes de votre ap­pli­ca­tion telles que l’espace disque dur ou les bases de données.
• Con­fi­gu­ra­tion : le bouton « Con­fi­gu­ra­tion » vous permet d’ouvrir le menu pour les pa­ra­mètres généraux de votre projet JHipster.
• Audits : les audits vous donnent un aperçu des ten­ta­tives de connexion réussies (AU­THEN­TI­CA­TION_SUCCESS) et avortées (AU­THEN­TI­CA­TION_FAILURE) incluant des in­for­ma­tions sur le moment de la connexion et l’uti­li­sa­teur.
• Pro­to­coles/journaux : vous pourrez consulter ici les mé­ca­nismes de journaux actifs. Vous avez par ailleurs la pos­si­bi­lité de définir un niveau de jour­na­li­sa­tion (aver­tis­se­ment, in­for­ma­tion, traçage, message d’erreur, etc.).
• Vue d’ensemble des API : dans la vue d’ensemble des API, vous verrez toutes les in­ter­faces REST de votre ap­pli­ca­tion, y compris les codes pour le contrôle de ces API (peut être déployé pour chaque API).
• Base de données : fi­na­le­ment, le serveur JHipster offre également une interface pour les bases de données qui vous permet de tester et d’établir la connexion.

À travers l’onglet « Langue », vous pouvez de plus modifier la version lin­guis­tique de l’interface de votre instance de serveur Spring Boot.

Pour afficher cette vidéo, des cookies de tiers sont né­ces­saires. Vous pouvez consulter et modifier vos pa­ra­mètres de cookies ici.

Étape 5 : création de nouvelles entités

À l’étape pré­cé­dente, nous avons déjà évoqué le second point de menu du serveur JHipster, intitulé « Entités ». Celui-ci a également son im­por­tance. Ces unités, que vous pouvez consulter, éditer ou supprimer à tout moment (grâce au concept CRUD déjà mentionné), vous four­nis­sent des données pour vos bases de données et donc des contenus pour votre projet. Vous disposez de dif­fé­rentes pos­si­bi­li­tés pour créer des entités de ce type dans JHipster : la solution standard est le gé­né­ra­teur Entity Sub uti­li­sable via l’invite de commande. La syntaxe de ce gé­né­ra­teur se présente comme suit :

jhipster entity <entityname> -- [options]</entityname>

Afin de connaître les pos­si­bi­li­tés de cet outil, il est re­com­mandé de saisir « jhipster entity --help ». Cette commande liste les options dis­po­nibles (comme le montre la capture d’écran suivante) :

Close

Vous pouvez également générer les entités à l’aide d’un outil graphique. Pour ce faire, vous avez deux pos­si­bi­li­tés : l’éditeur UML JHipster UML que vous trouverez sur GitHub ainsi que l’ap­pli­ca­tion en ligne JDL-Studio qui est basée sur le langage JDL (JHipster Domain Language) spé­ci­fique au domaine.

Close