https://github.com/jedrzejginter/endpoints
Useful TypeScript types and utils for axios fetching
https://github.com/jedrzejginter/endpoints
axios endpoints typescript
Last synced: over 1 year ago
JSON representation
Useful TypeScript types and utils for axios fetching
- Host: GitHub
- URL: https://github.com/jedrzejginter/endpoints
- Owner: jedrzejginter
- License: mit
- Created: 2021-04-03T15:55:21.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2021-04-15T16:41:08.000Z (about 5 years ago)
- Last Synced: 2025-01-21T07:44:20.781Z (over 1 year ago)
- Topics: axios, endpoints, typescript
- Language: TypeScript
- Homepage:
- Size: 59.6 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @ginterdev/endpoints
> Useful TypeScript types and utils for axios fetching
## Warning :warning:
**For now I am just experimenting.**
This package makes some assumptions:
- you are using **axios** (^0.21)
## Installation
```bash
yarn add @ginterdev/endpoints
# or
npm i @ginterdev/endpoints
```
## Examples
Let's define types for our API. For simplicity there's two endpoints only.
```ts
type Endpoints {
'POST /companies': {
body: {
name: string;
};
response: {
success: boolean;
};
};
'GET /companies': {
query?: {
searchPhrase?: string;
};
response: {
success: boolean,
companies: {
id: string;
name: string;
};
};
};
'GET /company/{id}': {
params: {
id: string;
};
response: {
success: boolean,
company: {
id: string;
name: string;
};
};
};
};
```
### Calling a request
To have all the typechecking in place for our endpoints we just wrap a fetcher (currently only `axios` instance is supported) with a `forEndpoints`. From now on we can execute requests with a guarantee that all required things are passed correctly.
```ts
import axios from 'axios';
import { forEndpoints } from '@ginterdev/endpoints';
const request = forEndpoints(axios.create());
// execute a request:
request('GET /companies', {
query: {
searchPhrase: 'github',
},
});
// URL params are automatically injected:
request('GET /companies/{id}', {
params: {
id: 'foobar',
},
});
```
### Extracting types
Now we can easily extract types of specific properties for each endpoint:
```ts
import { EndpointOptions, EndpointProp } from '@ginterdev/endpoints';
type EndpointUrl = keyof Endpoints;
type Options = EndpointOptions;
type Body = EndpointProp;
type Params = EndpointProp;
type Query = EndpointProp;
type Response = EndpointProp;
type CreateCompanyBody = Body<'POST /companies'>;
// { name: string }
type CreateCompanyResponse = Response<'POST /companies'>;
// { success: true }
type GetCompaniesQuery = Query<'GET /companies'>;
// { searchPhrase?: string }
type GetCompanyParams = Params<'GET /companies/{id}'>;
// { id: string }
```