アプリのテンプレートとコンポーネント

メモ

単一ページアプリケーションフレームワークを基にしたクライアント側レンダリング(React など)が必要なプロジェクトでは、SPA エディターを使用することをお勧めします。詳細情報

テンプレートはページを作成するための雛形として使用され、選択した範囲内で使用できるコンポーネントを定義します。テンプレートは、そこから作成されるページと同じ構造を持つノードの階層ですが、実際のコンテンツは含みません。

テンプレートごとに、使用可能なコンポーネントが提示されます。

  • テンプレートはコンポーネントで構成されています。
  • コンポーネントによって使用され、アクセスが許可されるウィジェットを使用して、コンテンツがレンダリングされます。
メモ

CRXDE Liteを使用したAEMアプリケーションの開発方法については、CRXDE Liteを使用した開発を参照してください。

テンプレートはページの基礎です。

ページを作成するには、テンプレート(ノードツリーの /apps/<myapp>/templates/<mytemplate>)をサイトツリーの対応する位置にコピーする必要があります。「Web サイト」タブを使用してページを作成する場合も、この処理が行われます。

このコピー処理により、ページには、初期コンテンツ(通常はトップレベルコンテンツのみ)と sling:resourceType プロパティ、ページのレンダリングに使用するページコンポーネントのパス(子ノード jcr:content に含まれるすべてのもの)ができます。

テンプレートの構造

以下の 2 つの側面について考慮する必要があります。

  • テンプレート自体の構造
  • テンプレート使用時に作成されるコンテンツの構造

テンプレートは cq:Template タイプのノードの下に作成されます。

様々なプロパティを設定できます。具体例は以下のとおりです。

  • jcr:title - テンプレートのタイトル。ページ作成時にダイアログに表示されます。
  • jcr:description - テンプレートの説明。ページ作成時にダイアログに表示されます。

このノードには、jcr:content(cq:PageContent)​ノードが含まれます。jcr:content ノードは、生成されるページのコンテンツノードの基礎として使用されます。このノードは、sling:resourceType を使用して、新しいページの実際のコンテンツのレンダリングに使用されるコンポーネントを参照します。

メモ

AEM におけるテンプレートとコンポーネントの基礎については、以下のリソースを参照してください。

テンプレートとコンポーネントの基本的な理解ができたら、次のリソースを参照してください。

その他のリソース

モバイルアプリに関するその他のトピックについては、以下のリンクを参照してください。

このページ

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now