Loading…
Leveraging Shopify’s API to Build the Latest Marketplace Kit
2023-10-18
- Source
- Shopify
- Published
- Added to Yomu
Summary
Marketplace Kit version 2 provides boilerplate app code and documentation for third-party developers integrating with Shopify, implementing selected commerce features, and launching marketplaces across channels. The team moved away from using the Shopify CLI-generated Node app because CLI changes could affect their code and documentation, while its dependencies limited control over development practices. The new kit separates a full-stack merchant-facing admin app from a buyer-facing client app, using Express, React, NextJS, GraphQL, Apollo Client, and Apollo Server; open-source versions are publicly available. Its examples demonstrate JWT authentication through App Bridge and Shopify’s Node API, serving REST and GraphQL together with Express, and choosing REST for a product-listing count where a query offered no advantage.
Context
The earlier Marketplace Kit used the Node app generated by the Shopify CLI, which meant Shopify CLI changes could affect the kit’s code and documentation. The team also had limited control over best practices and had to use the CLI app’s dependencies.
Approach / What changed
The team decoupled the kit from the Shopify CLI and split the sample into a full-stack admin app and a buyer-facing client app. It selected widely used dependencies including Express and NextJS, used App Bridge and Shopify’s Node API for JWT session authentication, integrated Apollo Server with Express for REST and GraphQL, and added custom clients for Shopify API requests.
Takeaways
- App Bridge’s authenticatedFetch adds an Authorization header containing an on-demand JWT session token and an X-Requested-With header; Shopify’s Node API decodes the token and loads session data containing the store access token.
- Using apollo-server-express lets the application serve REST routes and GraphQL through Express, enabling Node middleware for rate-limiting, security, and authentication. The trade-off is slightly more boilerplate, with no noticeable performance difference stated.
- The admin app uses REST for retrieving the product listings count because an HTTP GET supplied the required information without a dedicated query; GraphQL remains the generally encouraged option.