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

# Quickstart

> Start building with Offline Protocol in minutes.

### Step 1: Set up your local environment

Clone the following GitHub repository to get started:

```bash theme={null}
git clone https://github.com/Offline-Protocol/id-sdk-react-test-app.git
cd id-sdk-react-test-app
```

This repository contains the SDK and example code to help you integrate quickly.

### Step 2: Run as a Next.js app

1. Install dependencies:

   ```bash theme={null}
   npm install
   # or
   yarn install
   ```

2. Start the development server:

   ```bash theme={null}
   npm run dev
   # or
   yarn dev
   ```

3. Open [http://localhost:3000](http://localhost:3000) to see your app live.

### Step 3: Configure your project

Create a project
To interact with Offline Protocol, you’ll need an active project on your dev dashboard

1. Visit the [SDK Setup page](/docs/getting-started/sdk-setup).
2. Create a new project.
3. Add allowed origins to the domain allowlist.
   4\. Use the projectId to initialize the SDK Provider.

Wrap your app with the OfflineProvider and pass the project ID:

```tsx theme={null}
import { OfflineProvider } from "@offline-protocol/id-react";

const OFFLINE_PROJECT_ID = "<your_project_id>"

export default function App({ Component, pageProps }) {
  return (
    <OfflineProvider projectId={OFFLINE_PROJECT_ID}>
      <Component {...pageProps} />
    </OfflineProvider>
  );
}
```

### Step 4: Go live

Deploy your Next.js app"
You can deploy your app to any hosting service (e.g. [Netlify](https://netlify.com)).

1. Push your code to GitHub.
2. Connect your repo to the hosting provider.
3. Deploy and your app is live!

## Next steps

Now that you have Offline Protocol running, check out these features:

<CardGroup cols={2}>
  <Card title="Use components" icon="cube" href="/docs/id-sdk/core-modules">
    Start adding Offline Protocol React components to your app.
  </Card>

  <Card title="API documentation" icon="code" href="/docs/api-reference/introduction">
    Explore endpoints and usage examples in the API reference.
  </Card>
</CardGroup>

<Note>
  **Need help?** Check out the [full documentation](/docs/) or join the [community
  forum](https://discord.gg/offline-protocol).
</Note>