GraphQLの概要
これは、GraphQLとAdobe Commerceのシリーズの第 1 部です。 GraphQLは、クライアントサイドの強力なアプリケーションがバックエンドとどのように通信するかという点で、すぐに業界標準になりました。 ヘッドレス実装の分野でプラットフォームの機能が拡張され続けているため、Adobe Commerce開発者にとってますます関連性の高いトピックとなっています。
GraphQLを初めて使用する場合は、この節で、基本的な概念と使用方法を説明します。
このシリーズのGraphQLに関する関連ビデオとチュートリアル
GraphQLとは
GraphQLは、一意の API クエリ言語と、そのクエリ言語に応じてデータを提供するランタイムの仕様です。
REST などの従来の web API は、異なるシステム間でデータをやり取りするのに適していましたが、Progressive Web Applicationのような最新のアプリとリンクのエクスペリエンスではピーク時のパフォーマンスよりも少ない結果でした。 このようなアプリケーションでは、同じ アプリケーションのフロントエンドとバックエンドのレイヤーは、web API を使用して通信します。 REST などのスキームの制限付きアプローチでは、多くの種類のデータを迅速に取得する必要があるこのコンテキストでは、多くの場合、適切な柔軟性が提供されません。
GraphQLを使用すると、クライアントは必要なデータを 正確に 表現できます。 複数のデータタイプを取得するために複数のネットワークリクエストを必要とする代わりに、1 つのリクエストで様々なタイプをクエリできます。 また、要求されたタイプとフィールドのみを(クエリを直感的に反映した形式で)含めることで、応答はリーン状態に保たれます。
GraphQLの仕様を実装するランタイムは、任意の言語で構築できます。 Adobe Commerceと Magento Open Source は、
graphql-php PHP の実装とその上に独自のレイヤーを構築します。
GraphQL クライアントの使用
コードサンプルとチュートリアルをテストするには、GUI GraphQL クライアントが必要です。 次のいくつかのオプションがあります。
- Altair は、GraphQLのために特別に構築された優れた機能を備えたクライアントです。 Adobeでは、ウォークスルー動画で Altair を使用します。
- デスクトップアプリケーションをインストールしない場合は、で実行される Altair 拡張機能もあります
Chrome、Firefox、または Edge ブラウザー。 - GraphiQL は、GraphQLの基盤からGraphQL IDE を実装したものです。 これはインストール可能なツールではなく、インターフェイスを自分で構築するために使用できるパッケージです。
- Postman に精通している方は、専用のGraphQL クライアントほど完全には機能しませんが、GraphQL クエリを適度にサポートしています。
GraphQL クライアントで、Adobe Commerceまたは Magento Open Source インスタンス上の URL パス /graphql
にリクエストを送信する必要があります。 テストに既存のインスタンスを使用する場合は、Venia テーマのデモ(PWA Studioの実装例)を使用できます。https://venia.magento.com/graphql