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アプリケーション内で一致する構造を持つことも求められます。 LayoutコンポーネントでSitecoreページで使われるのと同じプレースホルダーを指定するだけでなく、JSSアプリケーションはページで使用されているSitecoreレンダリングに合致するコンポーネントも定義しなければなりません。
Sitecoreからレイアウトデータをレンダリングする場合、JSSアプリはSitecoreデータベースのレイアウトデータを直接使用しません。JSSアプリがページやルートにアクセスすると、カスタムルート 処理やデータ取得 機能を使ってSitecoreのエンドポイントからJSON形式のデータを取得します。取得したレイアウトデータに基づき、コンテンツオーサーがSitecoreエディターでレンダリングを組み立てた方法に基づいてページの コンポーネント 階層をレンダリングできます。
コンポーネントをSitecoreレンダリングとJSSコンポーネントと定義するのは冗長に思えるかもしれません。しかし、このアプローチによりSitecoreレイアウトデータはフロントエンド実装に依存しない状態を保つことができます。同時に、開発者はJSON形式のレイアウトデータを使って、JSONデータを消費可能なあらゆる技術でフロントエンドアプリケーションを実装できます。したがって、単一のSitecoreインスタンスで異なる技術で開発された複数のアプリケーションをホストし、異なる技術を使っていても作成体験はアプリケーション間で一貫性を保つことができます。