Bootstrap a full-stack application in 10 minutes using Java Hipster

JHipster speeds up application development by providing a streamlined platform that automates setup and integrates modern technologies. It offers multiple front-end and backend options and cloud platform integration, allowing developers to quickly generate a complete application structure and focus on building features.

What is JHipster?

JHipster is a tool that helps you quickly build, develop, and launch contemporary web applications and microservice structures. It offers support for several front-end technologies like Angular, React, and Vue, as well as mobile app development using Ionic and React Native. On the backend, it offers compatibility with Spring Boot using Java or Kotlin, Micronaut, Quarkus, Node.js, and .NET. For deployment, JHipster follows cloud-native concepts and works with Docker and Kubernetes, and it can be deployed on various platforms such as AWS, Azure, Cloud Foundry, Google Cloud Platform, Heroku, and OpenShift.

Prerequisites

  1. 1. Install Node.js from http://nodejs.org

  2. 2. Install Yarn from https://yarnpkg.com/en/docs/install

  3. 3. Yeoman (command: yarn global add yo)

  4. 4. JHipster (command: yarn global add generator-jhipster)

Let's get started!

before we start let me tell you one thing, jhipster boosted application will required java 11 or higher and maven 3.8.5 or higher, otherwise it won't work.

open your console and hit jhipster or yo jhipster

open your console and hit jhipster or yo jhipster

later we need to fill the form by giving answers to jhipster application console regarding our technology preference, like what technology do we need for front-end or back-end etc. i've listed sample answers below.

> Which type of application would you like to create? : Gateway application (means microservice gateway application)
> What is the base name of your application? : jhipsterdemo
> As you are running in a microservice architecture, on which port would like your server to run? it should be unique to avoid port conflicts : 9090
> What is your default java package name : com.vivek.jhipster.demo
> Which service discovery server do you want to user? : No service discovery (you can use eureka or other service discovery if you want)
> Which type of authentication would you like to use? : JWT (you can also use OAuth 2)
> Which type of database would you like to use? : MySQL
> Which cache do you want to use? : Ehcache
> Do you want to user Hibernate 2nd level cache? n
> Would you like to use Maven or Gradle for building the backend? : Maven
> Which other technologies would you liketo user? : Elasticsearch
> Which framework would you like to use for the client? : Angular
> Do you wnat to generate the admin UI? : y
> Would you like to use a Bootswatch theme? : Default JHipster
> Would you like to enable internationalization support? : n
> Please choose the native language of the application : English
> Beside JUnit and JTest, which testing frameworks would you like to use? : Gatling
> Would you liek to install other generators from the JHipster marketplace? : n

JHipster app to be created settings

and boom! our application will get up and running by itself with a proper technology skeleton. NOTE: this process will take 5-10 minutes depending on your internet speed.

success screen

Setting up front-end (Angular side) application

hit npm start in the console

hit npm start in the console

After these steps go to browser and access your application on localhost:4200, it will look like below given screen.

go to browser and access your application on localhost:4200

Setting up back-end (Springboot side) application

Our front-end is up and running now, configure our back-end in order to use the functionalities.

again open console and hit the command: mvn install

open console and hit the command: mvn install

open console and hit the command: mvn install - 2

now go to target folder and run the war file using command: java -jar jhipsterdemo-0.0.1-SNAPSHOT.war

hit in the console : java -jar jhipsterdemo-0.0.1-SNAPSHOT.war

Setting up database (MySQL) in the application

go to /home/vivek/Git/JHipster_Learning/src/main/resources/config/application.yml and fill database details as shown below, and re-run the war file.

Setting up database (MySQL) in the application

As we are connected with database now, we can do the register and sign-in and can check the default fetures given to bootstrap our application, i've sign in as a default credential which is admin, admin for Administrator and checked the swagger API, you can also check other functionalities such as metrics, health, configuration, user management etc.

success scree - 1

success scree - 2

success scree - 3

success scree - 4


Source : https://www.jhipster.tech/

Get in touch

Let’s work together

Reach out if you have a concept for a website or mobile app or require guidance with product design. contact me.
  info@whywhytechnova.com
  +(91) 88661 28862