npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@rod-car/use-axios-api

v1.0.0

Published

An API hook based on axios for REST API Call

Downloads

9

Readme

@rod-car/use-api

An API utility based on axios for making REST API calls in React applications.

Installation

npm install @rod-car/use-api

Usage

import { useApi } from '@rod-car/use-api';

// Example usage
const api = useApi({
  baseUrl: 'https://example.com'
  url: '/resource',
  key: 'data',
});

// Perform API actions using api.Client methods
api.Client.get(); // Fetch data
api.Client.post({ name: 'John Doe' }); // Create a new record
api.Client.put(1, { name: 'Updated Name' }); // Update a record
api.Client.find(1); // Find a record by ID
api.Client.patch(1, { partialData: 'Updated Data' }); // Partially update a record
api.Client.destroy(1); // Delete a record

API Reference

useApi(options: APIProps)

Initialize the API utility.

  • options:
    • baseUrl (string): Base URL of the resources. It is optional.
    • url (string): URL of the resource excluding the base URL.
    • key (string): Key containing the data returned by the server. It is optional.

Returns an object with the following properties:

  • resetError(): Reset the error state.
  • datas (array): Array of data fetched from the server.
  • data: Single data object fetched from the server.
  • RequestState: Object indicating the current request state.
    • loading (boolean): Indicates if a request is in progress.
    • creating (boolean): Indicates if a creation request is in progress.
    • updating (boolean): Indicates if an update request is in progress.
    • deleting (boolean): Indicates if a deletion request is in progress.
  • error: APIError object representing the error state.
  • success: Boolean indicating the success state.
  • Client: Object with methods for performing API actions.

Methods in Client

  • get(params?: Record<string, string | number>): Fetch a list of data.
  • find(id: string | number, params?: Record<string, string | number>): Find a record by ID.
  • post(data: Omit<T, "id">): Create a new record.
  • put(id: string | number, data: Omit<T, "id">): Update a record.
  • patch(id: string | number, data: Partial<Omit<T, "id">>): Partially update a record.
  • destroy(id: string | number): Delete a record.

License

This package is released under the MIT License.