JHipster - The Fastest Way To Build A Production-Ready Angular & Spring Boot Application
In the last years, I mainly worked on the frontend part of web & mobile applications, but I also did some minor backend work. Since mid of this year, I have been working to improve my backend knowledge and started to focus on Java backend development using Spring Boot.
In this article, I will tell you why I love JHipster and how you can quickly start a JHipster project.
JHipster is a development platform to generate, develop and deploy Spring Boot + Angular / React / Vue Web applications and Spring microservices.
It is a Yeoman generator that creates applications that include Spring Boot, Bootstrap, and Angular (or React or Vue).
Julien Dubois started the project in 2013 and is available on GitHub.
If you like to see JHipster in action, I can recommend the following screencast from Matt Raible:
In my opinion, JHipster is fantastic as it
- is open source
- supports React, Vue and Angular for the frontend
- uses TypeScript for each frontend framework
- uses Spring Boot 2.1 so we can develop our application in Java 11+
- provides out-of-the-box user management, including email verification and password reset
- can be easily deployed to CloudFoundry, Heroku, OpenShift or AWS
- provides a robust microservice architecture using Netflix OSS, Elastic Stack, and Docker
- uses powerful tools Yeoman, Webpack, and Maven/Gradle
- has a good test coverage for entities on frontend and backend side
Then we can install JHipster as global npm package:
npm install -g generator-jhipster
Now we can create a new project and get started:
The first step, is to create a new directory and go into it
mkdir jhipster-demo && cd jhipster-demo
Now we can run
jhipster which starts the generator
with the following selections:
I chose a monolithic application as a microservice architecture would be an overkill for a simple demo project. Besides that, I selected Angular as the frontend framework with i18n support and some backend configuration for database, caching and monitoring.
Next step is to model our entities with JDL Studio and download the resulting
JDL Studio is a friendly graphical tool for drawing JHipster JDL diagrams based on the JDL syntax. You do not need to use this visual tool but can also create entities using the command-line interface.
After downloading the
.jh file, we can generate the entities with
jhipster import-jdl jhipster-jdl.jh. In our example, we import the default JDL Studio file, which is also shown in the picture above.
./mvnw, which starts the Spring Boot application:
npm start to serve the Angular application on
Finally, we can log in and see some of the out-of-the-box features like the possibility to see and edit our entities,
view metrics of the application
and a user management
In this article, I just showed you a quick start JHipster project and mentioned its advantages. JHipster is much more potent, as shown in the official documentation. I think it is also a good sign if large companies are using the framework, as you can see in this official list.
A disadvantage of JHipster is that you do not have a typical Angular CLI project. Angular CLI is included in JHipster, but the project structure looks different than the one of a default Angular CLI project.
JHipster generates a lot of code, including many libraries you may not know. You can add or modify the code without learning the fundamentals behind these libraries, which could lead to future problems.
You should also keep in mind that a JHipster project is more of a big start than a small, lean project start.