Uma apresentação sobre o framework JHipster para construção de aplicações full stack Java. O framework fornece generators, scaffolding e estruturas para criar aplicações web e APIs escaláveis com Spring Boot e Angular/React. O documento discute a arquitetura, geração de projetos, estrutura de pastas, depuração, produção e dicas de uso do JHipster.

1. APLICAÇÕES DE ALTO
DESEMPENHO COM
JHIPSTER FULL STACK
João Gabriel Lima
linkedin/in/joaogabriellima

2. CTO na Epitrack
Professor
Pesquisador em Inteligência Artificial e Big Data
Entusiasta de novas tecnologias!
QUEM SOU E O QUE FAÇO
epitrack.tech

3. HOJE VAMOS COMEÇAR FALANDO DE UM PROBLEMA
RECORRENTE EM QUALQUER PROJETO JAVA:
A ARQUITETURA!

4. PRECISAMOS PENSAR MUITO ALÉM DOS REQUISITOS
FUNCIONAIS E NÃO-FUNCIONAIS.

5. ESCALÁVEL
EXTENSÍVEL
PERFORMÁTICA
FÁCIL DE MANTER
INTEROPERÁVEL
RESILIENTE
UMA BOA ARQUITETURA JAVA
PRECISA SER:

6. E UM NOVO PROJETO?
NÃO IMPORTA O QUÃO EXPERIENTE VOCÊ É, SEMPRE TEM
ALGO QUE VAI TE SURPREENDER EM UM NOVO PROJETO
JAVA!

7. FULLSTACK
Front-end: adaptativo, desacoplado, otimizável
Back-end: regras de negócio, controladores, API`s
Banco de dados: funções, backups, migração, versionamento …

8. GENERATORS
SCAFFOLDING
BOILERPLATES
ETC…

9. ESTRATÉGIAS PARA QUE VOCÊ INICIE UM
PROJETO COM UM PASSO À FRENTE.
UMA ARQUITETURA BEM DEFINIDA, PRONTA
PARA EVOLUIR

10. E EU AINDA NEM COMECEI A
FALAR DA CONSTRUÇÃO DE
MICRO-SERVIÇOS!

11. TUDO ISSO E MUITO MAIS…
JHIPSTER

12. http://www.jhipster.tech/
+300 colaboradores + 7.000 estrelas no GitHub
+ 500.000 instalações
E crescendo…

13. https://github.com/jhipster/generator-jhipster

15. E PARA MICROSSERVIÇOS…

17. https://traefik.io/
"Proxy reverso e balanceador de carga para implantar microservices com facilidade”

18. QUICK START
DEPENDÊNCIAS

19. https://start.jhipster.tech

20. https://start.jhipster.tech

21. SHOW ME THE CODE

22. +

23. SUA PRIMEIRA APLICAÇÃO JHIPSTER - PASSO A PASSO
➤ yarn global add yo
➤ yarn global add generator-jhipster
➤ mkdir soujava
➤ cd soujava
➤ jhipster
http://www.jhipster.tech/creating-an-app/

24. THE JHIPSTER REGISTRY
➤ É um servidor Eureka, que serve como um servidor de
descoberta para aplicativos. É assim que o JHipster lida com
roteamento, balanceamento de carga e escalabilidade para
todas as aplicações.
➤ É um servidor Spring Cloud Config, que fornece configuração
de tempo de execução para todos os aplicativos.
➤ É um servidor de administração, com painéis para monitorar e
gerenciar aplicativos.

26. http://www.jhipster.tech/modules/marketplace/#/list
MARKETPLACE

27. PRONTO! VAMOS RODAR NOSSO PROJETO
Para executar nosso projeto Java
./mvnw
Para executar nosso front com o transpire para Typescript e Live Reload
yarn start
yarn lint verifique se há problemas de estilo de código no código TypeScript
yarn lint:fix corrigir automaticamente problemas de fiabilidade de TypeScript
yarn tsc compile o código TypeScript
yarn test execute testes de unidade com Karma
yarn test:watch mantenha os testes da unidade de karma em execução, para
receber feedback em tempo real quando o código for alterado

28. RODANDO CLIENT E SERVER-SIDE COM LIVE RELOAD
Se você começar a fazer alterações no código do lado do cliente sem que
o Yarn comece a ser executado, nada será refletido pois as mudanças não
são compiladas, então você precisa executar:
yarn webpack:build:dev manualmente após as mudanças ou começar a
execução do yarn (RECOMENDADO).
Você também pode forçar o maven a executar a task do webpack como:
./mvnw -Pdev, webpack

29. webapp
!"" app - Your application
# !"" account - User account management UI
# !"" admin - Administration UI
# !"" blocks - Common building blocks like configuration and interceptors
# !"" entities - Generated entities (more information below)
# !"" home - Home page
# !"" layouts - Common page layouts like navigation bar and error pages
# !"" shared - Common services like authentication and internationalization
# !"" app.main.ts - Main application class
# !"" app.module.js - Application modules configuration
# !"" app.route.js - Main application router
!"" content - Static content
# !"" css - CSS stylesheets
# !"" images - Images
!"" i18n - Translation files
!"" scss - Sass style sheet files will be here if you choose the option
!"" swagger-ui - Swagger UI front-end
!"" 404.html - 404 page
!"" favicon.ico - Fav icon
!"" index.html - Index page
!"" robots.txt - Configuration for bots and Web crawlers
ESTRUTURA DO PROJETO

30. webapp
!"" app
# !"" entities
# !"" foo - CRUD front-end for the Foo entity
# !"" foo.component.html - HTML view for the list page
# !"" foo.component.ts - Controller for the list page
# !"" foo.model.ts - Model representing the Foo entity
# !"" foo.module.ts - Angular module for the Foo entity
# !"" foo.route.ts - Angular Router configuration
# !"" foo.service.ts - Service which access the Foo REST resource
# !"" foo-delete-dialog.component.html - HTML view for deleting a Foo
# !"" foo-delete-dialog.component.ts - Controller for deleting a Foo
# !"" foo-detail.component.html - HTML view for displaying a Foo
# !"" foo-detail.component.ts - Controller or displaying a Foo
# !"" foo-dialog.component.html - HTML view for editing a Foo
# !"" foo-dialog.component.ts - Controller for editing a Foo
# !"" foo-popup.service.ts - Service for handling the create/update dialog pop-up
# !"" index.ts - Barrel for exporting everything
!"" i18n - Translation files
# !"" en - English translations
# # !"" foo.json - English translation of Foo name, fields, ...
# !"" fr - French translations
# # !"" foo.json - French translation of Foo name, fields, ...
ESTRUTURA DO PROJETO

31. https://augury.angular.io/

32. http://www.jhipster.tech/jdl-studio/

33. ALTERANDO O MODELO DE DADOS
Umas das principais dúvidas dos desenvolvedores recém
chegados ao JHipster é na alteração do modelo de dados.
Temos diversas formas de fazer. Seguem as principais:
1) jhipster import-jdl <arquivo> -- force
2) ./mvnw liquidasse:diff
Você pode gerar novas entidades, services e controllers
jhipster entity <entityName> --[options]

34. SEPARANDO FRONT-END E API DE SERVIÇOS
Para gerar apenas o front-end ou uma API de serviços basta
executar os comandos:
$ jhipster --skip-client
$ jhipster --skip-server

35. SOU PROJETO EM PRODUÇÃO

36. PRODUCTION-READY

37. ➤ ./mvnw -Pprod
➤ Gerando um .war
➤ ./mvnw -Pprod package
➤ Executando
➤ ./jhipster-0.0.1-SNAPSHOT.war
➤ java -jar jhipster-0.0.1-SNAPSHOT.war

38. DEPLOY NO HEROIC
heroku login
jhipster heroku
Atualizando sua aplicação
./mvnw package -Pprod -DskipTests
heroku deploy:jar --jar target/*.war
http://www.jhipster.tech/heroku/

39. DICAS FINAIS

40. 1. Se não for um MVP, valide se os componentes da
arquitetura resolvem o seu problema
2. Em produção, mantenha as dependências do
projeto sempre atualizadas
3. use apenas o essencial
4. mantenha os testes atualizados

41. ONDE EU NÃO RECOMENDO O USO:
1. Projetos legados em manutenção evolutiva
2. Tentativa de arquitetura híbrida
3. Pouco conhecimento nas tecnologias que compõe a stack

42. APLICAÇÕES DE ALTO
DESEMPENHO COM
JHIPSTER FULL STACK
João Gabriel Lima
linkedin/in/joaogabriellima