> ## Documentation Index
> Fetch the complete documentation index at: https://launchdarkly.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# React SDK reference

export const SdkGrid = ({items = [], arrow = true, cols = 3}) => {
  return <Columns className="sdk_grid" cols={cols}>
      {items.map(({title, href, icon, iconLight, iconDark, iconPrefix = ""}) => <div key={`${href}::${title}`} className="contents">
          <Card title={title} href={href} icon={`/assets/icons/${iconPrefix}light/${iconLight || icon}.svg`} horizontal className="block dark:hidden" arrow={arrow} />
          <Card title={title} href={href} icon={`/assets/icons/${iconPrefix}dark/${iconDark || icon}.svg`} horizontal className="hidden dark:block" arrow={arrow} />
        </div>)}
    </Columns>;
};

<View title="Developer" />

<View title="Federal docs" />

<View title="EU docs" />

LaunchDarkly has two distinct React SDKs. The React Web SDK works on web-based React codebases and with React Server Components. The React Native SDK is built to work on native apps for Android and iOS.

To learn more, read the [React Web SDK reference](/docs/sdk/client-side/react/react-web), the [React Native SDK reference](/docs/sdk/client-side/react/react-native), and the documentation on [React Server Component support](/docs/sdk/client-side/react/react-web#react-server-component-support).

Additionally, we have a plugin for Gatsby-based websites. The Gatsby plugin wraps the React Web SDK and makes it easier to use in a Gatsby site.

### React SDKs

<SdkGrid
  items={[
{ title: "React Web", href: "/sdk/client-side/react/react-web", icon: "react" },
{ title: "React Native", href: "/sdk/client-side/react/react-native", icon: "react" },
{ title: "Gatsby", href: "/sdk/client-side/react/gatsby", icon: "gatsby" },
]}
/>