1. 序章

この記事では、JHipsterの概要を簡単に説明し、コマンドラインツールを使用して単純なモノリシックアプリケーションとカスタムエンティティを作成する方法を示します。

また、すべてのステップで生成されたコードを調べ、ビルドコマンドと自動テストについても説明します。

2. Jhipsterとは

JHipster は、一言で言えば、最先端の開発ツールとプラットフォームの広範なリストに基づいて構築された高レベルのコードジェネレーターです。

ツールの主なコンポーネントは次のとおりです。

JHipsterは、わずかなシェルコマンドで、フレンドリーで応答性の高いフロントエンド、ドキュメント化されたREST API、包括的なテストカバレッジ、基本的なセキュリティ、データベース統合を備えた本格的なJavaWebプロジェクトを作成します。 結果のコードは十分にコメント化されており、業界のベストプラクティスに従っています。

それによって活用される他の主要な技術は次のとおりです。

生成されたアプリケーションでこれらすべてのアイテムを使用する必要はありません。 オプションの項目は、プロジェクトの作成時に選択されます。

JHipsterで生成された美しいアプリケーション。 これは、この記事全体で行う作業の結果です。

3. インストール

JHipsterをインストールするには、最初にすべての依存関係をインストールする必要があります。

AngularJS 2を使用する場合は、これで十分な依存関係になります。 ただし、代わりにAngularJS 1を使用する場合は、BowerとGulpもインストールする必要があります。

最後に、JHipster自体をインストールする必要があります。 それが最も簡単な部分です。 JHipsterはYeomanジェネレーターであり、これはJavascriptパッケージであるため、インストールは単純なシェルコマンドを実行するのと同じくらい簡単です。

yarn global add generator-jhipster

それでおしまい！ JHipsterジェネレーターのインストールにはYarnパッケージマネージャーを使用しました。

4. プロジェクトの作成

JHipsterプロジェクトを作成することは、基本的にYeomanプロジェクトを構築することです。 すべてはyoコマンドで始まります。

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

これにより、 baeldung-app という名前のプロジェクトフォルダーが作成され、プロジェクトの作成をガイドするYeomanのコマンドラインインターフェイスが起動します。

このプロセスには15のステップが含まれます。 各ステップで利用可能なオプションを検討することをお勧めします。 この記事の範囲では、デフォルトのオプションから大きく逸脱することなく、単純なMonolithicアプリケーションを作成します。

この記事に最も関連する手順は次のとおりです。

  • アプリケーションの種類– モノリシックアプリケーション（単純なプロジェクトに推奨）を選択します
  • JHipsterマーケットプレイスからの他の発電機のインストール – タイプ N。 このステップでは、クールなアドオンをインストールすることができます。 人気のあるもののいくつかは、データトレースを可能にするエンティティ監査です。 トレンディなマテリアルデザインコンポーネントを使用するbootstrap-material-design、およびangular-datatables
  • MavenまたはGradle– Mavenを選択します
  • その他のテクノロジー–オプションを選択せず、Enterを押すだけで次のステップに進みます。 ここでは、ソーシャルログインをGoogle、Facebook、Twitterにプラグインすることを選択できます。これは非常に優れた機能です。
  • クライアントフレームワーク – 選ぶ [ベータ版]Angular2.x。 AngularJS1を使用することもできます
  • 国際化を有効にする– Y と入力し、母国語として英語を選択します。 第二言語として好きなだけ言語を選ぶことができます
  • テストフレームワーク–ガトリングと分度器を選択します

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は、プロジェクトのルートフォルダーに配置されたREADMEファイルを生成します。 このファイルには、プロジェクトに関連する他の多くの便利なコマンドを実行するための指示が含まれています。

5. 生成されたコードの概要

自動生成されたファイルを見てください。 プロジェクトは標準のJava/Springプロジェクトにかなり似ていますが、多くの追加機能があります。

JHipsterがフロントエンドコードの作成も処理するため、 package.json ファイル、 webpack フォルダー、およびその他のWeb関連のものが見つかります。

重要なファイルのいくつかを簡単に調べてみましょう。

5.1. バックエンドファイル

  • 予想通り、Javaコードは src / main /javaフォルダーに含まれています
  • src / main / resources フォルダーには、Javaコードで使用される静的コンテンツの一部が含まれています。 ここには、国際化ファイル（ i18n フォルダー内）、電子メールテンプレート、およびいくつかの構成ファイルがあります。
  • ユニットテストと統合テストは、 src / test /javaフォルダーにあります。
  • パフォーマンス（ガトリング）テストは src / test /gattlingにあります。 ただし、この時点では、このフォルダには多くのコンテンツはありません。 いくつかのエンティティを作成すると、それらのオブジェクトのパフォーマンステストがここに配置されます

5.2. フロントエンド

  • ルートフロントエンドフォルダーはsrc/ main /webappです。
  • app フォルダーには、AngularJSモジュールの多くが含まれています
  • i18n には、フロントエンド部分の国際化ファイルが含まれています
  • ユニットテスト（Karma）は src / test / javascript /specフォルダーにあります
  • エンドツーエンドテスト（分度器）は src / test / javascript /e2eフォルダーにあります

6. カスタムエンティティの作成

エンティティは、JHipsterアプリケーションの構成要素です。 これらは、ユーザー、タスク、投稿、コメントなどのビジネスオブジェクトを表します。

JHipsterを使用してエンティティを作成するのは、簡単なプロセスです。 プロジェクト自体を作成したのと同じように、コマンドラインツールを使用してオブジェクトを作成できます。または、後でインポートできるエンティティのJSON表現を生成するオンラインツールであるJDL-Studioを使用してオブジェクトを作成できます。私たちのプロジェクト。

この記事では、コマンドラインツールを使用して、PostとCommentの2つのエンティティを作成しましょう。

投稿には、タイトル、テキストコンテンツ、作成日が必要です。 また、Postの作成者であるユーザーに関連している必要があります。 ユーザーには、多くの投稿を関連付けることができます。

投稿には、ゼロまたは多数のコメントを含めることもできます。 各コメントには、テキストと作成日があります。

Post エンティティの作成プロセスを起動するには、プロジェクトのルートフォルダに移動し、次のように入力します。

yo jhipster:entity post

次に、インターフェースによって提示される手順に従います。

  • タイプ文字列のタイトルという名前のフィールドを追加し、フィールドにいくつかの検証ルールを追加します（必須、最小長および最大長さ）
  • タイプStringのcontentというフィールドをもう1つ追加し、Requiredにします。
  • タイプLocalDateのcreationDateという名前の3番目のフィールドを追加します
  • 次に、Userとの関係を追加しましょう。 エンティティUserがすでに存在していることに注意してください。 プロジェクトの構想中に作成されました。 他のエンティティの名前はuser、リレーションシップ名はcreator 、タイプは many-to-one 、表示フィールドはです。名前、そして関係を必須にする方が良いです
  • DTOの使用を選択せず、代わりに直接エンティティを使用してください
  • リポジトリをサービスクラスに直接挿入することを選択します 。 実際のアプリケーションでは、RESTコントローラーをサービスクラスから分離する方がおそらく合理的であることに注意してください。
  • 終了するには、ページネーションタイプとして無限スクロールを選択します
  • 必要に応じて、既存のファイルを上書きする権限をJHipsterに付与します

上記のプロセスを繰り返して、 comment という名前のエンティティを作成します。このエンティティには、 String、タイプとcreationDateタイプのLocalDateの2つのフィールドがあります。 。 コメントには、Postとの多対1の関係も必要です。

それでおしまい！ プロセスには多くのステップがありますが、それらを完了するのにそれほど時間はかからないことがわかります。

エンティティを作成するプロセスの一部として、JHipsterが多数の新しいファイルを作成し、他のいくつかのファイルを変更していることに気付くでしょう。

  • 。jhipsterフォルダーが作成され、各オブジェクトのJSONファイルが含まれます。 これらのファイルは、エンティティの構造を記述しています
  • 実際の@Entity注釈付きクラスは、domainパッケージに含まれています
  • リポジトリはリポジトリパッケージで作成されます
  • RESTコントローラーはweb.restパッケージに含まれています
  • 各テーブル作成のLiquibase変更ログは、 resources / config / liquibase /changelogフォルダーにあります
  • フロントエンド部分では、各エンティティのフォルダがエンティティディレクトリに作成されます
  • 国際化ファイルはi18nフォルダーにセットアップされます（必要に応じて自由に変更してください）
  • src / test フォルダーには、いくつかのテスト、フロントエンド、およびバックエンドが作成されます。

それはかなりたくさんのコードです！

気軽にテストを実行し、すべてが合格していることを再確認してください。 これで、次のコマンドを使用して、Gatlingでパフォーマンステストを実行することもできます（これらのテストに合格するには、アプリケーションが実行されている必要があります）。

mvnw gatling:execute

フロントエンドの動作を確認する場合は、。 / mvnw でアプリケーションを起動し、 http：// localhost：8080 に移動して、としてログインします。 admin ユーザー（パスワードは admin ）。

トップメニューのエンティティメニュー項目で投稿を選択します。 空のリストが表示され、後ですべての投稿が含まれます。 新しい投稿を作成ボタンをクリックして、包含フォームを表示します。

JHipsterがフォームコンポーネントと検証メッセージにどれほど注意を払っているかに注目してください。 もちろん、フロントエンドは好きなだけ変更できますが、フォームはそのままで非常によく構築されています。

7. 継続的インテグレーションのサポート

JHipsterは、最もよく使用される継続的インテグレーションツールの構成ファイルを自動的に作成できます。 次のコマンドを実行するだけです。

yo jhipster:ci-cd

そして質問に答えてください。 ここで、構成ファイルを作成するCIツールを選択できます。これは、Docker、Sonarを使用するか、ビルドプロセスの一部としてHerokuにデプロイするかを選択できます。

ci-cd コマンドは、次のCIツールの構成ファイルを作成できます。

  • Jenkins：ファイルはJenkinsFileです
  • Travis CI：ファイルは.travis.ymlです
  • サークルCI：ファイルはcircle.ymlです
  • GitLab：ファイルは.gitlab-ci.ymlです

8. 結論

この記事では、JHipsterの機能について少し説明しました。 もちろん、ここで説明できる以上のことがたくさんあるので、公式JHipsterWebサイトを必ず調べてください。

そしていつものように、コードはGitHubで利用できます。