Unleash the Power of Seamless API Calls

Dive into the world of axios-instance – the React hook that turns the complexity of Axios-based API calls into a thrilling adventure! This dynamic hook effortlessly juggles the intricacies of API requests, loading states, and error handling, providing you with a hassle-free experience. But that's not all – brace yourself for a feature-packed journey with support for token authentication, payload integration, and query parameters. It's not just a hook; it's your ultimate solution for conquering a spectrum of RESTful HTTP methods like GET, POST, PUT, DELETE, and beyond!

Installation: A Swift Launchpad 🚀

Embark on your journey by installing the axios-instance package with just one command:

  npm install axios-instances

Parameters: Your Personalization Toolkit 🧰

Customize your API interactions with an array of flexible parameters:

| Name | Details | | ----------------- | ------------------------------------------------------------------ | | method | Command the HTTP method for your requests (e.g., "GET", "POST", etc.). | | url | Target the API endpoint you want to conquer. | | headers | Amplify your requests with additional headers. | | queryParams | An object containing query parameters to be included in the request URL. | | payload | Arm yourself with data for a victorious encounter, perfect for methods like POST or PUT. |

Usage/Examples: Craft Your Epic Saga 🛡️

Witness the magic unfold in your React component with useApiRequestWithAuth:

import { useApiRequestWithAuth } from 'use-axios-hook';

const HeroicComponent = () => {
  const { data, isLoading, error } = useApiRequestWithAuth(
    'https://jsonplaceholder.typicode.com/posts',
    { method: 'GET' }
  );

  if (isLoading) {
    return <div>⌛ Loading...</div>;
  }

  if (error) {
    return <div>⚔️ Error: {error.message}</div>;
  }

  if (!data) {
    return <div>🤷‍♂️ No data available.</div>;
  }

  // Craft your component with the fetched data
  return (
    <div>
      {data.map((item: any) => (
        <div key={item.id}>{item.title}</div>
      ))}
    </div>
  );
};

Feel the thrill, customize HeroicComponent to unleash your unique use case, and let axios-instance be your trusty sidekick in this epic API saga. Your journey to API greatness starts here! 🌟

Suggestions

Suggestions are always welcome! For suggestions, email [email protected] or [email protected].

Support

For support, email [email protected] or [email protected].