Cloud ManagerとGitHub Desktopを使用したプロジェクトのデプロイメント - AEM as a Cloud Service

Cloud Managerは、Adobe Experience Manager as a Cloud Serviceの重要なパートです。今回の投稿では、GitHub Desktop経由で外部リポジトリーにあるプロジェクトを Adobe Experience Manager as a Cloud Serviceにデプロイする方法をご紹介します。

イメージ画像(パイプライン)

Cloud Managerは、Adobe Experience Manager as a Cloud Serviceの重要なパートです。Cloud Managerを使用すると、アプリケーションの構築、テスト、およびAuthorとPublishの両方のサービスへのデプロイが可能になります。

Cloud ManagerのユーザーインターフェイスはExperience Managerアプリケーションのクラウド環境とCI/CDパイプラインへの容易なアクセスと管理を提供します。ユーザーインターフェイスを使用してCI/CDパイプラインを設定し、キックオフすることができます。また、コードスキャンを実行することで、高品質なアプリケーションのみが本番環境に移行することを保証します。

この投稿では、Gitのコマンドラインを使わずに済むGitHubデスクトップを使って、外部のGitにあるプロジェクトをAEM as a Cloud Serviceにデプロイする方法をご紹介します。プロセスの概要は以下の通りです。

Cloud Managerを使用したAEMプロジェクトのデプロイメント概要

Cloud Managerを使用したAEMプロジェクトのデプロイメント概要図

前提条件

GitHub DesktopをWindows環境で利用されている場合は、シンボリックが使える様にしてください。WKNDのコードにはシンボリックリンクが含まれています。

AdobeのGitからWKNDサイトをクローンする

  1. GitHub Desktopを起動します。
  2. トップメニューから「File」→「Clone repository」を選択します。
  3. GitHub Desktopで、「URL」タブを選択します。
  4. 次の GitHub URL を追加します。これは、Adobe optimized for Cloud Service のデモサイトです。
    https://github.com/adobe/aem-guides-wknd

画面:GitHub Desktop - WKNDサイトのクローン

WKNDサイトのクローン

  1. 「Clone」ボタンをクリックします。
  2. 「Fetch Origin」をクリックします。

画面:GitHub Desktop - Fetch origin操作

GitHub Desktop - Fetch origin操作

  1. トップメニューから「Repository」→「Show in Explorer(Macの場合はShow in Finder)」を選択します。

画面:GitHub Desktop - 「Repository」→「Show in Explorer」

GitHub Desktop - 「Repository」→「Show in Explorer」

  1. ローカルディレクトリーが表示されます。OSの設定を変更して隠しファイルの表示を有効にします。
  2. この時、OSの初期設定では隠しファイルが非表示になっているので、エクスプローラーの設定を変更して隠しファイルの表示を有効にします(Macの場合は「command」+「shift」+「.」 で表示できます。)。

画面:Windowsエクスプローラにおける隠しファイルの表示設定

Windowsエクスプローラー - 隠しファイルの表示設定

  1. Explorer(Macの場合はFinder)のウィンドウを開いたままにして、次の手順に進みます。

Cloud ManagerのGitリポジトリーをクローンする

  1. Cloud Managerを開き、対象のプログラムに移動します。

画面:Cloud Manager - プログラムの概要

Cloud Manager - プログラムの概要

  1. 「リポジトリー情報へアクセス」ボタンをクリックします。

画面:Cloud Manager - 「リポジトリー情報へアクセス」

Cloud Manager - 「リポジトリー情報へアクセス」

  1. 「パスワードの生成」をクリックして、新しいパスワードを作成します。
  2. Gitのユーザー名、パスワード、URLをコピーした後、GitHub Desktopに戻ります。

画面:Cloud Manager - リポジトリーの認証情報へのアクセス

Cloud Manager - リポジトリー認証情報へのアクセス

  1. トップメニューから「File」→「Clone repository」を選択します。
  2. 「URL」タブを選択します。
  3. 手順4でコピーしたCloud Manager GitのURLを追加します。
  4. 「Clone」をクリックします。
  5. 認証情報を求められるので手順4でコピーしたユーザーIDとパスワードを入力して、「Save and retry」をクリックします。
  6. 「Fetch Origin」をクリックします。
  7. トップメニューから「Repository」→「Show in Explorer(Macの場合はShow in Finder)」を選択します。
  8. aem-guides-wkndのフォルダーに移動し、.gitフォルダーを除くすべてのコンテンツをコピーします。
  9. コンテンツをCloud ManagerのGit Repositoryフォルダーに貼り付けます。
  10. GitHub Desktopに戻り、「Summary」欄にコミットメッセージを入力したら、「Commit to master」をクリックします。

画面:GitHub Desktop - コミット操作

GitHub Desktop - コミット操作

  1. 「Push origin」をクリックします。

画面:GitHub Desktop -  Push oorigin操作

GitHub Desktop - Push origin操作

プロジェクトのデプロイ

  1. Cloud Managerを開き、対象のプログラムに移動します。
  2. 「パイプライン」→「実稼動以外」の欄に移動し、「追加」をクリックします。
  3. 必要な情報を入力して「保存」をクリックします。

画面:Cloud Manager - パイプラインの設定

Cloud Manager – パイプラインの設定

  1. 作成したパイプライン上にマウスカーソルを移動し、表示された「ビルド」をクリックします。

画面:Cloud Manager - パイプラインのビルド操作

Cloud Manager – パイプラインのビルド操作

  1. 実行画面が表示されるので、再度、「ビルド」をクリックします。

画面:Cloud Manager -  パイプラインのビルド操作

Cloud Manager – パイプラインのビルド操作

  1. デプロイに成功すると「完了」メッセージが表示されます。必要に応じてログをダウンロードして検証します。

画面:Cloud Manager - パイプラインの完了

Cloud Manager – パイプラインの完了

  1. Adobe Experience ManagerのAuthorにアクセスして、デプロイが成功していることを確認します。

画面:WKNDサイトの編集画面

WKNDサイトの編集画面

※Windows環境において、GitHubからのダウンロードしたシンボリックリンクがテキストファイルに変換されてしまい、デプロイに失敗することがあります。この場合は、お使いの環境でシンボリックリンクが有効になっていることをご確認ください。

画面:Windowsエクスプローラーで、シンボリックリンクが有効になっている状態

Windowsエクスプローラーで、シンボリックリンクが有効になっている状態

まとめ

いかがだったでしょうか? Adobe Experience Manager as a Cloud Serviceの最新のリリースでは、Cloud Manager上にリポジトリーを追加できる様になりました。こちらも合わせてご活用ください。

Cloud Managerのリポジトリー管理画面

Cloud Managerのリポジトリー管理画面

この記事は2021年1月に公開された、Deploying a Project to AEM as a Cloud Service Using Cloud Manager and GitHub Desktopを抄訳したものです。