アプリの構造

AEM Mobile プロジェクトには、ページ、JavaScript と CSS のクライアントライブラリ、再利用可能な AEM コンポーネント、コンテンツ同期設定、PhoneGap アプリシェルコンテンツなど、多様なコンテンツタイプセットが含まれます。新しいAEM Mobileアプリをスターターキットに基づいて作成すると、様々なタイプのコンテンツをアドビの推奨構造に入手し、携帯性と保守性を長期にわたって容易にするのに便利です。

ページコンテンツ

アプリケーションのページが AEM Mobile コンソールで認識されるには、そのすべてのページが /content/mobileapps の下に配置されている必要があります。

AEM の慣例により、アプリの最初のページは、アプリのデフォルト言語（Geometrixx とスターターキットのどちらの場合でも「en」）として機能するいずれかの子ページへのリダイレクトである必要があります。トップレベルのロケールページは通常、Over-the-air Content Syncアップデートのインストールをサポートするために必要な初期化を行う基礎となる「splash-page」コンポーネント(/libs/mobileapps/components/splash-page?lang=ja)から継承します(contentInitコードは/etc/clientlibs/mobile/content-sync/js/contentInit.jsにあります)。

テンプレートおよびコンポーネント

アプリのテンプレートおよびコンポーネントのコードは、/apps/<ブランド名>/<アプリ名> にあります。規則に従って、テンプレートとコンポーネントコードは/apps/<brand name>/<app name>に配置する必要があります。 このパターンは、AEM のサイトでの作業経験がある開発者にはよく知られています。このパターンに従うのは通常、パブリッシュインスタンスでは /apps/ への匿名アクセスがデフォルトでロックされるからです。その結果、生の JSP コードが潜在的な攻撃者に対して非表示になります。

アプリ固有のテンプレートは、テンプレート自体のallowedPathsプロパティノードを使用し、その値を'/content/mobileapps(/.&ast;?' に設定することです。テンプレートを単一のアプリでのみ使用する場合には、さらに具体的な値に設定することもできます。また、allowedParentsプロパティとallowedChildrenプロパティを使用して、新しいページの作成場所に基づいて、作成者がどのテンプレートを使用できるかをきめ細かく制御することもできます。

新しいアプリページコンポーネントを最初から作成する場合は、sling:resourceSuperTypeプロパティを'mobileapps/components/angular/ng-page'に設定することをお勧めします。 これにより、シングルページアプリとして作成したりレンダリングしたりできるようにページが設定され、コンポーネントで .jsp ファイルを変更する必要がある場合にはそのファイルをオーバーレイできます。ng-page には UI フレームワークが一切含まれないので、開発者は通常最終的には（少なくとも）「template.jsp」（/libs/mobileapps/components/angular/ng-page/template.jsp からオーバーレイされたもの）をオーバーレイすることになります。

AngularJSを利用したい場合、承認可能なページコンポーネントは、同じ方法でオーバーレイおよびカスタマイズできる、同等のsling:resourceSuperTypeコンポーネントを/libs/mobileapps/components/angular/ng-componentに配置します。

JavaScript およびCSS Clientlibs

クライアントライブラリに関して、開発者は、リポジトリ内のどこに配置するかについてのオプションがいくつかあります。次のパターンはガイダンスとして示したものであり、固定の要件ではありません。

clientside コードが単独で機能でき、アプリケーションの特定のコンポーネントに関連していない（つまり、他のアプリケーションで再利用できる）場合には、/etc/clientlibs/<ブランド名>/<ライブラリ名> に格納することをお勧めします。一方、clientlib が単一のアプリに固有のものである場合には、アプリのデザインノードの子としてネストできます（/etc/designs/phonegap/<ブランド名>/<アプリ名>/clientlibs）。この clientlib のカテゴリは、他のライブラリで使用しないでください。必要に応じて他のライブラリを埋め込むために使用してください。このパターンに従うと、開発者はクライアントライブラリをアプリに追加するたびに新規コンテンツ同期設定を追加する必要がなくなり、単にアプリの design clientlib の embeds プロパティを更新するだけでよくなります。例えば、/content/phonegap/geometrixx-outdoors/en/jcr:content/page-app/app-config/clientlibs-allのGeometrixxclientlibs-allコンテンツ同期設定ノードを見てみましょう。

クライアント側コードが特定のコンポーネントに密接に結合されている場合は、そのコードを /apps/ 内のコンポーネントの場所の下にネストされたクライアントライブラリに配置し、そのカテゴリをアプリの「design」clientlib に埋め込みます。

PhoneGap 設定

各AEM Mobileアプリには、PhoneGap コマンドラインインターフェイスとPhoneGap buildで使用される設定ファイルをホストするディレクトリが含まれ、Webコンテンツを実行可能なアプリケーションに変換します。 例えば、Geometrixx のサンプルでは、このディレクトリ（/content/phonegap/geometrixx-outdoors/shell/jcr:content/pge-app/app-content）はシェルの一部として存在しますが、このようなデザイン上の決定となったのは、無線で更新できないコンテンツ（デバイス API やアプリ自体の設定を処理するプラグインなど）のみが含まれているからです。

このディレクトリには、プラグインのインストール、プラットフォーム固有の場所へのリソースファイルの配置、ビルドの一環として実行する必要のある他のアクションに使用できるCordovaフックも多数あります。 注意：ビルドの一部として各プラグインをダウンロードする代わりに、Kitchen Sinkアプリとinclude plugin source codeのパターンに従って、残りのアプリプロジェクトを実行できます。

次の手順

アプリの構造について詳しくは、アプリコンソールを使用したアプリの作成と編集を参照してください。