# 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:

```typescript
import "server-only";
import { VercelEdgeConfigInitDataProvider } from "hypertune";
import { unstable_noStore as noStore } from "next/cache";
import { createClient } from "@vercel/edge-config";
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: "1", name: "Test", email: "hi@test.com" },
      },
    },
  });
}
```

## That's it

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