jhipster sample app

jhipsterПримерприложения

Это приложение было создано с использованием JHipster 8.7.3. Документацию и справку можно найти по адресу https://www.jhipster.tech/documentation-archive/v8.7.3.

Структура проекта

Узел необходим для генерации и рекомендуется к разработке. package.json всегда создается для улучшения процесса разработки с помощью более красивых обработчиков коммитов, сценариев и т. д.

В корне проекта JHipster генерирует файлы конфигурации для таких инструментов, как git, prettier, eslint, Husky и других, которые хорошо известны, и вы можете найти ссылки в Интернете.

Структура /src/* соответствует структуре Java по умолчанию.

• .yo-rc.json — файл конфигурации Yeoman. Конфигурация JHipster хранится в этом файле под ключом generator-jhipster . Вы можете найти generator-jhipster-* для конкретной конфигурации чертежей.

• .yo-resolve (необязательно) — средство разрешения конфликтов Yeoman. Позволяет использовать определенное действие при обнаружении конфликтов, пропуская запросы для файлов, соответствующих шаблону. Каждая строка должна соответствовать [pattern] [action] при этом шаблон должен быть шаблоном Minimatch, а действие должно быть одним из пропуска (по умолчанию, если опущено) или принудительного действия. Строки, начинающиеся с # считаются комментариями и игнорируются.

• .jhipster/*.json — файлы конфигурации объектов JHipster.

• npmw — оболочка для использования локально установленного npm. JHipster по умолчанию устанавливает Node и npm локально, используя инструмент сборки. Эта оболочка гарантирует, что npm установлен локально, и использует его, избегая некоторых различий, которые могут вызвать разные версии. Используя ./npmw вместо традиционного npm вы можете настроить среду без узлов для разработки или тестирования вашего приложения.

• /src/main/docker — конфигурации Docker для приложения и служб, от которых зависит приложение.

Разработка

Система сборки автоматически установит рекомендуемую версию Node и npm.

Мы предоставляем оболочку для запуска npm. Вам нужно будет запускать эту команду только при изменении зависимостей в package.json.

 ./npmw install

В качестве системы сборки мы используем сценарии npm и Angular CLI с Webpack.

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

 ./mvnw
./npmw start

Npm также используется для управления зависимостями CSS и JavaScript, используемыми в этом приложении. Вы можете обновить зависимости, указав более новую версию в package.json. Вы также можете запустить ./npmw update и ./npmw install для управления зависимостями. Добавьте флаг help к любой команде, чтобы увидеть, как ее можно использовать. Например, ./npmw help update .

Команда ./npmw run выведет список всех сценариев, доступных для запуска в этом проекте.

Поддержка PWA

JHipster поставляется с поддержкой PWA (Progressive Web App), которая по умолчанию отключена. Одним из основных компонентов PWA является сервис-воркер.

Код инициализации сервисного работника по умолчанию отключен. Чтобы включить его, раскомментируйте следующий код в src/main/webapp/app/app.config.ts :

 ServiceWorkerModule . register ( 'ngsw-worker.js' , { enabled : false } ) ,

Управление зависимостями

Например, чтобы добавить библиотеку Leaflet в качестве зависимости времени выполнения вашего приложения, вы должны выполнить следующую команду:

 ./npmw install --save --save-exact leaflet

Чтобы воспользоваться определениями типов TypeScript из репозитория DefinitelyTyped, находящимся в стадии разработки, необходимо выполнить следующую команду:

 ./npmw install --save-dev --save-exact @types/leaflet

Затем вы импортируете файлы JS и CSS, указанные в инструкциях по установке библиотеки, чтобы Webpack знал о них: Отредактируйте файл src/main/webapp/app/app.config.ts:

 import 'leaflet/dist/leaflet.js';

Отредактируйте файл src/main/webapp/content/scss/vendor.scss:

 @import 'leaflet/dist/leaflet.css';

Примечание. Для Leaflet еще предстоит сделать еще несколько вещей, которые мы здесь не будем подробно описывать.

Дополнительные инструкции по разработке с помощью JHipster см. в разделе Использование JHipster в разработке.

Использование Angular CLI

Вы также можете использовать Angular CLI для создания пользовательского клиентского кода.

Например, следующая команда:

 ng generate component my-component

сгенерирует несколько файлов:

 create src/main/webapp/app/my-component/my-component.component.html
create src/main/webapp/app/my-component/my-component.component.ts
update src/main/webapp/app/app.config.ts

Здание для производства

Упаковка в виде баночки

Чтобы создать финальный jar-файл и оптимизировать приложение jhipsterSampleApplication для производства, запустите:

 ./mvnw -Pprod clean verify

Это позволит объединить и минимизировать клиентские файлы CSS и JavaScript. Он также изменит index.html , чтобы он ссылался на эти новые файлы. Чтобы убедиться, что все работает, запустите:

 java -jar target/*.jar

Затем перейдите по адресу http://localhost:8080 в своем браузере.

Дополнительные сведения см. в разделе «Использование JHipster в производстве».

Упаковка как война

Чтобы упаковать ваше приложение как war и развернуть его на сервере приложений, запустите:

 ./mvnw -Pprod,war clean verify

Центр управления JHipster

Центр управления JHipster может помочь вам управлять вашими приложениями и контролировать их. Вы можете запустить сервер локального центра управления (доступен по адресу http://localhost:7419) с помощью:

 docker compose -f src/main/docker/jhipster-control-center.yml up

Тестирование

Spring Boot-тесты

Чтобы запустить тесты вашего приложения, запустите:

 ./mvnw verify

Гатлинг

Тесты производительности запускаются Гатлингом и пишутся на Scala. Они расположены в src/test/java/gatling/simulations.

Вы можете выполнить все тесты Гатлинга с помощью

 ./mvnw gatling:test

Клиентские тесты

Модульные тесты выполняются Jest. Они расположены в src/test/javascript/ и могут быть запущены с помощью:

 ./npmw test

Сквозные тесты пользовательского интерфейса выполняются на платформе Cypress. Они расположены в src/test/javascript/cypress, и их можно запустить, запустив Spring Boot в одном терминале ( ./mvnw spring-boot:run ) и запустив тесты ( ./npmw run e2e ) во втором.

Аудит маяка

Вы можете выполнить автоматический аудит Lighthouse с помощью cypress-audit, запустив ./npmw run e2e:cypress:audits . Проверки следует проводить только в том случае, если ваше приложение упаковано в рабочий профиль. Отчет маяка создается в target/cypress/lhreport.html

Другие

Качество кода с использованием Sonar

Сонар используется для анализа качества кода. Вы можете запустить локальный сервер Sonar (доступен по адресу http://localhost:9001) с помощью:

 docker compose -f src/main/docker/sonar.yml up -d

Примечание. Мы отключили принудительное перенаправление аутентификации для пользовательского интерфейса в src/main/docker/sonar.yml для стандартного использования при тестировании SonarQube, для реальных случаев использования включите его снова.

Вы можете запустить анализ сонара с помощью сонара-сканера или плагина maven.

Затем запустите анализ сонара:

 ./mvnw -Pprod clean verify sonar:sonar -Dsonar.login=admin -Dsonar.password=admin

Если вам нужно повторно запустить этап Sonar, обязательно укажите хотя бы этап initialize , поскольку свойства Sonar загружаются из файла sonar-project.properties.

 ./mvnw initialize sonar:sonar -Dsonar.login=admin -Dsonar.password=admin

Кроме того, вместо передачи sonar.password и sonar.login в качестве аргументов CLI эти параметры можно настроить из sonar-project.properties, как показано ниже:

 sonar.login=admin
sonar.password=admin

Дополнительную информацию см. на странице «Качество кода».

Поддержка Docker Compose

JHipster генерирует несколько файлов конфигурации Docker Compose в папке src/main/docker/ для запуска необходимых сторонних сервисов.

Например, чтобы запустить необходимые службы в контейнерах Docker, выполните:

 docker compose -f src/main/docker/services.yml up -d

Чтобы остановить и удалить контейнеры, запустите:

 docker compose -f src/main/docker/services.yml down

Интеграция Spring Docker Compose включена по умолчанию. Его можно отключить в application.yml:

 spring :
  ...
  docker :
    compose :
      enabled : false

Вы также можете полностью закрепить свое приложение и все сервисы, от которых оно зависит. Для этого сначала создайте образ Docker вашего приложения, выполнив:

npm run java:docker

Или создайте образ Docker для Arm64 при использовании операционной системы процессора Arm64, такой как MacOS, с работающим семейством процессоров M1:

npm run java:docker:arm64

Затем запустите:

docker compose -f src/main/docker/app.yml up -d

Для получения дополнительной информации см. Использование Docker и Docker-Compose. Эта страница также содержит информацию о подгенераторе Docker Compose ( jhipster docker-compose ), который может генерировать конфигурации Docker для одного или нескольких приложений JHipster.

Непрерывная интеграция (опционально)

Чтобы настроить CI для вашего проекта, запустите подгенератор ci-cd ( jhipster ci-cd ), это позволит вам генерировать файлы конфигурации для ряда систем непрерывной интеграции. Дополнительную информацию см. на странице «Настройка непрерывной интеграции».