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

# Get your App ID and integrate

> Find your App ID in Phantom Portal and begin integrating with your preferred SDK

Your app is now published in Phantom. Get your App ID and begin integrating with your preferred SDK. Your App ID is a unique identifier that's automatically generated for your app. The App ID is used when integrating with Phantom’s client-side SDKs. It's safe to include in client-side code.

## Find your App ID

In Phantom Portal, expand your app in the left navigation, then select **Set Up**.

Your App ID appears at the top of the **Set Up** page. Select the copy button to add it to your clipboard.

## Choose your SDK

The **Set Up** page provides tailored installation instructions and code examples for each SDK. Select the tab that matches your application platform:

* **React**: For React web applications
* **React Native**: For iOS and Android mobile apps
* **Browser**: For vanilla JavaScript browser applications

## Install the SDK

Copy the installation command for your preferred package manager:

```bash theme={null}
# Using npm
npm install @phantom/react-sdk

# Using yarn
yarn add @phantom/react-sdk

# Using pnpm
pnpm add @phantom/react-sdk
```

## Start building with Phantom

After completing Phantom Portal setup, select the Phantom Connect SDK that fits your app environment.

<CardGroup cols={3}>
  <Card title="React SDK" icon="react" href="/sdks/react-sdk/">
    React apps with user authentication
  </Card>

  <Card title="Browser SDK" icon="globe" href="/sdks/browser-sdk/">
    JavaScript browser apps
  </Card>

  <Card title="React Native SDK" icon="mobile" href="/sdks/react-native-sdk/">
    iOS and Android apps
  </Card>
</CardGroup>

### Example usage

Use your App ID when initializing the SDK:

```typescript theme={null}
import { PhantomProvider } from '@phantom/sdk';

const phantom = new PhantomProvider({
  appId: 'your-app-id-here', // Paste your App ID
  // ... other configuration
});
```

### Other examples

Explore our official example apps to kickstart your integration.

<CardGroup cols={3}>
  <Card title="React SDK demo" icon="react" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples/react-sdk-demo-app">
    Full-featured React example
  </Card>

  <Card title="Browser SDK demo" icon="globe" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples/browser-sdk-demo-app">
    JavaScript browser example
  </Card>

  <Card title="React Native demo" icon="mobile" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples/react-native-sdk-demo-app">
    Mobile example with Expo
  </Card>

  <Card title="Next.js example" icon="rocket" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples/with-nextjs">
    Next.js integration
  </Card>

  <Card title="Wagmi example" icon="code" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples/with-wagmi">
    Wagmi integration
  </Card>

  <Card title="All examples" icon="github" href="https://github.com/phantom/phantom-connect-sdk/tree/main/examples">
    View all on GitHub
  </Card>
</CardGroup>

## Resources

<CardGroup cols={2}>
  <Card title="SDK overview" icon="books" href="/wallet-sdks-overview">
    Compare Phantom Connect SDKs
  </Card>

  <Card title="Phantom Connect" icon="plug" href="/phantom-connect">
    Learn how users authenticate
  </Card>
</CardGroup>

## Need help?

Contact [Phantom developer support](https://docs.google.com/forms/d/e/1FAIpQLSeHWETFkEJbHQCF-lnl1AHmVQPuyfC0HbnxjDjIp6VYV1sBZQ/viewform).