コンテンツレンダリング
日本語翻訳に関する免責事項
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
!注このドキュメントの改善にご協力くださいフレームワークに依存しないドキュメントは現在開発中です。コンテンツ改善の提案があれば、このページの下部で フィードバック を共有してください。
Sitecoreの開発における重要なタスクの一つは、SitecoreAIページビルダー で作成されたコンテンツを取得し、フロントエンドアプリケーションでレンダリングすることです。具体的な実装の詳細はフレームワークによって異なりますが、SitecoreAIのコンテンツレンダリングは同じ主要な手順に従います。
- SitecoreAIからレイアウトとコンテンツを取得 - Sitecoreでは、レイアウトがページ上のどのコンポーネントをどこに表示するかを定義します。コンテンツ作成者がページビルダーでページを作成する際、レイアウト内でコンポーネントを配置しています。このステップでは、GraphQLクエリを使ってSitecoreAIページのJSON形式のレイアウトとコンテンツを取得します。JSONデータでは、コンポーネントがページ構造を表し、コンテンツはコンポーネントフィールド内に保存されます。
- コンポーネント名をコードにマッピング する - 取得したJSONのコンポーネント名(例えば "RichText")を、自分のアプリ内のコード( RichText コンポーネント実装など)にマッピングします。各コンポーネント実装は自分のフィールドを読み取り、フィールドタイプに従ってレンダリングします。これにより、アプリがユーザーインターフェースで正しいコンポーネントをレンダリングできるようになります。
- コンポーネントを再帰的にレンダリングする - アプリが他のコンポーネントの中にネストされたコンポーネントを表示できることを確認してください。
始めましょう
コンテンツレンダリングを始めるには:
- プレビュー GraphQL APIとデリバリー GraphQL APIについて学び、アクセスを得ましょう。これらはレイアウトやコンテンツを取得するために使うAPIです。
- GraphQLスキーマ、GraphQLのエントリポイント、そしてそれらがさまざまなSitecoreの概念とどのように関連しているかを確認しましょう。
- レイアウトの質問と回答の構造を見直しましょう。
- フィールドタイプをレビューし、これはコンポーネント実装を構築する際に不可欠です。
- アプリのウォークスルー でRender SitecoreAIのコンテンツを 完成させてください。そこでは、レイアウトデータをプログラム的にSitecoreに問い合わせ、レスポンス内の再帰JSONを解析し、ページのコンポーネントをレンダリングします。
この記事を改善するための提案がある場合は、 お知らせください!