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

# Integration Guide

> Complete integration guide for Create React App, Vite, and other React applications.

<Note>
  Make sure you've completed the [setup guide](/authentication/moongate-sdk/setup) before proceeding.
</Note>

## 📦 Installation

First, install the Moongate Adapter in your React project:

**Using npm:**

```bash theme={null}
npm install @moongate/sdk
```

**Using yarn:**

```bash theme={null}
yarn add @moongate/sdk
```

## 🚀 Quick Setup (1 minute)

Simply wrap your app with MoonGateProvider and add the connect button:

```tsx src/App.tsx theme={null}
import React from 'react';
import { MoonGateProvider, MoongateConnectButton } from '@moongate/sdk';
import '@moongate/sdk/styles.css';

function App() {
  return (
    <MoonGateProvider apiKey="your-api-key-here">
      <MoongateConnectButton />
    </MoonGateProvider>
  );
}

export default App;
```

<Frame caption="Complete integration in just 3 lines of code" />

## 🎉 You're Done!

Your React application now has full Solana wallet integration! The Moongate Adapter automatically handles:

* ✅ Wallet detection and connection
* ✅ Transaction signing
* ✅ Network switching
* ✅ Error handling
* ✅ Mobile responsiveness

## 📖 Next Steps

<CardGroup cols={2}>
  <Card title="API Reference" icon="book" href="/authentication/moongate-sdk/api-reference">
    Explore all available hooks and components
  </Card>

  <Card title="Troubleshooting" icon="wrench" href="/authentication/moongate-sdk/troubleshooting">
    Common integration issues
  </Card>
</CardGroup>

## 🆘 Need Help?

* 📧 Email: [amen@moongate.one](mailto:amen@moongate.one) or [praneet@moongate.one](mailto:praneet@moongate.one)
* 💬 Telegram: [@and\_its\_praneet](https://t.me/and_its_praneet)
* 🐛 Issues: Message us on [web.moongate.one](https://web.moongate.one)