Learning how to interact with the Storefront API is an important part of accelerating the development process behind building custom storefronts. Shopify provides tools and learning kits to improve your developer experience.

## Requirements

- [Familiarize yourself](/docs/storefronts/headless/building-with-the-storefront-api) with the Storefront API.

- Complete the Storefront API [Getting started](/docs/storefronts/headless/building-with-the-storefront-api/getting-started) guide.

## GraphiQL explorer

Start exploring Shopify's Storefront GraphQL API on a demo shop.

<div class="resource-card-grid">
  <div>
  <a class="resource-card" href="/docs/storefronts/headless/building-with-the-storefront-api/api-exploration/graphiql-storefront-api" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/graphql"
     data-alt-src="/assets/resource-cards/graphql-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Storefront API GraphiQL explorer
    </h3>
    <p class="resource-card__description">Use the interactive GraphiQL explorer for the Storefront API.</p>
  </a>
</div>

</div>


## Storefront API Learning Kit

Download queries that demonstrate how to use Shopify's GraphQL Storefront API.

<div class="resource-card-grid">
  <div>
  <a class="resource-card" href="https://github.com/Shopify/storefront-api-learning-kit" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/growth"
     data-alt-src="/assets/resource-cards/growth-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Storefront API learning kit
    </h3>
    <p class="resource-card__description">Download a package of a complete set of sample GraphQL queries to the Storefront API</p>
  </a>
</div>

</div>


## Next steps

- Learn about querying [products and collections](/docs/custom-storefronts/building-with-the-storefront-api/products-collections/index.md) in your custom storefront.