---
title: Guide - Custom Client
sidebar_label: Custom Client
---

# Custom Client

You can create your own adapter based on your preferences or requirements. You can use the bindings to achieve it. They
will let you to easily connect into the library logic flow, so this way you will make your custom adapter without
handling the internals on the library. We propose to use the `getAdapterBindings` util so you skip the sensitive and
highly advanced part of connecting into hyper fetch flow.

---

### Example

```tsx
const customHttpAdapter = async () => {
  const {
    fullUrl,
    method,
    headers,
    payload,
    config,
    getAbortController,
    getRequestStartTimestamp,
    getResponseStartTimestamp,
    createAbortListener,
    onBeforeRequest,
    onRequestStart,
    onRequestProgress,
    onRequestEnd,
    onResponseStart,
    onResponseProgress,
    onResponseEnd,
    onSuccess,
    onAbortError,
    onTimeoutError,
    onUnexpectedError,
    onError,
  } = await getAdapterBindings(request, requestId);

  // ... any custom adapter logic, you can see axios implementation bellow
  axios({
    method,
    url: fullUrl,
    data: payload,
    headers,
    timeout: config.timeout,
  });
};
```

---

### Setup

Connect any adapter to communicate with the server and handle it as you want, the only thing that has to match is the
interface of the output.

```tsx
const customHttpAdapter: AdapterType = (request: RequestInstance) => Promise.resolve([null, null, 0]);

const client = new Client({ url }).setAdapter(customHttpAdapter);
```

---

### Typescript

You can pass custom options to your adapter from global setup and while request initialization. To make sure we pass
correct configuration through this places we can specify the type for them. It is passed to the client instance.

```tsx
type MyCustomAdapterOptions = {
  timeout?: number;
};

const client = new Client<Error, MyCustomAdapterOptions>({ url }).setAdapter(customHttpAdapter);
```
