Customiser votre application Jhipster

Maintenant que notre application Jhipster est prête et en ligne il faut faire quelques améliorations pour la customiser.

Commencez par changer les mots de passe par défaut, en vous rendant sur Administration/Gestion des utilisateurs

Je modifie le mot de passe du login admin, et je supprime aussi le login system et user.

Changez les mots de passe de postgresql dans le fichier postegresql.yml

... 

environment: 

   - POSTGRES_USER=newUser 

   - POSTGRES_PASSWORD=newPassword

Changer les informations génériques de l'application dans pom.xml

<?xml version="1.0" encoding="UTF-8"?> 

<project xmlns="http://maven.apache.org/POM/4.0.0" "mlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> 

   <modelVersion>4.0.0</modelVersion> 

   <parent> 

      <artifactId>spring-boot-starter-parent</artifactId>  

      <groupId>org.springframework.boot</groupId> 

      <version>1.4.2.RELEASE</version> 

      <relativePath/> 

   </parent> 

   <groupId>fr.rigaudie.coocotte</groupId> 

   <artifactId>coocotte</artifactId> 

   <version>1.0</version> 

   <packaging>war</packaging> 

   <name>Coocotte</name> 

...

Placez une nouvelle icône dans l'onglet du navigateur en plaçant le favicon.ico à la racine du projet soit "app\src\main\webapp"

Ajoutez l'image dans la navbar placé dans "app\src\main\webapp\content\images". Changez le nom de l'image dans "app\src\main\webapp\app\layouts\navbar\navbar.html"

J'ai ajouté un module angular pour faire du material design. On commence par obtenir la librairie JS

bower install angular-material --save

Puis on ajoute le module ngMaterial dans le fichier app.module.js

On ajoute les liens dans la page index.html

gulp build

J'ai voulu aussi utiliser "font awesome" du coup je récupère la librairie

bower install components-font-awesome --save

Et je mets à jour les liens dans index.html

gulp build

Supprimez les messages de traduction. Si vous avez choisi le français il va créer un dossier "fr" dans "app\src\main\webapp\i18n".

Adaptez ce fichier et le fichier html de la page qui contient lui l'anglais entre les balises html.

Aménagez home.html en supprimant ce qui ne sert plus : logo jhipster, messages ne servant plus, ajouter votre pied de page...

Changez dans "app\src\main\webapp\index.html" le code google analycis

Mettez à jour le pied de page avec votre style comme

On lance un serveur Java sur http://localhost:9000 avec BrowserSync

gulp

Si vous avez une erreur de ce type

Error: connect ECONNREFUSED 127.0.0.1:8080 

   at Object.exports._errnoException (util.js:870:11) 

   at exports._exceptionWithHostPort (util.js:893:20) 

   at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1063:14)

Cela veut dire que le backend n'est pas démarré il faut le lancer avec maven

mvn spring-boot:run

Ensuite pour construire le war nous allons passer par maven. Attention pensez à faire le nettoyage du dépôt

mvn clean package docker:build