# Vercel Edge Config

If your Next.js app is deployed on Vercel, you can use Edge Config to initialize the Hypertune SDK on the server with near-zero latency.

### 1. Install the integration

1. Go to the [Hypertune page in the Vercel Integrations marketplace](https://vercel.com/integrations/hypertune) and click "Add Integration".
2. Select your Vercel team and project.
3. Continue and log into Hypertune.
4. Connect your Hypertune project to a new or existing Edge Config store. Copy the displayed environment variables for later. They contain your Hypertune Token, Edge Config Connection String and Edge Config Item Key.
5. Go to your Vercel dashboard and select the project you want to use the Hypertune integration with. Go to Settings > Environment Variables and add the following:
   1. `NEXT_PUBLIC_HYPERTUNE_TOKEN`, set to your Hypertune Token
   2. `EDGE_CONFIG`, set to your Edge Config Connection String
   3. `EDGE_CONFIG_HYPERTUNE_ITEM_KEY`, set to your Edge Config Item Key

### 2. Use the integration

Pull the environment variables to your `.env.development.local` file by running:

```
vercel env pull .env.development.local
```

Install the `@vercel/edge-config` package:

{% tabs %}
{% tab title="npm" %}

```bash
npm install @vercel/edge-config
```

{% endtab %}

{% tab title="yarn" %}

```bash
yarn add @vercel/edge-config
```

{% endtab %}

{% tab title="pnpm" %}

```bash
pnpm add @vercel/edge-config
```

{% endtab %}
{% endtabs %}

Finally, update your `getHypertune` function to create an Edge Config client and pass it along with your Edge Config Item Key when creating the Hypertune source:

{% code title="lib/getHypertune.ts" %}

```typescript
import 'server-only'
import { createClient } from '@vercel/edge-config'
import { VercelEdgeConfigInitDataProvider } from 'hypertune'
import { unstable_noStore as noStore } from 'next/cache'
import { createSource } from '@/generated/hypertune'

const hypertuneSource = createSource({
  token: process.env.NEXT_PUBLIC_HYPERTUNE_TOKEN!,
  initDataProvider:
    process.env.EDGE_CONFIG &&
    process.env.EDGE_CONFIG_HYPERTUNE_ITEM_KEY
      ? new VercelEdgeConfigInitDataProvider({
          edgeConfigClient: createClient(
            process.env.EDGE_CONFIG
          ),
          itemKey: process.env.EDGE_CONFIG_HYPERTUNE_ITEM_KEY,
        })
      : undefined,
})

export default async function getHypertune() {
  noStore()
  await hypertuneSource.initIfNeeded() // Check for flag updates

  return hypertuneSource.root({
    args: {
      context: {
        environment: process.env.NODE_ENV,
        user: {
          id: 'e23cc9a8-0287-40aa-8500-6802df91e56a',
          name: 'Example User',
          email: 'user@example.com',
        },
      },
    },
  })
}
```

{% endcode %}

## That's it

Now the Hypertune SDK will initialize with near-zero latency on the server in Vercel's edge environment.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.hypertune.com/sdk-reference/vercel-edge-config.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.