1. JSS for Next.js開発を始める

チュートリアル : JSS初期化子を使用したJSS Next.jsアプリケーションの作成

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

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

フロントエンド/JavaScript開発者であれば、JSSアプリ初期化子を使用してJSS Next.jsアプリをすばやくスキャフォールディングできます。

メモ

このアプローチを使用する場合は、Sitecoreインスタンスに接続するために追加の手順を実行する必要があります。

新しいJSSアプリケーションがライセンスされたSitecore XPバージョンと互換性があることを確認するには 、Sitecore互換性テーブルを参照してください。

このアプローチは、コードファースト開発ワークフローを使用するSitecore開発者や、SitecoreをインストールせずにJSS開発者エクスペリエンスを評価したいSitecore開発者にお勧めします。

このチュートリアルでは、次の方法について説明します。

  • JSS Next.jsアプリケーションの作成

  • アプリをSitecoreと統合する

  • JSS Next.jsアプリケーションの実行

JSS Next.jsアプリケーションの作成

Next.jsテンプレートに基づいてJSSアプリケーションを作成するには、次のようにします。

  1. ターミナルで、ディレクトリの名前とnextjsテンプレートを指定して、次のコマンドを実行します。

        npx create-sitecore-jss@ver20 nextjs
    手記

    コードファースト ワークフローに最適化されたアプリケーションを作成するには、プロンプトが表示されたら、nextjs-styleguideアドオンの追加を選択します。アドオンを使用すると、jss startコマンドまたはnpm run startコマンドを使用してアプリケーションを切断モードで実行するために必要なdataフォルダーとsitecore/definitionsフォルダーが作成されます。

    切断して作業するためのアプリケーションを作成するには、プロンプトが表示されたら、データ取得方法としてRESTを選択します。それ以外の場合は、アプリケーションを初期化した後、Sitecoreから切断して実行しているときにRESTサービスを使用するようにアプリケーションを変更します。

  2. プロンプトに従って、アプリケーションのオプションを指定します。

このコマンドは、最新バージョンのJSSのJSS Next.jsアプリケーションを作成し、必要なパッケージをインストールします。

先端

以前のバージョンのJSSとSitecoreのアプリケーションを作成することもできます。

アプリをSitecoreと統合する

Sitecoreへのコード ファーストのアーティファクトとコンテンツのデプロイ、WYSIWYG編集、GraphQLによるデータの取得、本番環境でのJSSの使用などのアクティビティには、Sitecoreインスタンスが必要です。

コード ファーストのアーティファクトとコンテンツをSitecoreにデプロイするには、JSSアプリをSitecoreに接続し 、高度なSitecoreエディターに接続します。

必要に応じて、コードファーストからSitecoreファーストの開発ワークフローに切り替えることもできます。

JSS Next.jsアプリケーションの実行

アプリケーションを実行するには:

  1. ターミナルで、アプリケーションディレクトリに移動します。例えば：

    cd my-first-jss-app

  2. ターミナルで、次のコマンドを実行します。

    jss start

    または、アプリがSitecoreに接続されている場合:

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