評価拡張機能のチュートリアル
このチュートリアルでは、Adobe Commerce as a Cloud Service および AI を利用した開発ツールを使用して、Adobe App Builder 用の製品評価拡張機能を構築する手順を説明します。
開始する前に、 前提条件 を完了してください。
前提条件を確認
次の前提条件がインストールされていることを確認します。
# Check Node.js version (should be 22.x.x)
node --version
# Check npm version (should be 9.0.0 or higher)
npm --version
# Check Git installation
git --version
# Check Bash shell installation
bash --version
上記のコマンドのいずれかで期待される結果が返されない場合は、 前提条件 を参照してガイダンスを確認してください。
拡張機能の開発
この節では、AI を利用した開発ツールを使用して、Adobe Commerce as a Cloud Serviceの評価拡張機能を開発する手順について説明します。
-
Cursor/Settings/Cursor Settings/Tools & MCP に移動し、
commerce-extensibilityツールセットがエラーなく有効になっていることを確認します。 エラーが表示された場合は、ツールセットのオン/オフを切り替えます。 {width="600" modal="regular"}
note note NOTE AI 支援による開発ツールを使用する場合、エージェントによって生成されるコードと応答に自然なバリエーションが生じることを期待してください。
コードで問題が発生した場合は、いつでもエージェントにデバッグの支援を求めることができます。 -
カーソルのコンテキストにドキュメントを追加した場合は、そのドキュメントを無効にします。
- カーソル/設定/カーソル設定/インデックスとドキュメント に移動し、一覧表示されているドキュメントを削除します。
{width="600" modal="regular"}
-
製品評価拡張機能のコードを生成します:
- Cursor chat ウィンドウで、Agent モードを選択します。
- 次のプロンプトを入力します。
code language-shell-session Implement an Adobe Commerce as a Cloud Service extension to handle Product Ratings. Implement a REST API to handle GET ratings requests. GET requests will have to support the following query parameters: sku -> product SKUnote note NOTE エージェントがドキュメントの検索を要求した場合は、許可します。 -
エージェントが最適なコードを生成できるように、エージェントの質問に正確に答えます。
{width="600" modal="regular"}
{width="600" modal="regular"}
-
次のテキスト例を使用して、エージェントの質問に回答し、ランダム化された評価データを設定します。
code language-shell-session Yes, this headless extension is for Adobe Commerce as a Cloud Service storefront, but we do not need any authentication for the GET API because guest users should be able to use it on the storefront. This extension is called directly from the storefront, no async invocation, such as events or webhooks, is required. Start with just the GET API for now, we will implement other CRUD operations at a later time. We do not need a DB or storage mechanism right now, just return random ratings data between 1 and 5 and a ratings count between 1 and 1000. The API should only return the average rating for the product and the total number of ratings. We do not need to add tests right now.エージェントは、実装の信頼できるソースとして機能する
requirements.mdファイルを作成します。 {width="600" modal="regular"}
-
requirements.mdファイルを確認し、計画を検証します。すべてが正しいと思われる場合は、エージェントに フェーズ 2 - アーキテクチャ計画 に移行するよう指示します。
-
アーキテクチャ計画を確認します。
-
コードの生成を続行するようにエージェントに指示します。
エージェントは、必要なコードを生成し、次の手順で詳細な概要を提供します。
{width="600" modal="regular"}
{width="600" modal="regular"}
{width="600" modal="regular"}
ローカルテスト
-
コードをローカルでテストできるようにエージェントに依頼します。
code language-shell-session Test the ratings API locally on a dev server using cURL. -
エージェントの指示に従い、API がローカルで動作していることを確認します。
{width="600" modal="regular"}
{width="600" modal="regular"}
拡張機能のデプロイ
-
生成されたコードを検証した後、次のプロンプトを使用して拡張機能をデプロイします。
code language-shell-session Deploy the ratings API.エージェントは、デプロイ前に、デプロイメント前の準備状況の評価を実行します。
{width="600" modal="regular"}
-
評価結果に自信がある場合は、エージェントにデプロイメントを続行するように指示します。
エージェントは、MCP ツールキットを使用して、検証、ビルド、およびデプロイを自動的に行います。
{width="600" modal="regular"}
デプロイメント後
API は、ストアフロントに統合する前にテストできます。 担当者は、新しいアクションの場所とテスト戦略を指定する必要があります。
また、ターミナルで cURL を使用して、手動で API をテストすることもできます。
curl -s "https://<your-site>.adobeioruntime.net/api/v1/web/ratings/ratings?sku=TEST-SKU-123"
Edge Delivery Servicesとの統合
Ratings API を Adobe Commerce を利用した Edge Delivery Services ストアフロントに統合するには、エージェントに依頼して、ratings API の要件を含むサービス契約を作成してください。
Create a service contract for the ratings api that I can pass on to the storefront agent. Name it RATINGS_API_CONTRACT.md
次の手順
これで、評価 API を契約したので、評価拡張機能のストアフロント(フロントエンド)部分の作成を開始できます。