JSS Next.jsアプリでGraphQLを使う

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

JSS Next.jsアプリでGraphQLを使いたい場合は、エンドポイントへのクエリに対応できるすべてのインフラを整えたままアプリケーションを初期化Sitecore GraphQLできます。

!重要アプリが切断モードで動作している場合はGraphQLを使用できません。代わりに、以下のことを確認してください:

データ取得にJSS GraphQL APIを使うNext.jsアプリケーションを作成するには、JSS CLIコマンドjss createに--fetchWithパラメータを付与できます。

例えば、Next.jsのサンプルアプリケーションを基にコードファーストのJSSアプリを作成する場合、次のコマンドを実行します:

jss create my-next-app nextjs --fetchWith GraphQL --prerender SSG|SSR

Sitecore Next.jsのContainersテンプレートでプロジェクトを作成する際に--fetchWithパラメータを提供するには、以下のコマンドをご利用ください:

dotnet new sitecore.nextjs.gettingstarted -n MyProject --JSSCreateParams "--fetchWith GraphQL --prerender SSG|SSR"

Next.js JSSアプリをデフォルトパラメータで作った場合、サンプルJSS Next.jsアプリを使ってGraphQLに切り替えることができます。

GraphQL型とTypeScriptの静的データ型型付けを用いて、リッチなIDEアシストで型保護コードを書くには、GraphQLスキーマを内省することができます。

JSS GraphQL APIでSitecoreデータを取得するだけでなく、接続GraphQLを使った通常のJavaScriptアプリケーション開発時と同様に、エンドポイントGraphQLクエリも可能です。接続GraphQLを使って コンポーネントレベルでGraphQLクエリを実行することもできます。

この記事を改善するための提案がある場合は、 お知らせください!