diff --git a/src/docs/asciidoc/antora.yml b/src/docs/asciidoc/antora.yml index 3bb2054..8437cb1 100644 --- a/src/docs/asciidoc/antora.yml +++ b/src/docs/asciidoc/antora.yml @@ -10,6 +10,9 @@ asciidoc: sourcedir: 'example$' book-title: The JHipster Mini-Book author: Matt Raible + # These variables are used by the website version of the book + revnumber: 7.0.0-SNAPSHOT + revyear: 2023 email: matt@raibledesigns.com subject: JHipster keywords: JHipster, Angular, Bootstrap, Spring Boot, Spring Cloud, Spring Security, Microservices, Docker, Heroku, Security, JWT, OAuth 2.0, OIDC diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/angular/search-results.json b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/angular/search-results.json similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/angular/search-results.json rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/angular/search-results.json diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/alerts.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/alerts.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/alerts.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/alerts.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/basicelement-withvalidation.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/basicelement-withvalidation.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/basicelement-withvalidation.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/basicelement-withvalidation.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/basicelement.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/basicelement.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/basicelement.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/basicelement.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/buttons.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/buttons.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/buttons.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/buttons.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/grid-advanced.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/grid-advanced.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/grid-advanced.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/grid-advanced.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/grid-basic.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/grid-basic.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/grid-basic.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/grid-basic.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/navbar.html b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/navbar.html similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/bootstrap/navbar.html rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/bootstrap/navbar.html diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/websockets/tracker.component.ts b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/websockets/tracker.component.ts similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/websockets/tracker.component.ts rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/websockets/tracker.component.ts diff --git a/src/docs/asciidoc/modules/ROOT/examples/chapter2/websockets/tracker.service.ts b/src/docs/asciidoc/modules/ROOT/examples/chapter-2/websockets/tracker.service.ts similarity index 100% rename from src/docs/asciidoc/modules/ROOT/examples/chapter2/websockets/tracker.service.ts rename to src/docs/asciidoc/modules/ROOT/examples/chapter-2/websockets/tracker.service.ts diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/21-points-loc-by-language.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/21-points-loc-by-language.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/21-points-loc-by-language.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/21-points-loc-by-language.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/21-points-loc.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/21-points-loc.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/21-points-loc.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/21-points-loc.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/add-points-page.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/add-points-page.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/add-points-page.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/add-points-page.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/angular-material-theme.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/angular-material-theme.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/angular-material-theme.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/angular-material-theme.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/customize-jenkins.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/customize-jenkins.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/customize-jenkins.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/customize-jenkins.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/deployed-to-heroku.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/deployed-to-heroku.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/deployed-to-heroku.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/deployed-to-heroku.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/elastic-cloud-settings.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/elastic-cloud-settings.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/elastic-cloud-settings.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/elastic-cloud-settings.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/entity-diagram.graffle b/src/docs/asciidoc/modules/ROOT/images/chapter-1/entity-diagram.graffle similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/entity-diagram.graffle rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/entity-diagram.graffle diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/entity-diagram.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/entity-diagram.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/entity-diagram.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/entity-diagram.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/generating-21points.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/generating-21points.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/generating-21points.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/generating-21points.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/homepage-bp-last-30-days.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/homepage-bp-last-30-days.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/homepage-bp-last-30-days.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/homepage-bp-last-30-days.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/homepage-points-this-week.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/homepage-points-this-week.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/homepage-points-this-week.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/homepage-points-this-week.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/jenkins-job-1.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/jenkins-job-1.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/jenkins-job-1.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/jenkins-job-1.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/jenkins-job-success.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/jenkins-job-success.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/jenkins-job-success.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/jenkins-job-success.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/lighthouse-desktop.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/lighthouse-desktop.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/lighthouse-desktop.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/lighthouse-desktop.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/lighthouse-mobile.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/lighthouse-mobile.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/lighthouse-mobile.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/lighthouse-mobile.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/points-list-after.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/points-list-after.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/points-list-after.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/points-list-after.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/points-list-before.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/points-list-before.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/points-list-before.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/points-list-before.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/sendgrid-api-key.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/sendgrid-api-key.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/sendgrid-api-key.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/sendgrid-api-key.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/sonar.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/sonar.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/sonar.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/sonar.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/ui-mockup.graffle b/src/docs/asciidoc/modules/ROOT/images/chapter-1/ui-mockup.graffle similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/ui-mockup.graffle rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/ui-mockup.graffle diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/ui-mockup.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/ui-mockup.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/ui-mockup.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/ui-mockup.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter1/unlock-jenkins.png b/src/docs/asciidoc/modules/ROOT/images/chapter-1/unlock-jenkins.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter1/unlock-jenkins.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-1/unlock-jenkins.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/data.plist b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/data.plist similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/data.plist rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/data.plist diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image10.tiff b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image10.tiff similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image10.tiff rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image10.tiff diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image3.tiff b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image3.tiff similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image3.tiff rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image3.tiff diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image8.tiff b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image8.tiff similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image8.tiff rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image8.tiff diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image9.tiff b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image9.tiff similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.graffle/image9.tiff rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.graffle/image9.tiff diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/angular-mvc.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/angular-mvc.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/indeed-jobs-202212.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/indeed-jobs-202212.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/indeed-jobs-202212.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/indeed-jobs-202212.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/angular/stackoverflow-tags-202212.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/stackoverflow-tags-202212.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/angular/stackoverflow-tags-202212.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/angular/stackoverflow-tags-202212.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/advanced-grid-desktop.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/advanced-grid-desktop.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/advanced-grid-desktop.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/advanced-grid-desktop.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/alert-dismissable.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/alert-dismissable.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/alert-dismissable.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/alert-dismissable.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/alerts.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/alerts.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/alerts.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/alerts.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basic-grid-desktop.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basic-grid-desktop.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basic-grid-desktop.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basic-grid-desktop.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basic-grid-mobile.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basic-grid-mobile.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basic-grid-mobile.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basic-grid-mobile.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basicelement-validation.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basicelement-validation.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basicelement-validation.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basicelement-validation.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basicelement.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basicelement.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/basicelement.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/basicelement.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/buttons-with-icons.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/buttons-with-icons.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/buttons-with-icons.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/buttons-with-icons.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/buttons.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/buttons.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/buttons.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/buttons.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/navbar-on-mobile.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/navbar-on-mobile.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/navbar-on-mobile.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/navbar-on-mobile.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/navbar-with-dropdown.png b/src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/navbar-with-dropdown.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter2/bootstrap/navbar-with-dropdown.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-2/bootstrap/navbar-with-dropdown.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter3/diagram-boot-reactor.svg b/src/docs/asciidoc/modules/ROOT/images/chapter-3/diagram-boot-reactor.svg similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter3/diagram-boot-reactor.svg rename to src/docs/asciidoc/modules/ROOT/images/chapter-3/diagram-boot-reactor.svg diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter3/spring-boot-logo.png b/src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-boot-logo.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter3/spring-boot-logo.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-boot-logo.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter3/spring-initializr-curl.png b/src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-initializr-curl.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter3/spring-initializr-curl.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-initializr-curl.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter3/spring-initializr-web.png b/src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-initializr-web.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter3/spring-initializr-web.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-3/spring-initializr-web.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/auth0-login-success.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/auth0-login-success.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/auth0-login-success.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/auth0-login-success.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/auth0-login.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/auth0-login.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/auth0-login.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/auth0-login.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/consul-services.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/consul-services.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/consul-services.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/consul-services.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/conways-law.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/conways-law.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/conways-law.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/conways-law.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/diagram-boot-reactor.svg b/src/docs/asciidoc/modules/ROOT/images/chapter-4/diagram-boot-reactor.svg similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/diagram-boot-reactor.svg rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/diagram-boot-reactor.svg diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-entities-available.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-entities-available.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-entities-available.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-entities-available.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-entities-unavailable.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-entities-unavailable.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-entities-unavailable.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-entities-unavailable.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-quick-edit.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-quick-edit.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/gateway-quick-edit.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/gateway-quick-edit.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/jdl-ms-vs-mf-diff.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/jdl-ms-vs-mf-diff.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/jdl-ms-vs-mf-diff.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/jdl-ms-vs-mf-diff.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/jdl-with-kubernetes.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/jdl-with-kubernetes.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/jdl-with-kubernetes.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/jdl-with-kubernetes.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/jhipster-microfrontends.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/jhipster-microfrontends.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/jhipster-microfrontends.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/jhipster-microfrontends.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/jhipster-microservices.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/jhipster-microservices.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/jhipster-microservices.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/jhipster-microservices.png diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/micro-frontends.jpg b/src/docs/asciidoc/modules/ROOT/images/chapter-4/micro-frontends.jpg similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/micro-frontends.jpg rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/micro-frontends.jpg diff --git a/src/docs/asciidoc/modules/ROOT/images/chapter4/store-edit.png b/src/docs/asciidoc/modules/ROOT/images/chapter-4/store-edit.png similarity index 100% rename from src/docs/asciidoc/modules/ROOT/images/chapter4/store-edit.png rename to src/docs/asciidoc/modules/ROOT/images/chapter-4/store-edit.png diff --git a/src/docs/asciidoc/modules/ROOT/index.adoc b/src/docs/asciidoc/modules/ROOT/index.adoc index 989c75f..08c10b9 100644 --- a/src/docs/asciidoc/modules/ROOT/index.adoc +++ b/src/docs/asciidoc/modules/ROOT/index.adoc @@ -38,13 +38,13 @@ include::pages/preface.adoc[] include::pages/introduction.adoc[] -include::pages/chapter1.adoc[] +include::pages/chapter-1.adoc[] -include::pages/chapter2.adoc[] +include::pages/chapter-2.adoc[] -include::pages/chapter3.adoc[] +include::pages/chapter-3.adoc[] -include::pages/chapter4.adoc[] +include::pages/chapter-4.adoc[] include::pages/action.adoc[] diff --git a/src/docs/asciidoc/modules/ROOT/nav.adoc b/src/docs/asciidoc/modules/ROOT/nav.adoc index a089e64..50174b2 100644 --- a/src/docs/asciidoc/modules/ROOT/nav.adoc +++ b/src/docs/asciidoc/modules/ROOT/nav.adoc @@ -3,9 +3,9 @@ * xref:acknowledgments.adoc[] * xref:preface.adoc[] * xref:introduction.adoc[] -* xref:chapter1.adoc[] -* xref:chapter2.adoc[] -* xref:chapter3.adoc[] -* xref:chapter4.adoc[] +* xref:chapter-1.adoc[] +* xref:chapter-2.adoc[] +* xref:chapter-3.adoc[] +* xref:chapter-4.adoc[] * xref:action.adoc[] * xref:about.adoc[] diff --git a/src/docs/asciidoc/modules/ROOT/pages/chapter1.adoc b/src/docs/asciidoc/modules/ROOT/pages/chapter-1.adoc similarity index 98% rename from src/docs/asciidoc/modules/ROOT/pages/chapter1.adoc rename to src/docs/asciidoc/modules/ROOT/pages/chapter-1.adoc index e149055..e77cb98 100644 --- a/src/docs/asciidoc/modules/ROOT/pages/chapter1.adoc +++ b/src/docs/asciidoc/modules/ROOT/pages/chapter-1.adoc @@ -52,7 +52,7 @@ After running this command, I was prompted to answer questions about how I wante [[img-generating-21points]] .Generating the application -image::chapter1/generating-21points.png[Generating the application, 1365, scaledwidth=100%] +image::chapter-1/generating-21points.png[Generating the application, 1365, scaledwidth=100%] endif::[] ifeval::["{media}" == "prepress"] After running this command, I was prompted to answer questions about how I wanted my application to be generated. You can see the choices I made from my answers below. @@ -528,7 +528,7 @@ Below is a screenshot taken after these changes. [[img-bootstrap-angular-material]] .JHipster with Bootstrap Angular Material -image::chapter1/angular-material-theme.png[UI mockup, 1333, scaledwidth=100%, align=center] +image::chapter-1/angular-material-theme.png[UI mockup, 1333, scaledwidth=100%, align=center] -- At this point, I deployed to Heroku for the first time. This is covered in the <> section of this chapter. @@ -557,13 +557,13 @@ At this point, I did some trial-and-error designs with the data model. I generat [[img-ui-mockup]] .UI mockup -image::chapter1/ui-mockup.png[UI mockup, 846, scaledwidth=75%, align=center] +image::chapter-1/ui-mockup.png[UI mockup, 846, scaledwidth=75%, align=center] After figuring out how I wanted the UI to look, I started to think about the data model. I quickly decided I didn't need to track high-level goals (e.g. lose ten pounds in Q1 2023). I was more concerned with tracking weekly goals and 21-Points Health is all about how many points you get in a week. I created the following diagram as my data model. [[img-entity-diagram]] .21-Points Health entity diagram -image::chapter1/entity-diagram.png[21-Points Health entity diagram, 684, scaledwidth=60%, align=center] +image::chapter-1/entity-diagram.png[21-Points Health entity diagram, 684, scaledwidth=60%, align=center] I ran `jhipster entity points`. I added the appropriate fields and their validation rules, and specified a many-to-one relationship with `user`. Below is the final output from my answers. @@ -711,11 +711,11 @@ The biggest visual improvements are on the list screens. I made the buttons a bi [[img-points-list-before]] .Default Daily Points list -image::chapter1/points-list-before.png[Default Daily Points list, 1337, scaledwidth=100%, align=center] +image::chapter-1/points-list-before.png[Default Daily Points list, 1337, scaledwidth=100%, align=center] [[img-points-list-after]] .Default Daily Points list after UI improvements -image::chapter1/points-list-after.png[Default Daily Points list after UI improvements, 1136, scaledwidth=100%, align=center] +image::chapter-1/points-list-after.png[Default Daily Points list after UI improvements, 1136, scaledwidth=100%, align=center] I refactored the HTML at the top of `points.component.html` to put the title, search, and add buttons on the same row. I also removed the button text in favor of a using https://ng-bootstrap.github.io/#/components/tooltip/api[ng-bootstrap's tooltip directive]. The `jhiTranslate` directive you see in the button tooltips is provided by https://github.com/jhipster/ng-jhipster[JHipster's Angular library]. @@ -853,7 +853,7 @@ After making these changes, modifying a bit of HTML, and tweaking some i18n mess [[img-add-points-page]] .Add Points page -image::chapter1/add-points-page.png[Add Points page, 1095, scaledwidth=100%, align=center] +image::chapter-1/add-points-page.png[Add Points page, 1095, scaledwidth=100%, align=center] Improving the UI was the most fun, but also the most time-consuming as it involved lots of little tweaks to multiple screens. The next task was more straightforward: implementing business logic. @@ -1266,7 +1266,7 @@ Below is a screenshot of what this progress bar looked like after restarting the [[img-homepage-progress-bar]] .Progress bar for points this week -image::chapter1/homepage-points-this-week.png[Progress bar for points this week, 1188, scaledwidth=100%, align=center] +image::chapter-1/homepage-points-this-week.png[Progress bar for points this week, 1188, scaledwidth=100%, align=center] // @@ -1695,7 +1695,7 @@ After entering some test data, I was quite pleased with the results. [[img-homepage-bp-last-30-days]] .Chart of blood pressure during the last 30 days -image::chapter1/homepage-bp-last-30-days.png[Chart of blood pressure during the last 30 days, 1190, scaledwidth=100%, align=center] +image::chapter-1/homepage-bp-last-30-days.png[Chart of blood pressure during the last 30 days, 1190, scaledwidth=100%, align=center] I made similar changes to display weights for the last 30 days as a chart. @@ -1707,13 +1707,13 @@ After finishing the MVP (minimum viable product) of 21-Points Health, I did some // from Dropbox > Get Hip with JHipster.key [[img-21-points-loc]] .Project lines of code -image::chapter1/21-points-loc.png[Project lines of code, 600, scaledwidth=60%, align=center] +image::chapter-1/21-points-loc.png[Project lines of code, 600, scaledwidth=60%, align=center] To drill down further, I made a graph of the top three languages in the project: TypeScript, Java, and HTML. [[img-21-points-loc-by-language]] .Project lines of code by language -image::chapter1/21-points-loc-by-language.png[Project lines of code by language, 700, scaledwidth=70%, align=center] +image::chapter-1/21-points-loc-by-language.png[Project lines of code by language, 700, scaledwidth=70%, align=center] // TypeScript: 12812 - 12581 = 231 // Java: 9956 - 9388 = 568 @@ -1863,7 +1863,7 @@ I was pumped to see that this process worked and that my application was availab [[img-deployed-to-heroku]] .First deployment to Heroku -image::chapter1/deployed-to-heroku.png[First deployment to Heroku, 1225, scaledwidth=100%, align=center] +image::chapter-1/deployed-to-heroku.png[First deployment to Heroku, 1225, scaledwidth=100%, align=center] Next, I bought the 21-points.com domain from https://domains.google.com[Google Domains]. To configure this domain for Heroku, I ran `heroku domains:add`. @@ -1939,7 +1939,7 @@ I https://github.com/jhipster/generator-jhipster/issues/20315[created an issue] [[img-elastic-cloud-settings]] .Elastic Cloud settings -image::chapter1/elastic-cloud-settings.png[Elastic Cloud settings, 781, scaledwidth=75%, align=center] +image::chapter-1/elastic-cloud-settings.png[Elastic Cloud settings, 781, scaledwidth=75%, align=center] NOTE: I tried the latest version, but it resulted in an "Unable to parse response body" error. @@ -2042,7 +2042,7 @@ The `SENDGRID_USERNAME` and `SENDGRID_PASSWORD` variables will not work to send [[img-sendgrid-api-key]] .Create SendGrid API key -image::chapter1/sendgrid-api-key.png[Create SendGrid API key, 854, scaledwidth=90%, align=center] +image::chapter-1/sendgrid-api-key.png[Create SendGrid API key, 854, scaledwidth=90%, align=center] Once you have an API key, set the user and password for SendGrid on Heroku: @@ -2161,19 +2161,19 @@ To log in to Jenkins, I navigated to http://localhost:9000. I copied the passwor [[unlock-jenkins]] .Unlock Jenkins -image::chapter1/unlock-jenkins.png[Unlock Jenkins, 1124, scaledwidth=100%, align=center] +image::chapter-1/unlock-jenkins.png[Unlock Jenkins, 1124, scaledwidth=100%, align=center] Next, I chose to install selected plugins and waited while everything installed. [[customize-jenkins]] .Customize Jenkins -image::chapter1/customize-jenkins.png[Customize Jenkins, 1124, scaledwidth=100%, align=center] +image::chapter-1/customize-jenkins.png[Customize Jenkins, 1124, scaledwidth=100%, align=center] I created a new job called "21-points" with a Pipeline script from SCM. I configured a "`Poll SCM`" build trigger with a schedule of `H/5 * * * *`. After saving the job, I confirmed it ran successfully. [[jenkins-job1]] .Jenkins build #1 -image::chapter1/jenkins-job-1.png[First run of 21-points pipeline, 1380, scaledwidth=100%, align=center] +image::chapter-1/jenkins-job-1.png[First run of 21-points pipeline, 1380, scaledwidth=100%, align=center] TIP: It's possible the `deployment` stage will fail for you the first time (like it did for me above). If this happens, stop Jenkins, run `heroku login`, then restart Jenkins. @@ -2258,7 +2258,7 @@ I was pumped to see all the stages in my pipeline pass. [[jenkins-job-success]] .Jenkins success! -image::chapter1/jenkins-job-success.png[Jenkins success!, 1619, scaledwidth=100%, align=center] +image::chapter-1/jenkins-job-success.png[Jenkins success!, 1619, scaledwidth=100%, align=center] When working on this project, I'd start Jenkins and have it running while I checked in code. I did not install it on a server and leave it running continuously. My reason was simple: I was only coding in bursts and didn't need to waste computing cycles or want to pay for a cloud instance to run it. @@ -2296,7 +2296,7 @@ Once this process completed, an analysis of the project was available on the Son [[sonar-results]] .Sonar results -image::chapter1/sonar.png[Sonar results, 691, scaledwidth=100%, align=center] +image::chapter-1/sonar.png[Sonar results, 691, scaledwidth=100%, align=center] == Progressive web apps @@ -2341,7 +2341,7 @@ After making these changes, I redeployed 21-Points Health to production and used [[lighthouse-analysis]] .Lighthouse analysis -image::chapter1/lighthouse-desktop.png[Lighthouse analysis, 733, scaledwidth=90%, align=center] +image::chapter-1/lighthouse-desktop.png[Lighthouse analysis, 733, scaledwidth=90%, align=center] // lighthouse-mobile.png has the mobile scores: // { performance: 76, accessibility: 95, best practices: 92, SEO: 89 } diff --git a/src/docs/asciidoc/modules/ROOT/pages/chapter2.adoc b/src/docs/asciidoc/modules/ROOT/pages/chapter-2.adoc similarity index 95% rename from src/docs/asciidoc/modules/ROOT/pages/chapter2.adoc rename to src/docs/asciidoc/modules/ROOT/pages/chapter-2.adoc index d4d35b3..8b15643 100644 --- a/src/docs/asciidoc/modules/ROOT/pages/chapter2.adoc +++ b/src/docs/asciidoc/modules/ROOT/pages/chapter-2.adoc @@ -11,11 +11,11 @@ JHipster supports three UI frameworks: Angular, React, and Vue. In the first two [[img-angular-jobs-2022]] .Jobs on Indeed, December 2022 -image::chapter2/angular/indeed-jobs-202212.png[Jobs on Indeed, 450, scaledwidth=75%, align=center] +image::chapter-2/angular/indeed-jobs-202212.png[Jobs on Indeed, 450, scaledwidth=75%, align=center] [[img-stackoverflow-tags-2022]] .Stack Overflow Tags, December 2022 -image::chapter2/angular/stackoverflow-tags-202212.png[Tags on Stack OverFlow, 450, scaledwidth=75%, align=center] +image::chapter-2/angular/stackoverflow-tags-202212.png[Tags on Stack OverFlow, 450, scaledwidth=75%, align=center] Angular is the default UI framework used by JHipster. It's written in TypeScript, compiles to JavaScript, and just using it makes you a hipster! Like Struts in the early 2000s and Rails in the mid-2000s, Angular and other JavaScript frameworks have changed the way developers write web applications. Today, data is exposed via REST APIs and UIs are written in JavaScript (or TypeScript). As a Java developer, I was immediately attracted to Angular when I saw its separation of concerns. It recommended organizing your application into several components: @@ -115,7 +115,7 @@ The MVC pattern is a common one for web frameworks to implement. With Angular, t [[img-angular-mvc]] .MVC in Angular -image::chapter2/angular/angular-mvc.png[MVC in Angular, 500, scaledwidth=75%, align=center] +image::chapter-2/angular/angular-mvc.png[MVC in Angular, 500, scaledwidth=75%, align=center] Below is a `SearchService` to fetch search results. It's expected that a JSON endpoint exists at `/api/search` on the same server. @@ -300,7 +300,7 @@ Does your API return data like the following? [source,json] ---- -include::{sourcedir}/chapter2/angular/search-results.json[] +include::{sourcedir}/chapter-2/angular/search-results.json[] ---- If so, you could display it in the `search.component.html` template with Angular's `*ngFor` directive. @@ -378,20 +378,20 @@ A basic example of the grid is shown below. [source,html] ---- -include::{sourcedir}/chapter2/bootstrap/grid-basic.html[] +include::{sourcedir}/chapter-2/bootstrap/grid-basic.html[] ---- When rendered with Bootstrap's CSS, the above HTML looks as follows on a desktop. The minimum width of the container element on the desktop is set to 1200 px. [[img-bootstrap-basic-grid-desktop]] .Basic grid on desktop -image::chapter2/bootstrap/basic-grid-desktop.png[Basic grid on desktop, 732, scaledwidth=100%] +image::chapter-2/bootstrap/basic-grid-desktop.png[Basic grid on desktop, 732, scaledwidth=100%] If you squish your browser to less than 1200 px wide or render this same document on a smaller screen, the columns will stack. [[img-bootstrap-basic-grid-mobile]] .Basic grid on a mobile device -image::chapter2/bootstrap/basic-grid-mobile.png[Basic grid on a mobile device, 552, scaledwidth=75%] +image::chapter-2/bootstrap/basic-grid-mobile.png[Basic grid on a mobile device, 552, scaledwidth=75%] Bootstrap's grid can be used to align and position your application's elements, widgets, and features. It's helpful to understand a few basics if want to use it effectively. @@ -405,12 +405,12 @@ Each tier of classes scales up, meaning that if you plan to set the same widths [source,html] ---- -include::{sourcedir}/chapter2/bootstrap/grid-advanced.html[] +include::{sourcedir}/chapter-2/bootstrap/grid-advanced.html[] ---- [[img-bootstrap-advanced-grid-desktop]] .Advanced grid -image::chapter2/bootstrap/advanced-grid-desktop.png[Advanced grid, 734, scaledwidth=100%] +image::chapter-2/bootstrap/advanced-grid-desktop.png[Advanced grid, 734, scaledwidth=100%] You can use size indicators to specify breakpoints in the columns. Breakpoints indicate where a column wraps onto the next row. In the HTML above, "`xs`" and "`md`" are the size indicators (of course, "`sm`", "`lg`", and "`xl`" are the other options). Bootstrap uses the following media query ranges. @@ -487,23 +487,23 @@ When you add Bootstrap's CSS to your web application, chances are it'll quickly [source%autofit,html] ---- -include::{sourcedir}/chapter2/bootstrap/basicelement.html[] +include::{sourcedir}/chapter-2/bootstrap/basicelement.html[] ---- [[img-bootstrap-basic-element]] .Basic form element -image::chapter2/bootstrap/basicelement.png[Basic form element, 534, scaledwidth=90%] +image::chapter-2/bootstrap/basicelement.png[Basic form element, 534, scaledwidth=90%] If you'd like to indicate that this form element is not valid, you'll need to modify the above HTML to display validation warnings. [source%autofit,html] ---- -include::{sourcedir}/chapter2/bootstrap/basicelement-withvalidation.html[] +include::{sourcedir}/chapter-2/bootstrap/basicelement-withvalidation.html[] ---- [[img-bootstrap-basic-element-with-validation]] .Form element with validation -image::chapter2/bootstrap/basicelement-validation.png[Form element with validation, 536, scaledwidth=90%] +image::chapter-2/bootstrap/basicelement-validation.png[Form element with validation, 536, scaledwidth=90%] === CSS @@ -513,12 +513,12 @@ To make your buttons look better, Bootstrap provides `btn` and a number of `btn- [source,html] ---- -include::{sourcedir}/chapter2/bootstrap/buttons.html[] +include::{sourcedir}/chapter-2/bootstrap/buttons.html[] ---- [[img-bootstrap-buttons]] .Buttons -image::chapter2/bootstrap/buttons.png[Buttons, 706, scaledwidth=90%] +image::chapter-2/bootstrap/buttons.png[Buttons, 706, scaledwidth=90%] === Components @@ -528,33 +528,33 @@ Popular Bootstrap components include: dropdowns, button groups, button dropdowns [[img-bootstrap-navbar]] .Navbar with dropdown -image::chapter2/bootstrap/navbar-with-dropdown.png[Navbar with dropdown, 991, scaledwidth=100%] +image::chapter-2/bootstrap/navbar-with-dropdown.png[Navbar with dropdown, 991, scaledwidth=100%] When rendered on a mobile device, everything collapses into a hamburger menu that can expand downward. [[img-bootstrap-navbar-mobile]] .Navbar on mobile -image::chapter2/bootstrap/navbar-on-mobile.png[Navbar on mobile, 527, scaledwidth=50%] +image::chapter-2/bootstrap/navbar-on-mobile.png[Navbar on mobile, 527, scaledwidth=50%] This navbar requires quite a bit of HTML markup, not shown here for the sake of brevity. You can view this source online in link:https://getbootstrap.com/docs/5.2/components/navbar/[Bootstrap's documentation]. An example without ARIA attributes below shows the basic structure. [source%autofit,html] ---- -include::{sourcedir}/chapter2/bootstrap/navbar.html[] +include::{sourcedir}/chapter-2/bootstrap/navbar.html[] ---- Alerts are useful for displaying feedback to the user. You can invoke differently colored alerts with different classes. You'll need to add an `alert` class, plus `alert-[success|info|warning|danger]` to indicate the colors. [source,html] ---- -include::{sourcedir}/chapter2/bootstrap/alerts.html[] +include::{sourcedir}/chapter-2/bootstrap/alerts.html[] ---- This renders alerts like the following. [[img-bootstrap-alerts]] .Alerts -image::chapter2/bootstrap/alerts.png[Alerts, 770, scaledwidth=100%] +image::chapter-2/bootstrap/alerts.png[Alerts, 770, scaledwidth=100%] To make an alert closeable, you need to add an `.alert-dismissible` class and a close button. @@ -568,7 +568,7 @@ To make an alert closeable, you need to add an `.alert-dismissible` class and a [[img-bootstrap-alert-dismissable]] .Closeable alert -image::chapter2/bootstrap/alert-dismissable.png[Closeable alert, 768, scaledwidth=100%] +image::chapter-2/bootstrap/alert-dismissable.png[Closeable alert, 768, scaledwidth=100%] TIP: To make the links in your alerts match the colors of the alerts, use `.alert-link`. @@ -602,7 +602,7 @@ You can see how the icons change color based on the font color defined for the e [[img-bootstrap-buttons-icons]] .Buttons with icons -image::chapter2/bootstrap/buttons-with-icons.png[Buttons with icons, 265, scaledwidth=25%] +image::chapter-2/bootstrap/buttons-with-icons.png[Buttons with icons, 265, scaledwidth=25%] === Customizing CSS @@ -824,7 +824,7 @@ To see how WebSockets work, take a look at the `JhiTrackerComponent` in a WebSoc [source%autofit,typescript] .src/main/webapp/app/admin/tracker/tracker.component.ts ---- -include::{sourcedir}/chapter2/websockets/tracker.component.ts[] +include::{sourcedir}/chapter-2/websockets/tracker.component.ts[] ---- The `Tracker` service allows you to send tracking information — for example, to track when someone has authenticated. @@ -832,7 +832,7 @@ The `Tracker` service allows you to send tracking information — for example, t [source%autofit,typescript] .src/main/webapp/app/core/tracker/tracker.service.ts ---- -include::{sourcedir}/chapter2/websockets/tracker.service.ts[] +include::{sourcedir}/chapter-2/websockets/tracker.service.ts[] ---- WebSockets on the server side of a JHipster project are implemented with http://docs.spring.io/spring/docs/current/spring-framework-reference/html/websocket.html[Spring's WebSocket support]. To learn more about WebSockets with Spring, see Baeldung's http://www.baeldung.com/websockets-spring[Intro to WebSockets with Spring]. The next section shows how a developer productivity tool that uses WebSockets implements something very cool. diff --git a/src/docs/asciidoc/modules/ROOT/pages/chapter3.adoc b/src/docs/asciidoc/modules/ROOT/pages/chapter-3.adoc similarity index 99% rename from src/docs/asciidoc/modules/ROOT/pages/chapter3.adoc rename to src/docs/asciidoc/modules/ROOT/pages/chapter-3.adoc index 17f3cc4..c273e4c 100644 --- a/src/docs/asciidoc/modules/ROOT/pages/chapter3.adoc +++ b/src/docs/asciidoc/modules/ROOT/pages/chapter-3.adoc @@ -13,7 +13,7 @@ In August 2013, Phil Webb and Dave Syer, engineers at Pivotal, https://spring.io [[img-spring-boot-diagram]] .Spring Boot 2.0 -image::chapter3/diagram-boot-reactor.svg[Spring Boot 2.0, 600, scaledwidth=100%, align=center] +image::chapter-3/diagram-boot-reactor.svg[Spring Boot 2.0, 600, scaledwidth=100%, align=center] The primary goals of Spring Boot are: @@ -25,11 +25,11 @@ Folks who want to use Spring Boot outside a JHipster application can do so with [[img-spring-initializr-web]] .Spring Initializr in a browser -image::chapter3/spring-initializr-web.png[Spring Initializr in a browser, 1187, scaledwidth=100%] +image::chapter-3/spring-initializr-web.png[Spring Initializr in a browser, 1187, scaledwidth=100%] [[img-spring-initializr-curl]] .Spring Initializr via `curl` -image::chapter3/spring-initializr-curl.png[Spring Initializr via `curl`, 1354, scaledwidth=100%] +image::chapter-3/spring-initializr-curl.png[Spring Initializr via `curl`, 1354, scaledwidth=100%] Spring Initializr is an Apache 2.0-licensed open-source project that you install and customize to generate Spring projects for your company or team. You can find it on GitHub at https://github.com/spring-io/initializr. diff --git a/src/docs/asciidoc/modules/ROOT/pages/chapter4.adoc b/src/docs/asciidoc/modules/ROOT/pages/chapter-4.adoc similarity index 97% rename from src/docs/asciidoc/modules/ROOT/pages/chapter4.adoc rename to src/docs/asciidoc/modules/ROOT/pages/chapter-4.adoc index 47db08c..17d0fc9 100644 --- a/src/docs/asciidoc/modules/ROOT/pages/chapter4.adoc +++ b/src/docs/asciidoc/modules/ROOT/pages/chapter-4.adoc @@ -18,7 +18,7 @@ Technology has traditionally been organized into technology layers: UI team, dat A smart team will optimize around this and choose the lesser of two evils: forcing the logic into whichever application they have access to. This is an example of http://www.melconway.com/Home/Conways_Law.html[Conway's law] in action. .Conway's law -image::chapter4/conways-law.png[Conway's law, 560, scaledwidth=50%, align=center] +image::chapter-4/conways-law.png[Conway's law, 560, scaledwidth=50%, align=center] [quote, Melvyn Conway, 1967] Any organization that designs a system (defined broadly) will produce a design whose structure is a copy of the organization's communication structure. @@ -56,7 +56,7 @@ Spring Boot 2.0 introduced a new web framework called Spring WebFlux. Previous v [[img-spring-boot-2]] .Spring Boot 2.0 -image::chapter4/diagram-boot-reactor.svg[Spring Boot 2.0, 700, scaledwidth=75%, align=center] +image::chapter-4/diagram-boot-reactor.svg[Spring Boot 2.0, 700, scaledwidth=75%, align=center] Reactive programming isn't for every app. The general rule of thumb is it won't help you if you have < 500 requests/second. Chances are Spring MVC will perform as well as Spring WebFlux up to that point. When your traffic takes off, or if you need to process things faster than 500 requests/second, you should take a look at Spring WebFlux. @@ -129,7 +129,7 @@ NOTE: In the previous paragraph, you might notice I spelled micro frontends thre You can see how these components fit in the diagram below. .JHipster microservices architecture -image::chapter4/jhipster-microfrontends.png[JHipster microservices architecture, 1562, scaledwidth=100%, align=center] +image::chapter-4/jhipster-microfrontends.png[JHipster microservices architecture, 1562, scaledwidth=100%, align=center] This tutorial shows you how to build a microservices architecture with JHipster 7.9.3. You'll generate a gateway (powered by Spring Cloud Gateway), a blog microservice (that talks to Neo4j), and a store microservice (that uses MongoDB). The gateway will contain a React shell app that loads the blog and store micro frontends. You'll use Docker Compose to make sure it all runs locally. I'll also provide some pointers on how to deploy it with Kubernetes. @@ -322,7 +322,7 @@ Then, run `./gradlew` (or `npm run app:start` if you prefer npm commands). When You'll be redirected back to the gateway, but the **Entities** menu won't have any links because the micro frontends it tries to load are unavailable. .The gateway's entities are unavailable -image::chapter4/gateway-entities-unavailable.png[JHipster microservices architecture, 1155, scaledwidth=100%, align=center] +image::chapter-4/gateway-entities-unavailable.png[JHipster microservices architecture, 1155, scaledwidth=100%, align=center] Start the `blog` by opening a terminal and navigating to its directory. Then, start its database with Docker and the app with Gradle. @@ -337,12 +337,12 @@ Open a new terminal and do the same for the `store` microservice. You can verify everything is started using Consul at `\http://localhost:8500`. .Consul services -image::chapter4/consul-services.png[Consul services, 1184, scaledwidth=100%, align=center] +image::chapter-4/consul-services.png[Consul services, 1184, scaledwidth=100%, align=center] Refresh the gateway app; you should see menu items to navigate to the microservices now. .Gateway entities available -image::chapter4/gateway-entities-available.png[Consul services, 1132, scaledwidth=100%, align=center] +image::chapter-4/gateway-entities-available.png[Consul services, 1132, scaledwidth=100%, align=center] === Zero turnaround development that sparks joy @@ -362,7 +362,7 @@ Modify the code in `gateway/src/main/webapp/app/modules/home/home.tsx` to make a You'll see this change immediately appear within your browser. .Gateway quick edit -image::chapter4/gateway-quick-edit.png[Gateway quick edit, 1132, scaledwidth=100%, align=center] +image::chapter-4/gateway-quick-edit.png[Gateway quick edit, 1132, scaledwidth=100%, align=center] Remove it, and it'll disappear right away too. @@ -378,7 +378,7 @@ The UI will change before you can kbd:[Cmd+Tab] back to your browser. // todo: this keyboard macro doesn't seem to work in the PDF .Store edit -image::chapter4/store-edit.png[alt=Store edit, width=1119, scaledwidth=100%, align=center] +image::chapter-4/store-edit.png[alt=Store edit, width=1119, scaledwidth=100%, align=center] The backend has quick turnaround abilities too, thanks to https://docs.spring.io/spring-boot/docs/current/reference/html/using.html#using.devtools[Spring Boot devtools]. If you modify a backend class, recompiling it will cause Spring Boot to reload your component lickety-split. It's pretty slick! @@ -684,12 +684,12 @@ docker compose up Now, Spring Security will be configured to use Auth0, and Consul will distribute these settings to all your microservices. When everything is started, navigate to `\http://localhost:8080` and click **sign in**. You will be prompted for your Auth0 credentials. .Auth0 login -image::chapter4/auth0-login.png[alt=Auth0 login, width=1143, scaledwidth=100%, align=center] +image::chapter-4/auth0-login.png[alt=Auth0 login, width=1143, scaledwidth=100%, align=center] After entering your credentials, you'll be redirected back to the gateway, and your username will be displayed. .Auth0 login success -image::chapter4/auth0-login-success.png[alt=Auth0 login success, width=1143, scaledwidth=100%, align=center] +image::chapter-4/auth0-login-success.png[alt=Auth0 login success, width=1143, scaledwidth=100%, align=center] You should be able to add, edit, and delete blogs, posts, tags, and products, proving that your microservices and micro frontends can talk to each other.