Getting started

To get started using the JS Buy SDK, you'll need to create a private app, get a storefront access token, and make your products and collections available for your custom storefront. Once products and collections are available, you can retrieve them using their respective IDs.

Generate an access token for the JavaScript Buy SDK

To generate your JavaScript Buy SDK access token, see private authentication.

When creating a private app, make sure to enable Allow this app to access your storefront data using the Storefront API. The access token is generated when you save the private app, and you include this access token with any calls made from the JS Buy SDK to Shopify.

Make your products and collections visible

You'll need to make products and collections available to your private app to access them from JS Buy SDK.

To make products available:

  1. From Shopify admin navigate to Products.
  2. Click the product's name to open its details.
  3. In Sales channels click Manage.
  4. Make sure to check the box next to the name of your private app.

To make collections available:

  1. From Shopify admin navigate to Products>Collections.
  2. Click the collection's name to open its details.
  3. In Sales channels click Manage.
  4. Make sure to check the box next to the name of your private app.

If you have many products and/or collections, you can use bulk actions to make them available in one step.

Retrieve product IDs

You can retrieve products and collections by ID.

To retrieve a product_id:

  1. From your Shopify admin, click Products.

  2. Click the name of a product.

  3. Inspect the page URL.

    The product_id will be at the end of the URL. For example, in the URL https://your-store.myshopify.com/admin/products/12345, the product_id is 12345.

  4. Use the ProductListing API to retrieve the product:

shopClient.fetchProduct('12345').then(product => {
  // the product with an ID of '12345'
});

To retrieve a collection_id:

    1. From your Shopify admin, click Products>Collections.
  1. Click the name of a collection.

    The collection_id will be at the end of the URL. For example, if your collection's URL is https://your-store.myshopify.com/admin/collections/21281217, the collection_id is 21281217.

  2. Use the ProductListing API to fetch all products in that collection:

shopClient.fetchQueryProducts({collection_id: 21281217}).then(function(products) {
  // an array of the products in the collection
});

Next steps

If you've completed the tasks above, then you're ready to start building with the JS Buy SDK:

View the JS Buy SDK on GitHub