---
title: Utilities
api_version: 2026-04
source_url:
  html: 'https://shopify.dev/docs/api/hydrogen-react/latest/utilities'
  md: 'https://shopify.dev/docs/api/hydrogen-react/latest/utilities.md'
api_name: hydrogen-react
---

# Utilities

[create​Storefront​Client](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/createstorefrontclient)

[The createStorefrontClient() function creates helpers that enable you to quickly query the Shopify Storefront API.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/createstorefrontclient)

[decode​Encoded​Variant](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/decodeencodedvariant)

[Decodes an encoded option value string into an array of option value combinations.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/decodeencodedvariant)

[flatten​Connection](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/flattenconnection)

[The flattenConnection utility transforms a connection object from the Storefront API (for example, Product-related connections) into a flat array of nodes.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/flattenconnection)

[get​Adjacent​And​First​Available​Variants](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getadjacentandfirstavailablevariants)

[Finds all the variants provided by adjacentVariants, options.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getadjacentandfirstavailablevariants)

[get​Client​Browser​Parameters](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getclientbrowserparameters)

[Gathers client browser values commonly used for analytics](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getclientbrowserparameters)

[get​Product​Options](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getproductoptions)

[Returns a product options array with its relevant information about the variant.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getproductoptions)

[get​Shopify​Cookies](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getshopifycookies)

[Parses cookie string and returns Shopify cookies.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/getshopifycookies)

[get​Tracking​Values](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/gettrackingvalues)

[Retrieves user session tracking values for analytics and marketing from the browser environment.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/gettrackingvalues)

[is​Option​Value​Combination​In​Encoded​Variant](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/isoptionvaluecombinationinencodedvariant)

[Determines whether an option value combination is present in an encoded option value string.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/isoptionvaluecombinationinencodedvariant)

[map​Selected​Product​Option​To​Object](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/mapselectedproductoptiontoobject)

[Converts the product selected option into an Object\<key, value> format for building URL query params](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/mapselectedproductoptiontoobject)

[parse​Gid](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/parsegid)

[Parses Shopify Global ID (GID) and returns the resource type and ID.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/parsegid)

[parse​Metafield](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/parsemetafield)

[A function that uses metafield.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/parsemetafield)

[send​Shopify​Analytics](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/sendshopifyanalytics)

[Sends analytics to Shopify.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/sendshopifyanalytics)

[Storefront API Types](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefront-api-types)

[If you are using TypeScript, pre-generated TypeScript types are available that match the Storefront API's GraphQL schema.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefront-api-types)

[Storefront Schema](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefront-schema)

[Hydrogen React ships with a pre-generated GraphQL schema for the Storefront API, which can integrate with your IDE and other GraphQL tooling (such as a GraphQL config file) to provide autocompletion and validation for your Storefront API GraphQL queries.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefront-schema)

[storefront​Api​Custom​Scalars](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefrontapicustomscalars)

[Meant to be used with GraphQL CodeGen to type the Storefront API's custom scalars correctly when using TypeScript.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/storefrontapicustomscalars)

[use​Selected​Option​In​Url​Param](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/useselectedoptioninurlparam)

[Sets the url params to the selected option.](https://shopify.dev/docs/api/hydrogen-react/latest/utilities/useselectedoptioninurlparam)

***