Введение в JHipster

Введение в JHipster

1. Вступление

Эта статья даст вам краткий обзор JHipster, покажет, как создать простое монолитное приложение и пользовательские объекты с помощью инструментов командной строки.

Мы также будем проверять сгенерированный код на каждом этапе, а также рассмотрим команды сборки и автоматизированные тесты.

2. Что такое Джипстер

JHipster, вкратце,a high-level code generator built upon an extensive list of cutting-edge development tools and platforms.

Основными компонентами инструмента являются:

  • Yeoman, инструмент для фасадных строительных лесов

  • Старый добрыйSpring Boot

  • AngularJS, известный фреймворк Javascript. JHipster также работает сAngularJS 2

JHipster с помощью всего лишь нескольких команд оболочки создает полноценный веб-проект на Java с дружественным, отзывчивым интерфейсом, документированным REST API, всесторонним охватом тестирования, базовой безопасностью и интеграцией с базой данных! Полученный код хорошо прокомментирован и соответствует лучшим отраслевым практикам.

Другие ключевые технологии, используемые ею:

Мы не обязаны использовать все эти элементы в нашем сгенерированном приложении. Необязательные элементы выбираются при создании проекта.

JHipster App

Прекрасное приложение, созданное JHipster. Это результат работы, которую мы будем проделывать в этой статье.

3. Монтаж

Чтобы установить JHipster, нам сначала нужно установить все его зависимости:

Этого достаточно, если вы решите использовать AngularJS 2. Однакоif you prefer to go with AngularJS 1 instead, you would also need to install Bower and Gulp.

Теперь, чтобы закончить, нам просто нужно установить сам JHipster. Это самая легкая часть. Поскольку JHipster - этоYeoman generator, который, в свою очередь, является пакетом Javascript, установка так же проста, как запуск простой команды оболочки:

yarn global add generator-jhipster

Это оно! Мы использовали менеджер пакетов Yarn для установки генератора JHipster.

4. Создание проекта

To create a JHipster project essentially is to build a Yeoman project. Все начинается с командыyo:

mkdir example-app && cd example-app
yo jhipster

Это создаст нашу папку проекта с именемexample-app и запустит интерфейс командной строки Yeoman, который проведет нас через создание проекта.

Процесс включает в себя 15 шагов. Я рекомендую вам изучить доступные варианты на каждом этапе. В рамках этой статьи мы создадим простое приложениеMonolithic, не слишком отклоняясь от параметров по умолчанию.

Вот шаги, которые наиболее актуальны для этой статьи:

  • Type of application - ВыберитеMonolithic application (recommended for simple projects)

  • Installation of other generators from the JHipster Marketplace - ВведитеN. На этом этапе мы могли бы захотеть установить классные дополнения. Некоторые популярные из них - сущностный аудит, который позволяет отслеживать данные; bootstrap-material-design, использующий модные компоненты Material Design и угловые данные

  • Maven or Gradle - ВыберитеMaven

  • Other technologies - Не выбирайте никаких параметров, просто нажмитеEnter, чтобы перейти к следующему шагу. Здесь мы можем подключить социальный вход через Google, Facebook и Twitter, что является очень приятной функцией.

  • Client framework - Выберите[BETA] Angular 2.x. Мы также можем использовать AngularJS 1

  • Enable internationalization - введитеY, затем выберитеEnglish в качестве родного языка. Мы можем выбрать столько языков, сколько захотим, в качестве второго языка

  • Test frameworks - ВыберитеGatling иProtractor

image

JHipster создаст файлы проекта и затем начнет устанавливать зависимости. В выводе будет показано следующее сообщение:

I'm all done. Running npm install for you to install the required
   dependencies. If this fails, try running the command yourself.

Установка зависимостей может занять некоторое время. Как только он закончится, он покажет:

Server application generated successfully.

Run your Spring Boot application:
 ./mvnw

Client application generated successfully.

Start your Webpack development server with:
npm start

Наш проект сейчас создан. Мы можем запустить основные команды в корневой папке нашего проекта:

./mvnw #starts Spring Boot, on port 8080
./mvnw clean test #runs the application's tests
yarn test #runs the client tests

JHipster generates a README file, placed right in the root folder of our project. Этот файл содержит инструкции для запуска многих других полезных команд, связанных с нашим проектом.

5. Обзор сгенерированного кода

Посмотрите на файлы, автоматически сгенерированные. Вы заметите, что проект немного похож на стандартный проект Java / Spring, но с множеством дополнительных функций.

Поскольку JHipster позаботится и о создании внешнего кода, вы найдете файлpackage.json, папкуwebpack и некоторые другие материалы, связанные с Интернетом.

Давайте быстро рассмотрим некоторые важные файлы.

5.1. Серверные файлы

  • Как и ожидалось, код Java находится в папкеsrc/main/java

  • Папкаsrc/main/resources содержит часть статического содержимого, используемого кодом Java. Здесь мы найдем файлы интернационализации (в папкеi18n), шаблоны электронной почты и некоторые файлы конфигурации.

  • Модульные и интеграционные тесты находятся в папкеsrc/test/java

  • Тесты производительности (Gatling) указаны вsrc/test/gatling. Однако на данный момент в этой папке не так много контента. После того, как мы создали некоторые объекты, тесты производительности для этих объектов будут находиться здесь

5.2. Внешний интерфейс

  • Корневая папка переднего плана -src/main/webapp

  • Папкаapp содержит большую часть модулей AngularJS.

  • i18n содержит файлы интернационализации для клиентской части

  • Модульные тесты (Карма) находятся в папкеsrc/test/javascript/spec

  • Сквозные тесты (транспортир) находятся в папкеsrc/test/javascript/e2e

6. Создание настраиваемых объектов

Объекты являются строительными блоками нашего приложения JHipster. Они представляют бизнес-объекты, такие какUser, aTask, aPost, aComment и т. Д.

Создание сущностей с JHipster - безболезненный процесс. Мы можем создать объект с помощью инструментов командной строки, аналогично тому, как мы создали сам проект, или с помощьюJDL-Studio, онлайн-инструмента, который генерирует JSON-представление сущностей, которые впоследствии могут быть импортированы в наш проект.

В этой статье давайте воспользуемся инструментами командной строки для создания двух сущностей:Post иComment.

Post должен иметь заголовок, текстовое содержимое и дату создания. Он также должен быть связан с пользователем, который является создателемPost. СUser может быть связано многоPosts.

Post также может иметь ноль или многоComments. КаждыйComment имеет текст и дату создания.

Чтобы запустить процесс создания нашей сущностиPost, перейдите в корневую папку нашего проекта и введите:

yo jhipster:entity post

Теперь следуйте инструкциям интерфейса.

  • Добавьте поле с именемtitle типаString и добавьте некоторые правила проверки в поле (Required,Minimum length иMaximum length)

  • Добавьте еще одно поле с именемcontent типаString и сделайте его такжеRequired

  • Добавьте третье поле с именемcreationDate типаLocalDate

  • Теперь давайте добавим связь сUser. Обратите внимание, что объектUser уже существует. Он создан при замысле проекта. Имя другого объекта -user, имя отношения -creator, тип -many-to-one, поле отображения -name,, и лучше установить связьrequiredс

  • Не выбирайте использование DTO, вместо этого используйтеDirect entity

  • Выберите, чтобы добавить репозиторий непосредственно в класс обслуживания.. Обратите внимание, что в реальном приложении, вероятно, было бы более разумным отделить контроллер REST от класса обслуживания.

  • В завершение выберитеinfinite scroll в качестве типа пагинации.

  • Дайте JHipster разрешение перезаписывать существующие файлы, если это необходимо

Повторите описанный выше процесс, чтобы создать объект с именемcomment, с двумя полями, текстовыми, типаString, иcreationDate типаLocalDate. Comment также должен иметь требуемую связьmany-to-one сPost.

Это оно! В этом процессе много шагов, но вы увидите, что на их выполнение не требуется много времени.

Вы заметите, что JHipster создает кучу новых файлов и изменяет несколько других, как часть процесса создания сущностей:

  • Создается папка.jhipster, содержащая файлJSON для каждого объекта. Эти файлы описывают структуру сущностей

  • Фактические аннотированные классы@Entity находятся в пакетеdomain

  • Репозитории создаются в пакетеrepository

  • Контроллеры REST входят в пакетweb.rest

  • Журналы изменений Liquibase для каждого создания таблицы находятся в папкеresources/config/liquibase/changelog

  • Во внешней части папка для каждой сущности создается в каталогеentities

  • Файлы интернационализации устанавливаются в папкеi18n (не стесняйтесь изменять их, если хотите)

  • В папкеsrc/test создаются несколько тестов, интерфейс и сервер.

Это довольно много кода!

Не стесняйтесь запускать тесты и перепроверить, что все прошло. Теперь мы также можем запускать тесты производительности с помощью Gatling, используя команду (для выполнения этих тестов приложение должно быть запущено):

mvnw gatling:execute

Если вы хотите проверить интерфейс в действии, запустите приложение с./mvnw, перейдите кhttp://localhost:8080 и войдите в систему как пользовательadmin (пароль:admin ).

ВыберитеPost в верхнем меню под пунктом менюEntities. Вам будет показан пустой список, который позже будет содержать все сообщения. Нажмите кнопкуCreate a new Post, чтобы открыть форму включения:

image

Обратите внимание, насколько осторожен JHipster для компонентов формы и сообщений проверки. Конечно, мы можем изменять интерфейс настолько, насколько мы хотим, но форма очень хорошо сложена, как есть.

7. Поддержка непрерывной интеграции

JHipster может автоматически создавать файлы конфигурации для наиболее часто используемых инструментов непрерывной интеграции. Просто запустите эту команду:

yo jhipster:ci-cd

И ответь на вопросы. Здесь мы можем выбрать, для каких инструментов CI мы хотим создавать файлы конфигурации, хотим ли мы использовать Docker, Sonar и даже развертывать их в Heroku в рамках процесса сборки.

Командаci-cd может создавать файлы конфигурации для следующих инструментов CI:

  • Дженкинс: файлJenkinsFile

  • Travis CI: файл.travis.yml

  • Обведите CI: файлcircle.yml

  • GitLab: файл.gitlab-ci.yml

8. Заключение

Эта статья рассказала о том, на что способен JHipster. Конечно, это гораздо больше, чем мы можем здесь рассказать, так что определенно продолжайте изучатьofficial JHipster website.

И как всегда доступен кодover on GitHub.