The GraphQL Storefront API

Plan: Composable Developer

Lesson 3 of 27 · 15 min

GraphQL is the industry standard for efficiently querying data because of its capability to fetch multiple data points in one API call. This is what sets GraphQL apart from REST APIs where multiple API calls can slow down your site.

BigCommerce’s GraphQL Storefront API makes it possible to efficiently query storefront data to support high performing headless storefronts.

Benefits of GraphQL

Fetching data from external systems is often a major bottleneck for headless storefronts, slowing down page load times and impacting the customer experience. To avoid this, high-performance APIs are essential for quickly delivering the data needed to render dynamic storefronts. BigCommerce’s GraphQL Storefront API is designed with this in mind, enabling faster data retrieval that keeps headless experiences both responsive and scalable. The list below expands on why GraphQL is the best choice:

Get Many Resources in a Single Request - GraphQL queries access not just the properties of one resource but also smoothly follow references between them. While completing a task with typical REST APIs often requires making calls to multiple endpoints, GraphQL APIs get all the data your app needs in a single request. Apps using GraphQL can be quick even on slow mobile network connections.
Get Just What You Need - Don’t over-fetch data and waste bandwidth. Instead, specify only the exact fields you need.
Type System - GraphQL APIs are organized in terms of types and fields, not endpoints. Access the full capabilities of your data from a single endpoint. GraphQL uses types to ensure apps only ask for what’s possible and provide clear and helpful errors.
Shopper-Ready Data - Get succinct and customer contextual data without worrying about how it was calculated or the business logic behind it.

What Can You Do with GraphQL Storefront API?

With the GraphQL Storefront API, it is possible to:

Fetch catalog data such as product options, variations, custom fields, categories, brands, metafields, and more
Fetch customer data such as name, email address, and attributes (if logged in)
Query and manage a cart and checkout, including specifying complex product options for items being added to the cart
Get real-time storefront data from the perspective of a customer and channel, such as customer-specific pricing in the shopper’s currency and product availability
Authenticate customers

GraphQL Storefront API allows you to get shopper data from the perspective of a customer in a channel - that means their pricing, product availability, etc. If you’ve hidden a product on the basis of channel or customer group, that is automatically reflected in the API and you can get all that information in one API call.

The goal of the content and labs in this course is to teach you the best methods for building highly dynamic headless storefronts. BigCommerce’s GraphQL Storefront API is used throughout the course to demonstrate how efficient and impactful it can be for your headless build.

Handling Payments with REST

The GraphQL Storefront API offers nearly all the functionality you’ll need for powering your storefronts, but a key area for which you’ll need a BigCommerce REST API is for the handling of payment data.

If building your own fully custom checkout, GraphQL can be used for all checkout data, but you will have to use the Payments API to process payments. See Payments API for more information.

Resources