SDKs

Choose between the Enad React SDK and TypeScript SDK, then route to setup, guides, and package-specific docs.

Choose the SDK by runtime first, then open the reference that matches the exact detail you need. React SDK is for browser storefront UI. TypeScript SDK is for trusted server, worker, job, integration, and script code.

Start by runtime

  • Browser React storefronts: start with React SDK latest. Use it for providers, storefront UI, component selection, theme handoff, and app-owned runtime boundaries.
  • Server routes, workers, jobs, scripts, or integrations: start with TypeScript SDK latest. Use it for trusted runtime code that needs Enad clients, generated types, or package-level Search helpers.
  • Exact REST operation details: start with APIs, then open Reference or the owning OpenAPI spec.
  • Search fields, facets, filters, operations, or fragments: start with Search latest, then open Search GraphQL reference.
  • Theme playground handoff: start with Theme from playground, then confirm component behavior in Components.

React SDK

Start here when the work renders shopper-facing UI or wires React runtime boundaries.

  • React SDK latest - landing page, route chooser, and package boundaries.
  • Setup - install, stylesheet import, EnadProvider, optional theme provider, and runtime context placement.
  • First app - smallest useful app shell before choosing deeper storefront flows.
  • Theme from playground and Theming - playground hashes, component sets, provider nesting, and theme boundaries.
  • Storefront page guide - compose storefront layout and content sections.
  • Product listing and search - build PLP/search UI while keeping exact Search fields in the Search GraphQL reference.
  • Product detail page - compose PDP media, pricing, variants, and purchase-adjacent UI.
  • Components - discover component families and component-specific guidance.

TypeScript SDK

Start here when the work belongs on a trusted backend, worker, job, integration, or script.

  • TypeScript SDK latest - backend SDK landing page, package routing, and runtime boundaries.
  • APIs - choose REST families and references when endpoint contracts matter.
  • Search latest - Search guidance, context, and GraphQL reference routing.

Find exact details

  • Package exports, component props, hooks, helper signatures, slots, and runtime behavior: use the package and component reference.
  • REST method, path, request body, response schema, auth behavior, and status codes: use Reference, OpenAPI specs, and endpoint pages.
  • Search fields, inputs, enums, fragments, and operation documents: use Search GraphQL reference, schema, and documents.
  • Theme tokens, provider nesting, and playground handoff: use the React SDK theming guides and live playground routes.

Build safely

  1. Pick the runtime first: browser React, trusted TypeScript, REST contract, Search contract, or theme handoff.
  2. Read the SDK guide for placement and integration judgment.
  3. Open package, component, Search, or API reference before copying exact code or fields.
  4. Keep app-owned routing, cookies, locale, auth/session policy, analytics, and checkout ownership outside SDK components unless the guide says otherwise.
  5. Copy implementation details from the matching reference, not from route-selection prose.

SDKs

# SDKs Choose the SDK by runtime first, then open the reference that matches the exact detail you need. React SDK is for browser storefront UI. TypeScript SDK is for trusted server, worker, job, integration, and script code. ## Start by runtime - Browser React storefronts: start with [React SDK latest](/react-sdk/latest). Use it for providers, storefront UI, component selection, theme handoff, and app-owned runtime boundaries. - Server routes, workers, jobs, scripts, or integrations: start with [TypeScript SDK latest](/ts-sdk/latest). Use it for trusted runtime code that needs Enad clients, generated types, or package-level Search helpers. - Exact REST operation details: start with [APIs](/apis), then open [Reference](/reference) or the owning [OpenAPI spec](/reference/openapi). - Search fields, facets, filters, operations, or fragments: start with [Search latest](/search/latest), then open [Search GraphQL reference](/reference/search-graphql/latest). - Theme playground handoff: start with [Theme from playground](/react-sdk/latest/guides/theme-from-playground), then confirm component behavior in [Components](/react-sdk/latest/components). ## React SDK Start here when the work renders shopper-facing UI or wires React runtime boundaries. - [React SDK latest](/react-sdk/latest) - landing page, route chooser, and package boundaries. - [Setup](/react-sdk/latest/setup) - install, stylesheet import, `EnadProvider`, optional theme provider, and runtime context placement. - [First app](/react-sdk/latest/guides/first-app) - smallest useful app shell before choosing deeper storefront flows. - [Theme from playground](/react-sdk/latest/guides/theme-from-playground) and [Theming](/react-sdk/latest/theming) - playground hashes, component sets, provider nesting, and theme boundaries. - [Storefront page guide](/react-sdk/latest/guides/storefront-page) - compose storefront layout and content sections. - [Product listing and search](/react-sdk/latest/guides/product-listing-search) - build PLP/search UI while keeping exact Search fields in the Search GraphQL reference. - [Product detail page](/react-sdk/latest/guides/product-detail-page) - compose PDP media, pricing, variants, and purchase-adjacent UI. - [Components](/react-sdk/latest/components) - discover component families and component-specific guidance. ## TypeScript SDK Start here when the work belongs on a trusted backend, worker, job, integration, or script. - [TypeScript SDK latest](/ts-sdk/latest) - backend SDK landing page, package routing, and runtime boundaries. - [APIs](/apis) - choose REST families and references when endpoint contracts matter. - [Search latest](/search/latest) - Search guidance, context, and GraphQL reference routing. ## Find exact details - Package exports, component props, hooks, helper signatures, slots, and runtime behavior: use the package and component reference. - REST method, path, request body, response schema, auth behavior, and status codes: use [Reference](/reference), [OpenAPI specs](/reference/openapi), and endpoint pages. - Search fields, inputs, enums, fragments, and operation documents: use [Search GraphQL reference](/reference/search-graphql/latest), schema, and documents. - Theme tokens, provider nesting, and playground handoff: use the React SDK theming guides and live playground routes. ## Build safely 1. Pick the runtime first: browser React, trusted TypeScript, REST contract, Search contract, or theme handoff. 2. Read the SDK guide for placement and integration judgment. 3. Open package, component, Search, or API reference before copying exact code or fields. 4. Keep app-owned routing, cookies, locale, auth/session policy, analytics, and checkout ownership outside SDK components unless the guide says otherwise. 5. Copy implementation details from the matching reference, not from route-selection prose.