Get Record Data in Your React Apps with Data SDK and GraphQL (Beta)

Data SDK provides a type-safe and consistent way to access data in React web apps. It handles complex implementation details like authentication and CSRF validation, while your code focuses on the GraphQL queries and mutations to access and update record data.

Where: This change applies to Lightning Experience in sandbox and scratch orgs only.

Note
Note Data SDK is a pilot or beta service that is subject to the Beta Services Terms at Agreements - Salesforce.com or a written Unified Pilot Agreement if executed by Customer, and applicable terms in the Product Terms Directory. Use of this pilot or beta service is at the Customer's sole discretion.

When: This feature is available starting April 15, 2026.

How: Agentforce Vibes generates Data SDK and GraphQL code when your prompt contains one of these intents.

  • Fetch data from Salesforce
  • Query or update a record
  • Add a new GraphQL operation (query or mutation)
  • Add data access for a Salesforce object (Account, Contact, Opportunity, etc.)

To use Data SDK, your React code imports the @salesforce/sdk-data module and sends a POST request to the Salesforce GraphQL endpoint by using dataSdk.graphql?.().

import { createDataSDK } from "@salesforce/sdk-data";
const dataSdk = await createDataSDK();
// GraphQL — use optional chaining
const responseGQL = await dataSdk.graphql?.<MyQueryType>(query, variables);

For use cases that aren’t covered by GraphQL, use dataSdk.fetch?() with Salesforce REST endpoints. Use optional chaining to account for environments that don't support fetch().


// HTTP fetch — use optional chaining
// Example: Connect REST API
const responseRest = await dataSdk.fetch?("/services/data/v67.0/chatter/users/me");
// Example: UI API
const responseUI = await dataSdk.fetch?("/services/data/v67.0/ui-api/records/{recordId}");
const userData = await response.json();

Consider these usage guidelines.

  • Use the Data SDK for your Salesforce API calls. Don’t use direct fetch() or axios calls.
  • Use UI API via dataSdk.fetch?() for data access that calls /services/data/v67.0/ui-api/* or another Salesforce REST endpoint, such as an Apex controller that's exposed via Apex REST.
  • Use GraphQL with dataSdk.fetch?() if GET request is required, such as when your query and variables are small enough to fit in URL constraints. Or use a GraphQL GET request if you have a dependency on a roundtrip fetch of a CSRF token.
  • Use Apex REST when you want custom logic that GraphQL doesn't support.

You can’t use other @salesforce scoped modules, Lightning base components, lightning/* modules, and @wire service calls in a React app.