Рубрики
Без рубрики

Вступление к хипстеру

Узнайте, как начать работу с Hipster, создав первое простое приложение.

Автор оригинала: baeldung.

1. введение

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

Мы также рассмотрим сгенерированный код на каждом шаге, а также рассмотрим команды сборки и автоматические тесты.

2. Что Такое Хипстер

JHipster -это, в двух словах, генератор кода высокого уровня, построенный на обширном списке передовых инструментов разработки и платформ.

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

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

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

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

Приложение JHipster

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

3. Установка

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

Этого достаточно, если вы решите использовать AngularJS 2. Однако если вы предпочитаете вместо этого использовать AngularJS 1, вам также потребуется установить Bower и Gulp .

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

yarn global add generator-jhipster

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

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

Создание проекта JHipster по сути означает создание проекта Yeoman . Все начинается с команды yo :

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

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

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

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

  • Тип применения – Выбирай Монолитное применение (рекомендуется для простых проектов)
  • Установка других генераторов из JHipster Marketplace – Type N. На этом шаге мы могли бы захотеть установить классные дополнения. Некоторые популярные из них-аудит сущностей, который позволяет отслеживать данные; bootstrap-material-design, который использует модные компоненты Material Design, и angular-datatables
  • Maven или Gradle – Выберите Maven
  • Другие технологии – Не выбирайте никаких опций, просто нажмите Enter , чтобы перейти к следующему шагу. Здесь мы можем выбрать плагин для входа в социальные сети с помощью Google, Facebook и Twitter, что является очень приятной функцией.
  • Клиентская платформа – Выберите [BETA] Angular 2.x. Мы также могли бы использовать AngularJS 1
  • Включите интернационализацию – Введите Y , затем выберите Английский в качестве родного языка. Мы можем выбрать столько языков, сколько захотим, в качестве второго языка
  • Тестовые фреймворки – Выберите Gatling и Транспортир

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

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 генерирует файл README, помещенный прямо в корневую папку нашего проекта . Этот файл содержит инструкции для запуска многих других полезных команд, связанных с нашим проектом.

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 содержит файлы интернационализации для передней части
  • Модульные тесты (Karma) находятся в папке src/test/javascript/spec
  • Сквозные тесты (транспортир) находятся в папке src/test/javascript/e2e

6. Создание Пользовательских Сущностей

Сущности являются строительными блоками нашего приложения JHipster. Они представляют бизнес-объекты, такие как Пользователь , Задача , Сообщение , Комментарий и т. Д.

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

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

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

/| Сообщение также может иметь ноль или много Комментариев . Каждый Комментарий имеет текст и дату создания.

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

yo jhipster:entity post

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

  • Добавьте поле с именем title типа String и добавьте в поле некоторые правила проверки ( Требуется , Минимальная длина и Максимальная длина )
  • Добавьте еще одно поле с именем content типа String и сделайте его также Обязательным
  • Добавьте третье поле с именем Дата создания , типа LocalDate
  • Теперь давайте добавим отношения с Пользователем . Обратите внимание, что сущность User уже существует. Он создан во время разработки концепции проекта. Имя другой сущности – пользователь , имя отношения- создатель , а тип- многие к одному , поле отображения – имя, и лучше сделать отношение обязательным
  • Не используйте TO, вместо этого используйте Direct entity
  • Выберите, чтобы внедрить репозиторий непосредственно в класс обслуживания . Обратите внимание, что в реальном приложении, вероятно, было бы разумнее отделить RestController от класса обслуживания
  • Чтобы закончить, выберите бесконечная прокрутка в качестве типа разбиения на страницы
  • Дайте разрешение JHipster на перезапись существующих файлов, если это необходимо

Повторите описанный выше процесс , чтобы создать сущность с именем comment , с двумя полями, текст, типа String, и Дата создания типа LocalDate . Комментарий также должен иметь обязательную связь “многие к одному” с Сообщением .

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

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

  • Создается папка . hipster , содержащая файл JSON для каждого объекта. Эти файлы описывают структуру сущностей
  • Фактические @Entity аннотированные классы находятся в пакете domain
  • Репозитории создаются в пакете repository
  • Контроллеры REST входят в пакет web.rest
  • Списки изменений Liquibase для каждого создания таблицы находятся в папке resources/config/liquibase/changelog
  • В интерфейсной части создается папка для каждого объекта в каталоге entities
  • Файлы интернационализации настраиваются в папке i18n (не стесняйтесь изменять их, если хотите)
  • В папке src/test создано несколько тестов, интерфейсных и серверных

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

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

mvnw gatling:execute

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

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

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

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

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

yo jhipster:ci-cd

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

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

  • Дженкинс: файл Дженкинсвилл
  • Travis CI: файл .travis.yml
  • Circle CI: файл circle.yml
  • GitLab: файл .gitlab-ci.yml

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

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

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

Читайте ещё по теме: