自分の部品を持ってきてください
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
コンテンツ作成者やデザイナーは、コンポーネントビルダー を使ってSitecoreAIユーザーインターフェース内でコンポーネントを作成、調整、デザイン、スタイリングします。開発者は自社のReactやウェブコンポーネントを追加することで、シンプルな「自分でコードを持ち込む(BYOC)」ワークフローで、あなたのSitecoreAIウェブサイト全体でレンダリングや利用可能にすることができます。Reactコードやウェブコンポーネントを作成した後、それを登録またはスキャフォールディングでSitecoreAIに取り込みます。
BYOCにはいくつかの利点があります:
- BYOCコンポーネントはネイティブコンポーネントのようにインターフェースに表示されますが、Sitecoreはソースや定義にアクセスできず、コンポーネントコードは非公開のままです。コンポーネントビルダーでテーマを適用し、ドラッグ&ドロップのページインターフェースでページに追加できます。これは他のコンポーネントと同じようにです。
- ローカルで開発する際にブラウザでコードを熱くリロードし、ページ上で変更点を即座に確認できるようにし、Pagesや最終的なウェブサイトでコンポーネントのレンダリングも含まれます。
- 自分のツールや依存関係、技術を使ってコンポーネントを柔軟に作成できる柔軟性。
- SitecoreAIの各サイトでコンポーネントを再利用できます。
- 設定ユーザーインターフェースは 、パスしたJSONスキーマに基づいて自動的に生成されるため、コンテンツ作成者はPages WYSIWYGエディター内でコンポーネントを設定できます。
SitecoreAIへのBYOCコンポーネントの追加
BYOCコンポーネントをSitecoreAIに追加するには、以下の2つの方法のいずれかがあります。
レンダリングモード
BYOCは、お客様のニーズに合わせたさまざまな開発および構成オプションをサポートしています。
クライアントサイド
クライアント側で登録されたコンポーネントをレンダリングすることも可能です。例えば、スマート入力フィールドの追加、動的なコンテンツの表示、その他のインタラクティブな機能などです。クライアントコンポーネントをJSSアプリのbyoc/index.client.tsファイルに追加します。この例に従うことができます。
ハイブリッド
可能な限りこれが推奨される方法です。このアプローチでは、サーバー側にクライアント側のコンポーネントをプリレンダリングし、初期レンダリング時間とページの検索エンジン最適化を向上させます。ハイブリッド方式はコンポーネントのサーバー側インデックスをサポートし、アプリが完全に初期化される前でも静的デザインを読み込めます。ハイブリッドコンポーネントを使う場合は、この例のようにindex.hybrid.ts内にインポートすることを忘れないでください。
REST API
REST APIを使ってSitecoreコンポーネント機能をソリューションに統合したい場合は、Swaggerのドキュメントに従うことができます。