Aplicações Web Modernas com JHipster

http://josenaldo.github.io/palestra-jhipster

Quem sou?

Josenaldo de Oliveira Matos Filho

Jugleader no UaiJUG

Arquiteto de Software do comdominiodigital.com.br

Quem somos?

Grupo de usuários Java do Triângulo Mineiro

Java pra Web na Arca de Noé

EJB ou Spring

Templates (JSP, JSF, XDoclet, Velocity, Tiles, Thymeleaf)

HTML + CSS + JS + JQuery

Aplicações web modernas

Usuários estão mais exigentes. Não querem sites lentos e estáticos. Eles querem:

• Sites bonitos
• Não precisar carregar páginas a cada ação
• Carregar pedaços da página dinamicamente

Produtividade para desenvolvedores

Websites devem ser desenvolvidos rapidamente

Esperar 1 minuto para fazer um simples deploy não é mais aceitável

Sistemas pronto para produção

Sites que devem aguentar milhares de usuários

Diversos clientes acessando o backend através de REST

Como resolver esses problemas

• Fronteend com HTML/CSS/Javascript
• Backend robusto com últimas tecnologias de Java, caching e acesso a dados
• Tudo configurado automaticamente, com performance em mente
• Ferramentas adequadas para otimizar o desenvolvimento

Client-side technologies

YEOMAN, GULP, BOWER, ANGULARJS, BOOTSTRAP

Yeoman

Geração de esqueleto de aplicação

• Centenas de geradores disponíveis
• A maioria é orientado a aplicaçoes frontend javascript
• Os melhor avaliados são de ótima qualidade

yo jhipster

Gulp

Automação de tarefas com JavaScript

• No desenvolvimento, ele permite o "live reloading", roda tests em background...
• Para produção, comprime e otimiza recursos, compila sass, atualiza referências...

gulp test

Bower

Gerenciador de dependências javascript

• Permite buscar, instalar e atualizar bibliotecas javascript
• Milhares de bibliotecas

bower install angular

Karma

Execução de testes unitários no javascript

• Funciona com Phantom.js, um navegador sem UI
• É muito rápido, e pode rodar continuamente em background

karma start src/test/javascript/karma.conf.js

AngularJS

O framework MVVM mais popular no frontend

• Poderoso & fácil de aprender
• Data binding, form validation, i18n... tudo out of the box

<input type="text" ng-model="yourName" placeholder="Enter a name here">
<h1>Hello {{yourName}}!</h1>

Twitter Bootstrap

Framework CSS/JavaScript para Web apps responsivas

• CSS e elementos HTML para os casos mais comuns
• Um montão de componentes: menus, navbars, drop-down, alertas, formulários...
• Qualquer programador faz algo bonito com o Bootstrap

<div class="alert alert-success">
	<strong>Hello, world!</strong>
</div>

Server-side technologies

MAVEN, SPRING, SPRING MVC REST, SPRING DATA JPA, NETFLIX OSS

Maven | Gradle

Build e gestão de dependência

• Estrutura de diretórios e tarefas padronizados
• Integração com as maiores IDEs
• Ecossistema de plugins rico e maduro

./mvnw spring-boot:run

./gradlew bootRun

Spring Boot

Padrão de-facto para criação de Java apps

• IoC, AOP e diversas abstrações pra facilitar o desenvolvimento
• Rápidi, leve e extremamente poderoso
• Configuração por convenção com Spring Boot

@Service
@Transactional
public class UserService {

	@Inject
	private UserRepository userRepository;

}

Liquibase

Evolução do banco de dados

• Evolução do banco scriptada e reprodutível
• Funciona bem com Spring e JPA
• Exige bom entendimento de banco de dados e ORM

JPA

Mapeamento Objeto Relacional padrão para Java

• Hibernate é a implementação escolhida
• Framework completo de acesso a dados
• Complexo para noobs

@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

Escalabilidade com NOSQL

• Alternativa aos bancos relacionais e ao JPA
• Similaridade: Spring Data MongoDB parecido com Spring Data JPA
• Escalável e fácil de usar

Cassandra

Escalabilidade com NOSQL

• 2a. Alternativa aos bancos relacionais e ao JPA
• Escalabilidade Linear e alta disponibilidade
• Performance extrema e baixa latência para aplicações de missão crítica

Caching

Caching é sinônimo de performance

• Ehcache é a soliução mais usada
• HazelCast é a alternativa para cache clusterizado
• Hibernate 2nd level cache ou Spring Caching

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

}

Spring Security

Segurança à prova de balas

• Framework líder de mercado, usado em todo tipo de aplicação
• Segurança aplicada a URLs e a código Java (Spring Beans)
• Trabalha com arquiteturas stateful (cookies) e stateless (OAuth2/JWT)

Spring MVC REST

O melhor framework REST em Java

• Solução completa de alta performance para REST
• Fácil de usar com Spring, fácil de testar

@RestController
public class AccountResource {
	@RequestMapping(value = "/app/rest/account",
		method = RequestMethod.POST)
	public void saveAccount(@RequestBody UserDTO userDTO) {
	    userService.updateUserInformation(userDTO);
	}
}

Thymeleaf

Server-side templates

• Used quando uma Single Web Page Application não é suficiente
• Substitui JSPs e JSTLs,os quais estão datados e depreciados
• Template engine poderosa e fácil de usar por Web designers

<h1 th:text="#{title}">Hello, world</h1>

Monitoramento

Pronto pra produção com Metrics

• Monitore a JVM, o servidor de aplicação, Spring beans, cache e muito mais!
• Relatórios com JMX ou Graphite

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

Implantação nas nuvens

Para o alto e além

• A implantação da aplicação na nuvem é bastante facilitada
• Ferramentas pra deploy na AWS, Heroku e Cloud Foundry

Porque usar JHipster

SERÁ QUE É APENAS HYPE?

Você disse hype?

Estatísticas de maio de 2016

• 223 contribuintes, incluindo 13 core members
• 4,210 GitHub stars e 928 forks
• 220,000 instalações
• E crescendo rapidamente!

Porque?

Um monte de tecnologias legais, mas...

• Gulp e Maven podem ser amigos?
• AngularJS e Spring MVC REST podem ser amigos?
• Netflix OSS e Spring podem ser amigos?
• Colocar tudo funcionando junto, suavemente, com segurança, cache, monitoramento, não é moleza...

JHipster põe tudo pra funcionar junto

• JHipster cria uma aplicação completa com todas essas tecnologias e ferramentas
• As coisas simplesmente funcionam out-of-the-box
• Temos o workflow do Gulp totalmente integrado nas goals do Maven
• Temos o Docker configurado pra rodar tudo na boa

E ainda tem mais!

• "entity": subgerador que gera uma entidade JPA completa, do banco de dados até o Angular
• "import-jdl": subgerador que gera u modelo de entidades complexo usando JDL Studio
• "service" subgerador que gera um Spring business service
• "languages" subgerador que adiciona um novo idioma para o i18n

E ainda tem mais!

• Ótimo suporte para criar microservices e gateways
• JHipster Registry (Netflix Eureka + Spring cloud config server) fornecido out-of-the-box
• JHipster Console com ELK (Elasticsearch + Logstash + Kibana) fornecido out-of-the-box
• Suporte ao Docker
• Módulos adicionais: https://jhipster.github.io/modules/marketplace/

Pronto pra rodar

• GZipping e HTTP caching headers
• Otimização e minificação do JavaScript e CSS com o Gulp
• Executável standalone ou arquivo WAR padrão, com monitoramento habilitado
• Subgeradores para deploy automático no Cloud Foundry, Heroku e AWS
• "docker-compose": subgerador que gera a configuração do Docker para fazer deploy de microservices

Hello World

TUTORIAL 10 MINUTOS

Instalação

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

Crie uma aplicação

E use o maven pra executar(hot reload automático)

yo jhipster
./mvnw

Client-side live reload

Live reload co código do frontend (HTML, CSS, JavaScript) graças ao Gulp e Browsersync.

Edita > Salva > Navegador atualiza automaticamente

gulp

Adicionaruma entidade

yo jhipster:entity Foo

Rodar em modo de produção

(Rodando o banco no docker)

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

Perguntas?

Email: josenaldo@gmail.com

Twitter: @josenaldomatos

Github: https://github.com/josenaldo