@hellhiem/quick-fetch v0.1.6
quick-fetch
HTTP client built at the top of axios library to reduce your boilerplate in friendly way.
quickFetch already return data from response or throws error.
When using TypeScript you can get use of Generics to pass down your own ResponseType and ErrorType that are returned by API.
Installation
Using npm:
npm install @hellhiem/quick-fetchUsing yarn:
yarn add @hellhiem/quick-fetchExample
JavaScript
quickFetch(Method, Endpoint, Config)Params:
| Param | Type | Description |
| :--- | :---: | ----------: |
| Method | Method | Axios method type (POST,GET, etc...) |
| Endpoint | string | ... |
| Config (Optional) | AxiosRequestConfig | Axios request configs |
/// Simple fetch without configs
quickFetch('GET', 'https://api.example/v1/movies')
// Simple fetch with optional configs
quickFetch('GET', 'https://api.example/v1/movies',
{
headers: {...yourHeaders },
...otherConfigs
}
)TypeScript
quickFetch<ResponseType, ErrorType>(Method, Endpoint, Config)Params:
| Param | Type | Description |
| :--- | :---: | ----------: |
| Method | Method | Axios method type (POST,GET, etc...) |
| Endpoint | string | ... |
| Config (Optional) | AxiosRequestConfig | Axios request configs |
Generics:
| Generics | DefaultType | Description |
| :------- | :---------: | ----------: |
| ResponseType | AxiosResponse | Response type returned by response.data. When type is not provided is falls back to AxiosResponse type. |
| ResponseErrorType | AxiosError | Response error type threw by error. When type is not provided is falls back to AxiosError type. |
// Example types
type Movie = {
id: number;
name: string;
}
type MoviesResponseType = {
page: number;
perPage: number;
maxPage: number;
data: Movie[];
}
type ResponseErrorType = {
code: number;
text: string;
}
/// Simple fetch without configs
quickFetch<MoviesResponseType, ResponseErrorType>('GET', 'https://api.example/v1/movies')
// Simple fetch with optional configs
quickFetch<MoviesResponseType, ResponseErrorType>('GET', 'https://api.example/v1/movies',
{
headers: {...yourHeaders },
...otherConfigs
}
)