👋

XM Cloud を試す(書きかけです)

2022/12/19に公開約2,400字

XM Cloud 側の操作

プロジェクトを作成

環境を作成

Siteを作成

ローカルの操作

.NET SDK 6 をインストール

.NET SDK 6 が必要。2022/11/30 時点では .NET SDK 7 はサポートしていない。
Windows 10 以上の場合、以下コマンドでインストール

winget install Microsoft.DotNet.SDK.6

GitHub からソースを clone

Sitecore CLI をインストール

dotnet tool restore
dotnet sitecore cloud login

Edge access token を取得

https://doc.sitecore.com/xmc/en/developers/xm-cloud/generate-an-edge-access-token.html

dotnet sitecore cloud project list
dotnet sitecore cloud environment list --project-id <project-id>
.\New-EdgeToken.ps1 -EnvironmentId <environment-id>

動作確認

https://edge.sitecorecloud.io/api/graphql/ide
先の実行結果を HTTP Header に入力し、以下クエリーを実行

query {
  layout(language: "en", routePath: "/", site: "<your-site-name>") {
    item {
      rendered
    }
  }
  site {
    siteInfoCollection {
      name
      routes(first: 10, language: "en") {
        results {
          routePath
          route {
            id
          }
        }
      }
    }
  }
}

実行例

Sitecore CLI と XM Cloud の環境を接続

dotnet sitecore cloud environment connect --environment-id <environment-id>

ローカル環境の Next.js アプリを XM Cloud と接続して起動する

https://doc.sitecore.com/xmc/en/developers/xm-cloud/walkthrough--connecting-the-next-js-application-directly-to-the-experience-edge-endpoint.html

src/sxastarter.env.env.local にコピーする。

.env.local の次の項目を編集

src/sxastarter ディレクトリで次のコマンドを実行する

npm install
npm run start:connected

http://localhost:3000/ で確認。

Vercel と接続して公開

https://doc.sitecore.com/xmc/en/developers/xm-cloud/walkthrough--deploying-your-front-end-application-to-vercel.html

Discussion

ログインするとコメントできます