What is this all about?

Modern Web application development

Modern Web apps

End-users requirements have evolved. People are tired of slow, unreactive Web sites. They want:

• Beautiful design
• Stop waiting for pages to load
• Dynamic updates of page fragments

We need to use the latest HTML5/CSS3/JavaScript technologies

Developer productivity

Those websites should be delivered fast.

Waiting 1 minute for your application to "deploy" is not acceptable anymore

We need the right tools for this job!

Production-ready software

Modern websites should be able to handle huge numbers of concurrent users

All using massive RESTful applications, which will hit your back-end servers hard

We need robust, scalable high-performance servers

Our goal is to solve those issues

• A beautiful front-end, with the latest HTML5/CSS3/JavaScript frameworks
• A robust and high-quality back-end, with the latest Java/Caching/Data access technologies
• All automatically wired up, with security and performance in mind
• And great developer tooling, for maximum productivity

Client-side technologies

Yeoman, Webpack, Angular, React, Bootstrap

NPM

• Fast and reliable dependency management
• Used to install and run all client-side tools

                            npm install -g generator-jhipster
                        

Yeoman

Yeoman provides application generators

• Hundreds of generators are available
• Mostly geared toward JavaScript front-end applications
• The top-rated generators have excellent quality

                            jhipster
                        

Webpack

Module bundler for client-side assets

• Compiles, minifies, optimizes the front-end
• Essential tooling to have compilation and hot-reload of Angular/React + TypeScript
• Allows efficient production builds on the client-side

BrowserSync

Hot reload of application changes

• Automatically refreshes the browser when code is modified
• Synchronizes several browsers in real-time, so changes can be checked instantly

                            npm start
                        

Jest

Jest runs unit tests on your JavaScript code

• It works with jsdom, a virtual DOM technology
• It is very fast, and can run continuously in the background

                            npm test
                        

Angular and React

The 2 most popular JavaScript frameworks

• Both Angular and React are supported by JHipster
• Powerful & easy to learn
• Data binding, form validation, i18n... all out of the box

Bootstrap

Great CSS/JavaScript framework for responsive Web apps

• CSS and HTML elements for all common usages
• Tons of JavaScript components: menus, navbars, drop-down boxes, alerts...

                            

    Hello, world!

                            
                        

Server-side technologies

Maven, Spring, Spring MVC REST, Spring Data JPA, Netflix OSS

Maven | Gradle

The most popular Java build tools

• Well-known, pre-defined directories and goals
• Integration with major IDEs
• Great plugin ecosystem, including Spring Boot and Yeoman

                            
./mvnw spring-boot:run
                            
                            
./gradlew bootRun
                            
                        

Spring Boot

Spring is the de-facto standard for Java apps

• IoC, AOP and abstractions to ease application coding
• Fast and lightweight, and extremely powerful when needed
• Out-of-the-box configuration by Spring Boot
• Live reload of application

                            
@Service
@Transactional
public class UserService {

    @Autowired
    private UserRepository userRepository;

}
                            
                        

Netflix OSS

Netflix OSS provides great tools and frameworks for microservices

• Eureka - Service registry for load balancing and failover.

Liquibase

Database updates made easy

• Handles updating a database schema
• Works great with Spring and JPA
• Needs a good understanding of databases and ORM

JPA

The standard ORM solution for Java

• Hibernate is used underneath
• Very complete, impressive set of features
• Still complex to understand for newbies!

                            
@Entity
public class User implements Serializable {

    @Id
    private String login;

}
                            
                        

Spring Data JPA

Adds extra syntaxic sugar on top of JPA

• Generates your JPA repositories automatically
• Removes a lot of boilerplate code

                            
public interface PersistenceAuditEventRepository extends JpaRepository<PersistentAuditEvent, String> {

    List<PersistentAuditEvent>
        findByPrincipalAndAuditEventDateGreaterThan(String principal, LocalDateTime after);

}
                            
                        

MongoDB

NoSQL for scalability

• Alternative to the SQL database and JPA choice
• Similar code: Spring Data MongoDB works the same as Spring Data JPA
• More scalable, easier to use

Couchbase

NoSQL for scalability

• Alternative to the SQL database and JPA choice
• Similar code: Spring Data Couchbase works the same as Spring Data JPA
• More scalable, easier to use

Cassandra

NoSQL for scalability

• 2nd alternative to the SQL database and JPA choice
• Linear scalability and high availability
• Extreme performance and low latency for mission-critical apps

Caching

Caching is king for performance

• Ehcache is the most widely used solution
• HazelCast is a great alternative, with clustering support!
• Hibernate 2nd level cache or Spring Caching abstraction

                            
@Entity
@Cache(usage = CacheConcurrencyStrategy.NONSTRICT_READ_WRITE)
public class User implements Serializable {

}
                            
                        

Spring Security

Bulletproof Security framework

• Leading tool, widely used across all industries
• Secures URLs and Java code (Spring Beans)
• Works both with stateful (cookies) and stateless (OAuth2/JWT) Web application architectures

Spring MVC REST

The best REST framework in Java

• Complete, high-performance REST solution
• Great Spring support, great testing support

                            
@RestController
public class AccountResource {
    @PostMapping("/account")
    public void saveAccount(@RequestBody UserDTO userDTO) {
        userService.updateUserInformation(userDTO);
    }
}
                            
                        

Thymeleaf

Server-side templates

• Used when a Single Web Page application isn't enough
• Replaces JSPs and JSTLs, which are outdated and deprecated
• Great templates for Web designers

                            
Hello, world
                            
                        

Monitoring

Ready for production with Metrics

• Monitors the JVM, app server, Spring beans, cache, and more!
• JMX or Graphite reporting

                            
@Timed
public void saveAccount(@RequestBody UserDTO userDTO) {
    userService.updateUserInformation(userDTO);
}
                            
                        

Cloud deployment

To the cloud and beyond!

• Deployments should be easy on-premise and in the cloud
• Leading cloud providers like Cloud Foundry, Heroku and Amazon Web Services all provide specific tooling and deployment options

Meet JHipster

Why all the hype?

You said hype?

At the time of this writing (March, 2018), JHipster has:

• 417 contributors, including 21 core members
• 9,891 GitHub stars and 2,180 forks
• 1 million+ installations
• And it's growing rapidly

Why?

We've seen lots of cool technologies

• Can Webpack and Maven be friends?
• Can Angular and Spring MVC REST be friends?
• Can Netflix OSS and Spring be friends?
• We can guarantee you that having everything working together smoothly, with security, caching and monitoring, isn't easy...

JHipster makes everything just work together

• JHipster creates a complete working application, with all those technologies
• Everything just works out-of-the-box
• You have your Webpack tasks working great with your Maven goals!
• You have Docker configuration to run everything smoothly!

But wait, there's more!

• "entity" sub-generator to generate a complete JPA entity, from database to Angular
• "jdl" sub-generator to generate a complex entity model using JDL Studio
• "service" sub-generator to generate a Spring business service
• "languages" sub-generator to add languages for i18n
• Great support for Spring Security: Ajax endpoints, secured remember-me, audits...
• Great monitoring screen using Metrics

It's not over yet, there's even more!

• Great support for creating microservices and gateways
• Consul or JHipster Registry (Netflix Eureka + Spring cloud config server) provided out of the box
• Great support for Docker
• Additional JHipster Modules to add more features

Production-ready

• Specific Spring profile with GZipping and HTTP caching headers
• TypeScript & CSS optimization and minification by Webpack
• Executable or standard WAR file, with monitoring enabled
• Sub-generators for deploying automatically to Cloud Foundry, Heroku and AWS
• "docker-compose" sub-generator to generate Docker configurations for deploying microservices to production

Let's build our first app

10 minutes tutorial

Install Yeoman

                            
npm install -g yo
npm install -g generator-jhipster
                            
                        

Create an application

And use the embedded Maven wrapper to run it
(hot reload of your application will work automatically)

                            
jhipster
./mvnw
                            
                        

Client-side live reload

Live reload of your client-side code (HTML, CSS, TypeScript) works thanks to Webpack and Browsersync. Edit any file and your browser will refresh automatically:

                            
npm start
                            
                        

Add an entity

                            
jhipster entity Foo
                            
                        

Run in production

(Using Docker to run the database)

                            
./mvnw -Pprod package
docker-compose -f src/main/docker/mysql.yml up -d
java -jar target/*.war