# Event Livestream

If you have livestreaming enabled on an indexer for one of your projects (check the 'Stream Enabled' box in project settings: <https://docs.graffle.io/graffle-docs/graffle-management-dashboard/projects/project-indexers>), you can stream events in real time to your frontend.\
\
This is best used when you want to show live events on your site, without polling the Event Search API or your own API.&#x20;

{% hint style="info" %}
Note: You can contact us on our discord for an API key.
{% endhint %}

To get started, install the livestream SDK by running:

```
npm install @graffle/flow-livestream-sdk  
```

Then configure the SDK with your project Id and API key, and whether this is a test net project.

```
const clientConfig = {
    projectId: '<your project id>',
    apiKey: '<your api key>'
  };

const streamSDK = new GraffleSDK(clientConfig);
// or `const streamSDK = new GraffleSDK(clientConfig, true);` for test net
```

Then, create a function to display/process events as they come in and pass this function to the SDK via the `stream` method.

```
const displayEvent = (message) => {
    console.log(message);
    //display/process the event here
  };

  useEffect(() => {
    streamSDK.stream(displayEvent);
  }, []);
```

To disconnect and stop receiving events, call the `disconnect` method

```
streamSDK.disconnect();
```