No LWC? No Problem. React Now Runs on Salesforce | Salesforce Multi-Framework Explained

Build native Salesforce apps in React with GraphQL, Apex, and built-in platform security — no LWC required.

⚡ SalesforceBolt — Source Code

batra-kapil / salesforcebolt-lwc — multiframework-casemanager

Full Case Manager app built with React on Salesforce Multi-Framework

Until now, building on Salesforce meant choosing LWC or Aura. You got the platform features but had to leave your existing React ecosystem behind. Salesforce Multi-Framework changes that. Announced at TDX 2026 and now in open beta, it lets you build native Salesforce apps in React — with GraphQL, Apex, authentication, and governance all included out of the box.

What Is Salesforce Multi-Framework?

Salesforce Multi-Framework is a framework-agnostic runtime on the Agentforce 360 Platform that lets developers build native Salesforce apps using React and other frontend frameworks — with authentication, security, and governance built in. It is now in open beta for scratch orgs and sandboxes that use English as the default language. React is supported today; additional frameworks are coming.

The core promise: bring your hooks, your component libraries, your existing toolchain, and build on Salesforce without having to choose between your framework and your platform.

Why Did Salesforce Build This?

The official blog is honest about the problem. Until now, building on Salesforce meant adopting LWC or Aura. You got base components, declarative tools, Lightning Data Service, and UI API access — but you gave up the broader open-source ecosystem. Open-source libraries had to be managed as static resources, and there was no way to use your own framework without losing platform features.

Salesforce Multi-Framework eliminates that trade-off. Starting with this beta, you can bring your existing React apps, dashboards, and micro-frontends and run them natively on the Agentforce 360 Platform. Multi-Framework apps can retrieve and mutate records with GraphQL, invoke Apex methods, and use UI APIs to get user information and context, all with the same security and governance model you already know.

Prerequisites

Before you start you need:

• Salesforce CLI installed and up to date
• Node.js v18 or later
• A scratch org or sandbox — Multi-Framework is not available in production orgs during beta
• English as the default language in your org

Generating Your First React App

The easiest way to get started is the new React App tile in the Agentforce Vibes welcome screen. Click the React App tile and select Internal App to generate a new employee-facing React app.

Alternatively, use the SF CLI directly:

Bash — SF CLI

# Generate a new React app from the Salesforce template
sf template generate ui-bundle

The generated project lives in force-app/main/default/uiBundles and comes preconfigured with:

• Salesforce Multi-Framework SDK — for accessing Salesforce APIs and services
• Vite — for bundling
• Vitest — for testing
• shadcn/ui — for components
• Tailwind CSS — for styling

Running Locally and Deploying

Bash — local dev + deploy

# Run locally — opens at localhost:5173
npm run dev

# When ready — build and push to your org
npm run build
sf project deploy start

After deploying, search for your app name in the App Launcher to see it live. You now have a React app hosted on Salesforce with built-in authentication, security, and governance.

Accessing Salesforce Data from React

The @salesforce/sdk-data package provides hooks for querying records via GraphQL and invoking Apex methods. The createDataSDK() utility handles authentication automatically — no token management required in your application code.

CaseList.jsx — querying Salesforce data from React

import { createDataSDK } from '@salesforce/sdk-data';

const sdk = createDataSDK();

export function CaseList() {
    const [cases, setCases] = useState([]);

    useEffect(() => {
        // Query Cases using GraphQL — auth handled automatically by SDK
        sdk.graphql({
            query: `
                query GetCases {
                    uiapi {
                        query {
                            Case {
                                edges {
                                    node {
                                        Id
                                        Subject { value }
                                        Status  { value }
                                        Priority { value }
                                    }
                                }
                            }
                        }
                    }
                }
            `
        }).then(result => {
            const edges = result.data.uiapi.query.Case.edges;
            setCases(edges.map(e => e.node));
        });
    }, []);

    return (
        <ul>
            {cases.map(c => (
                <li key={c.Id}>{c.Subject.value} — {c.Status.value}</li>
            ))}
        </ul>
    );
}

You can also call Apex methods directly using the SDK's fetch() method for server-side logic that goes beyond simple CRUD.

React vs. LWC — When to Use Which

Multi-Framework doesn't replace LWC — it runs alongside it. Your existing Lightning Web Components continue to work.

Capability	React (Multi-Framework)	Lightning Web Components
Data access	GraphQL, Apex, UI API via SDK	@wire decorators, Lightning Data Service with caching
Component library	Bring your own (shadcn, MUI, Ant Design)	80+ Salesforce Base Components out of the box
Styling	Tailwind, CSS Modules, CSS-in-JS	Salesforce Lightning Design System (SLDS)
App Builder support	Not yet available — planned for GA	Full drag-and-drop with property panels
Cross-platform reuse	Share across Salesforce and non-Salesforce apps	Salesforce only
Ecosystem tooling	npm, Vite, Vitest, React DevTools	Salesforce CLI, LWC Local Dev

💡 The simple rule from the official docsChoose React when you need to share components across Salesforce and non-Salesforce surfaces, or use the broader React ecosystem. Choose LWC when you want declarative data access with @wire and Lightning Data Service, the base component library, and the drag-and-drop Lightning App Builder.

Agentforce Vibes + Multi-Framework

Agentforce Vibes 2.0 generates Multi-Framework React apps from natural language prompts. Vibes tools include:

• React and Apex templates to scaffold apps without starting from scratch
• Salesforce MCP server for retrieving and deploying metadata directly from the IDE
• Live Preview to see your React app update in real time as you build
• Einstein Trust Layer to ensure prompts and responses are never used to train future models

Beta Limitations — What You Can't Do Yet

⚠️ Beta constraints — read before you startAccording to the official blog, the following limitations apply during beta:

• Beta apps cannot be deployed to production orgs
• Lightning App Builder drag-and-drop placement is not yet supported for React components
• Some platform APIs are not available in the beta runtime
• Micro-frontend support (embedding React in Lightning pages) is in closed pilot only
• Only available in orgs with English as the default language

Key Takeaways

🚀 Salesforce Multi-Framework — Quick Reference

• Build native Salesforce apps in React — no LWC required
• Now in open beta for scratch orgs and sandboxes (English default language only)
• Generate a React app: sf template generate ui-bundle
• Access Salesforce data via @salesforce/sdk-data — GraphQL, Apex, UI API
• createDataSDK() handles authentication automatically — no token management
• Comes pre-wired with Vite, Vitest, shadcn/ui, and Tailwind CSS
• Does not replace LWC — both run alongside each other
• Beta apps cannot be deployed to production — scratch orgs and sandboxes only
• App Builder drag-and-drop support coming at GA

This is one of the most developer-requested features in Salesforce's history. If you've been holding off on Salesforce development because you didn't want to learn LWC from scratch, Multi-Framework is the on-ramp you've been waiting for. And if you're already an LWC developer — your skills aren't going anywhere. Both frameworks are first-class citizens on the platform now.

📄 Sources: Build with React, Run on Salesforce: Introducing Salesforce Multi-Framework — Salesforce Developer Blog  |  Build a React App with Salesforce Multi-Framework (Beta) — Official Docs  |  SalesforceBolt GitHub — multiframework-casemanager

Watch Complete Video on YouTube

 If you have any question please leave a comment below.

If you would like to add something to this post please leave a comment below.

Share this blog with your friends if you find it helpful somehow !