The description is a short step-by-step guide for setting up a headless Shopify eCommerce store. It will show you how to set up a headless Shopify eCommerce store.
Step one is choosing the right technology for your business’s storefront.
Start by building your user interface.
Take your development team’s skills and expertise into consideration
Consider each specific technology to meet your storefront’s design and technical requirements.
Consider the static site generators like Gatsby.js or Next.js or headless CMS like Prismic or Contentful
Step two is getting you familiar with the Shopify Storefront API
The great place to start with is Shopify’s GraphQL guide. Then, follow it up with the “Getting started…” page of the Storefront API.
Step three is generating an access token for the storefront.
Go to your Shopify admin for generating an access token. Click on the section “Apps” and click “Manage private apps.” Next, click “Create new private app” and add an app name and email. Then in the Storefront API section, select the checkbox for “Allow this app to access your storefront data using the Storefront API,” select the data types you want to give exposure to your app, and click “Save.”
After clicking “Save”, you will find a generated storefront access token at the bottom of the Storefront API page.
Step four is building and customizing your storefront
Get you self-familiarized with the custom storefront example applications. These will provide the best guidance for customizing your storefront.
After this, install the JavaScript Buy SDK using NPM or Yarn for a React.js application. Later, you simply have to import the client object into your app code. Once it is initialized, you can request to make a Storefront API. The most useful resources for checking which data is available according to your business requirements are JavaScript Buy SDK docs and official API documentation on Shopify’s website.