✴️ Unified, pluggable API client management for ofetch, route building and typed OpenAPI clients
MIT License
apiful
provides a unified way to manage all your API interactions by setting up a client with default fetch options, such as the API base URL and headers. Adapters extend the client with a variety of features to match your favorite API management flavor.
You can use one of the pre-built adapters to get started quickly, or create your own custom adapter to meet your specific requirements.
[!TIP] 📖 Read the documentation
# pnpm
pnpm add -D apiful
# npm
npm i -D apiful
[!TIP] 📖 Read the documentation
ofetch
Adapterimport { createClient, ofetch } from 'apiful'
const baseURL = '<your-api-base-url>'
const adapter = ofetch()
const api = createClient({ baseURL }).with(adapter)
// GET request to <baseURL>/users/1
await api('users/1', { method: 'GET' })
What it does:
The ofetch
adapter wraps ofetch to handle API calls.
apiRouteBuilder
Adapterimport { apiRouteBuilder, createClient } from 'apiful'
const baseURL = '<your-api-base-url>'
const adapter = apiRouteBuilder()
const api = createClient({ baseURL }).with(adapter)
// GET request to <baseURL>/users/1
await api.users.get(1)
// POST request to <baseURL>/users with payload
await api.users.post({ name: 'foo' })
What it does:
The apiRouteBuilder
adapter provides a jQuery-like and Axios-esque API for building and making API calls. It allows you to construct your API calls in a declarative way.
OpenAPI
Adapterimport { createClient, OpenAPI } from 'apiful'
const baseURL = 'https://petstore3.swagger.io/api/v3'
// Pass pre-generated schema type ID to adapter
const adapter = OpenAPI<'petStore'>()
const api = createClient({ baseURL }).with(adapter)
// Typed parameters and response
const response = await api('/user/{username}', {
method: 'GET',
path: { username: 'user1' },
})
What it does:
If your API has an OpenAPI schema, apiful
can use it to generate types for you, which the OpenAPI
adapter then consumes to provide type-safe API calls.
For example, the response returned by the API call on the left is typed as follows:
const response: {
id?: number
username?: string
// …
}
Please follow the OpenAPI adapter documentation to learn more about how to generate TypeScript definitions from your OpenAPI schema files.
As of right now, this library handles API management in the client. In the future, apiful
is intended to extend to the server side as well, providing a unified way to manage API calls in both client and server.
corepack enable
pnpm install
pnpm dev
Made with 💛
Published under MIT License.