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

# JavaScript SDK

> Learn how to generate images and PDFs with the Bannerify JavaScript SDK.

Use `bannerify-js` to call the Bannerify API from JavaScript and TypeScript without writing raw HTTP requests.

## Install

<Tabs>
  <Tab title="npm">
    ```bash theme={null}
     npm install bannerify-js
    ```
  </Tab>

  <Tab title="pnpm">
    ```bash theme={null}
     pnpm add bannerify-js
    ```
  </Tab>

  <Tab title="yarn">
    ```bash theme={null}
     yarn add bannerify-js
    ```
  </Tab>

  <Tab title="bun">
    ```bash theme={null}
     bun add bannerify-js
    ```
  </Tab>
</Tabs>

## Instantiate

You need a project API key before using the SDK. Create one in **Dashboard → API Keys** and keep it server-side.
Afterwards you need to provide it to the client:

```ts theme={null}
import { Bannerify } from "bannerify-js";

const bannerify = new Bannerify('bnfy_xxx');
```

## Response format

The SDK returns errors explicitly so your code can handle failed requests without relying on thrown errors. TypeScript narrows the response after you check the `error` field.

Every method returns either an `error` or a `result` field, never both and never none.

<CodeGroup titles={["Success", "Error"]}>
  ```ts theme={null}
  {
    result: T // the result depends on what method you called
  }
  ```

  ```ts theme={null}
  {
    error: {
    // A machine readable error code
    code: ErrorCode;

    // A link to our documentation explaining this error in more detail
    docs: string;

    // A human readable short explanation
    message: string;

    // The request id for easy support lookup
    requestId: string;
  }
  }
  ```
</CodeGroup>

## Checking for errors

To check for errors you use the `error` property, our errors are easy to read and provide a link to our documentation for more information.

```ts theme={null}
import { Bannerify } from "bannerify-js";

const bannerify = new Bannerify('your-api-key');
const { result, error } = await bannerify.generateImageSignedUrl('your-template-id');

if (error) {
  // handle potential network or bad request error
  // a link to our docs will be in the `error.docs` field
  console.error(error.message);
  return;
}

// process request
console.log(result);
```

## Options

The constructor accepts some options to customize the behavior:

### API key

<ParamField body="apiKey" type="string" required>
  Your project’s API key
</ParamField>

```ts theme={null}
const bannerify = new Bannerify('my-api-key')
```

### Timeout

The timeout for the requests in milliseconds, by default it is 10000ms.

```ts theme={null}
const bannerify = new Bannerify('my-api-key',{
  // ...
  timeout: 10000
})
```

### Fetch

The fetch client to use, by default it uses the global fetch client.

```ts theme={null}
const bannerify = new Bannerify('my-api-key',{
  // ...
  fetch: myFetchClient
})
```