Sitecoreデータを使用したJSSアプリでのページ構成
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
JSSアプリケーションは、Sitecoreサイト用に作成されたページをレンダリングします。Sitecoreのすべてのページではレイアウトが使用されます。Sitecoreのレイアウト エンジンは、複数のコンポーネントをホストできる名前付きプレースホルダーを定義することで機能します。JSSは、Sitecoreの 動的プレースホルダ ー機能を活用し、Sitecoreの作成者主導のコンポーネントベースのレイアウト モデルをフロントエンド アプリケーションに拡張します。
Sitecoreでは、レイアウトはページのプレースホルダーとレンダリング階層を表します。編集可能にするには、Sitecoreのページで少なくとも1つのルート (ページ レベル) プレースホルダーを定義する必要があります。コンテンツ作成者は、WYSIWYG Sitecoreエディターを使用してレイアウト データを定義し、レイアウト データをXMLとしてデータベースに保存します。
JSSアプリケーションでは、レイアウトはすべてのページで使用される最上位のコンポーネントです。Sitecoreレイアウトと同様に、JSSアプリケーションのLayoutコンポーネントは、ページのコンポーネント階層のレンダリングを担当する プレースホルダ コンポーネント(いわゆるルートプレースホルダ)を少なくとも1つ定義します。
各ルート/ページは従来のJavaScriptアプリケーションで既知のコンポーネントをホストしますが、コンポーネント階層はSitecoreレイアウト データによって動的に定義されるため、JSSアプリケーションには認識されません。
レイアウトを動的に駆動すると、JSSアプリはコンテンツ作成者が定義したレイアウトをサポートし、データドリブンなパーソナライゼーションと多変量テストをサポートできますが、コンテンツ作成者がSitecoreで特定のページ用に構成するレイアウトがJSSアプリケーションで一致する構造を持つ必要もあります。JSSアプリケーションでは、Sitecoreページで使用されるプレースホルダと同じプレースホルダをLayoutコンポーネントで指定するだけでなく、ページで使用されるSitecoreレンダリングに一致するコンポーネントも定義する必要があります。
Sitecoreからレイアウト データをレンダリングするために、JSSアプリはSitecoreデータベースからのレイアウト データを直接使用しません。JSSアプリがページ/ルートにアクセスすると、カスタム ルート処理とデータ フェッチ 機能を使用して、SitecoreエンドポイントからJSON形式のデータを取得します。フェッチされたレイアウト データに基づいて、コンテンツ作成者がSitecoreエディターでレンダリングを組み立てた方法に基づいて、ページの コンポーネント 階層をレンダリングできます。
コンポーネントをSitecoreレンダリングやJSSコンポーネントとして定義するのは冗長に思えるかもしれません。ただし、このアプローチにより、Sitecoreのレイアウト データはフロントエンドの実装に依存しない状態を維持できます。同時に、開発者はJSON形式のレイアウト データを使用して、JSONデータを消費できる任意のテクノロジでフロントエンド アプリケーションを実装できます。したがって、1つのSitecoreインスタンスで、さまざまなテクノロジーで開発された複数のアプリケーションをホストでき、異なるテクノロジーを使用しても、オーサリング エクスペリエンスはアプリケーション間で一貫性を保ちます。