Introduksjon til JHipster

1. Introduksjon

Denne artikkelen vil gi deg en rask oversikt over JHipster, vise deg hvordan du lager en enkel monolitisk applikasjon og tilpassede enheter ved hjelp av kommandolinjeverktøy.

Vi vil også undersøke den genererte koden under hvert trinn, og også dekke byggekommandoer og automatiserte tester.

2. Hva er Jhipster

JHipster er, i et nøtteskall, en kodegenerator på høyt nivå bygget på en omfattende liste over banebrytende utviklingsverktøy og plattformer.

Hovedkomponentene i verktøyet er:

Yeoman, et stillasverktøy foran
God gammel vårstøvel
AngularJS, det fremtredende Javascript-rammeverket. JHipster fungerer også med AngularJS 2

JHipster oppretter, med bare noen få shell-kommandoer, et fullverdig Java-webprosjekt med et vennlig, responsivt frontend, dokumentert REST API, omfattende testdekning, grunnleggende sikkerhet og databaseintegrasjon! Den resulterende koden er godt kommentert og følger bransjens beste praksis.

Andre viktige teknologier som utnyttes av den er:

Swagger, for API-dokumentasjon
Maven, Npm, Garn, Gulp og Bower som avhengighetsledere og bygger verktøy
Jasmin, Vinkelmåler, Agurk og Gatling som testrammer
Liquibase for versjonering av database

Vi er ikke pålagt å bruke alle disse elementene i den genererte applikasjonen vår. De valgfrie elementene velges under prosjektopprettelsen.

En vakker JHipster-generert applikasjon. Dette er resultatet av arbeidet vi skal gjøre gjennom denne artikkelen.

3. Installasjon

For å installere JHipster, må vi først installere alle avhengighetene:

Java - utgivelse 8 anbefales
Git - versjonskontrollsystemet
NodeJS
Yeoman
Garn

Det er nok avhengigheter hvis du bestemmer deg for å bruke AngularJS 2. Imidlertid Hvis du foretrekker å gå med AngularJS 1 i stedet, må du også installere Bower og Gulp.

Nå, for å fullføre, trenger vi bare å installere JHipster selv. Det er den enkleste delen. Siden JHipster er en Yeoman-generator, som igjen er en Javascript-pakke, er installering så enkelt som å kjøre en enkel skallkommando:

garn global add generator-jhipster

Det er det! Vi har brukt Garn-pakkebehandling for å installere JHipster-generatoren.

4. Opprette et prosjekt

Å lage et JHipster-prosjekt er egentlig å bygge et Yeoman-prosjekt. Alt starter med yo kommando:

mkdir baeldung-app && cd baeldung-app yo jhipster

Dette vil opprette prosjektmappen vår, med navnet baeldung-app, og start opp Yeomans kommandolinjegrensesnitt som vil lede oss gjennom å lage prosjektet.

Prosessen innebærer 15 trinn. Jeg oppfordrer deg til å utforske de tilgjengelige alternativene på hvert trinn. I omfanget av denne artikkelen vil vi lage en enkel, Monolitisk applikasjonen, uten å avvike for mye fra standardalternativene.

Her er trinnene som er mest relevante for denne artikkelen:

Søknadstype - Velg Monolitisk applikasjon (anbefales for enkle prosjekter)
Installasjon av andre generatorer fra JHipster Marketplace - Skriv N. I dette trinnet kan det være lurt å installere kule tillegg. Noen populære er enhetsrevisjon som muliggjør datasporing; bootstrap-material-design, som bruker de trendy materialdesignkomponentene og kantete datatabeller
Maven eller Gradle - Velg Maven
Andre teknologier - Ikke velg noen alternativer, bare trykk Tast inn for å gå til neste trinn. Her kan vi velge å plugge inn sosial pålogging med Google, Facebook og Twitter, noe som er en veldig fin funksjon.
Rammeverk for klienter - Velg [BETA] Vinkel 2.x. Vi kan også gå med AngularJS 1
Aktiver internasjonalisering - Skriv Y, velg deretter Engelsk som morsmål. Vi kan velge så mange språk som vi ønsker som andrespråk
Test rammer - Å velge Gatling og Vinkelmåler

JHipster oppretter prosjektfilene og begynner deretter å installere avhengighetene. Følgende melding vises i utgangen:

Jeg er ferdig. Kjører npm install for at du skal installere de nødvendige avhengighetene. Hvis dette mislykkes, kan du prøve å kjøre kommandoen selv.

Avhengighetsinstallasjonen kan ta litt tid. Når den er ferdig, vises den:

Serverapplikasjonen ble generert. Kjør Spring Boot-applikasjonen: ./mvnw Client-applikasjon generert. Start Webpack-utviklingsserveren med: npm start

Prosjektet vårt er nå opprettet. Vi kan kjøre hovedkommandoene i prosjektets rotmappe:

./mvnw #starts Spring Boot, på port 8080 ./mvnw ren test # kjører applikasjonens tester garntest # kjører klienttestene

JHipster genererer en README-fil, plassert rett i rotmappen til prosjektet vårt. Den filen inneholder instruksjoner for å kjøre mange andre nyttige kommandoer relatert til prosjektet vårt.

5. Oversikt over generert kode

Ta en titt på filene som genereres automatisk. Du vil legge merke til at prosjektet ser ganske ut som et standard Java / Spring-prosjekt, men med mange ekstrautstyr.

Siden JHipster tar seg av å lage front-end-koden også, finner du en pakke.json fil, en webpack mappe og noen andre nettrelaterte ting.

La oss raskt utforske noen av de kritiske filene.

5.1. Back-end filer

Som forventet er Java-koden inneholdt i src / main / java mappe
De src / main / resources mappen har noe av det statiske innholdet som brukes av Java-koden. Her finner vi internasjonaliseringsfilene (i i18n mappe), e-postmaler og noen konfigurasjonsfiler
Enhetstester og integrasjonstester er lokalisert i src / test / java mappe
Performance (Gatling) tester er inne src / test / gatling. På dette tidspunktet vil det imidlertid ikke være mye innhold i denne mappen. Når vi har opprettet noen enheter, vil prestasjonstestene for disse objektene bli lokalisert her

5.2. Front-end

Rotmappen for enden er src / main / webapp
De app mappen inneholder mye av AngularJS-modulene
i18n inneholder internasjonaliseringsfilene for frontendelen
Enhetstester (Karma) er i src / test / javascript / spec mappe
End-to-end tester (Vinkelmåler) er i src / test / javascript / e2e mappe

6. Opprette egendefinerte enheter

Enheter er byggesteinene i JHipster-applikasjonen. De representerer forretningsobjektene, som en Bruker, a Oppgave, a Post, a Kommentar, etc.

Å skape enheter med JHipster er en smertefri prosess. Vi kan opprette et objekt ved hjelp av kommandolinjeverktøy, på samme måte som hvordan vi har opprettet selve prosjektet, eller via JDL-Studio, et online verktøy som genererer en JSON-representasjon av enhetene som senere kan importeres til prosjektet vårt.

I denne artikkelen, la oss bruke kommandolinjeverktøyene til å opprette to enheter: Post og Kommentar.

EN Post skal ha en tittel, et tekstinnhold og en opprettelsesdato. Det bør også være relatert til en bruker, som er skaperen av Post. EN Bruker kan ha mange Innlegg knyttet til dem.

EN Post kan også ha null eller mange Kommentarer. Hver Kommentar har en tekst og opprettelsesdato.

Å fyre opp skapelsesprosessen til vår Post enhet, gå til rotmappen til prosjektet vårt og skriv:

yo jhipster: enhetspost

Følg trinnene som presenteres av grensesnittet.

Legg til et felt som heter tittel av typen String og legg til noen valideringsregler i feltet (Påkrevd, Minimum lengde og Maksimal lengde)
Legg til et felt som heter innhold av typen String og gjør det også Påkrevd
Legg til et tredje felt med navnet opprettelsesdato, av typen LocalDate
La oss nå legge til forholdet til Bruker. Legg merke til at enheten Bruker eksisterer allerede. Den ble opprettet under oppfatningen av prosjektet. Navnet på den andre enheten er bruker, forholdet navnet er skaperen, og typen er mange-mot-en, er displayfeltet Navn, og det er bedre å lage forholdet kreves
Ikke velg å bruke en DTO, gå med Direkte enhet i stedet
Velg å injisere depotet direkte i serviceklassen. Legg merke til at det i en virkelig applikasjon sannsynligvis ville være mer rimelig å skille REST-kontrolleren fra serviceklassen
Velg for å fullføre uendelig rulling som pagineringstypen
Gi JHipster tillatelse til å overskrive eksisterende filer om nødvendig

Gjenta prosessen ovenfor for å opprette en enhet som heter kommentar, med to felt, tekst, av typen Streng, og opprettelsesdato av typen LocalDate. Kommentar burde også ha et påkrevd mange-mot-en forhold med Post.

Det er det! Det er mange trinn i prosessen, men du vil se at det ikke tar så lang tid å fullføre dem.

Du vil legge merke til at JHipster oppretter en haug med nye filer, og endrer noen få andre, som en del av prosessen med å lage enhetene:

A.jhipster mappen opprettes, og inneholder en JSON fil for hvert objekt. Disse filene beskriver enhetene
Den faktiske @Enhet merkede klasser er i domene pakke
Oppbevaringssteder opprettes i oppbevaringssted pakke
REST-kontrollere går i web.rest pakke
Liquibase-endringslogger for hver tabelloppretting er i ressurser / config / liquibase / changelog mappe
I frontendedelen opprettes en mappe for hver enhet i enheter katalog
Internasjonaliseringsfiler er satt opp i i18n mappe (endre dem gjerne hvis du vil)
Flere tester, front-end og back-end er opprettet i src / test mappe

Det er ganske mye kode!

Kjør gjerne testene og dobbeltsjekk at alt er bestått. Nå kan vi også kjøre ytelsestester med Gatling ved å bruke kommandoen (applikasjonen må kjøre for at disse testene skal bestå):

mvnw gatling: utføre

Hvis du vil sjekke frontend-enden i aksjon, starter du applikasjonen med./ mvnw, navigere til // lokal vert: 8080 og logg inn som admin bruker (passord er admin).

Velge Post på toppmenyen, under Enheter menyelement. Du får vist en tom liste som senere vil inneholde alle innlegg. Klikk på Opprett et nytt innlegg knapp for å få opp inkluderingsskjemaet:

Legg merke til hvor forsiktig JHipster er på skjemakomponentene og valideringsmeldingene. Selvfølgelig kan vi endre frontenden så mye vi vil, men formen er veldig godt bygget som den er.

7. Kontinuerlig integrasjonsstøtte

JHipster kan automatisk opprette konfigurasjonsfiler for de mest brukte kontinuerlige integrasjonsverktøyene. Bare kjør denne kommandoen:

yo jhipster: ci-cd

Og svar på spørsmålene. Her kan vi velge hvilke CI-verktøy vi vil lage konfigurasjonsfiler for, om vi vil bruke Docker, Sonar og til og med distribuere til Heroku som en del av byggeprosessen.

De ci-cd kommandoen kan opprette konfigurasjonsfiler for følgende CI-verktøy:

Jenkins: filen er JenkinsFile
Travis CI: filen er .travis.yml
Circle CI: filen er sirkel.yml
GitLab: filen er .gitlab-ci.yml

8. Konklusjon

Denne artikkelen ga litt smak av hva JHipster er i stand til. Det er selvfølgelig mye mer enn vi kan dekke her, så fortsett å utforske det offisielle JHipster-nettstedet.

Og som alltid er koden tilgjengelig på GitHub.

streamalism.org