JSPM

  • Created
  • Published
  • Downloads 4
  • Score
    100M100P100Q25276F
  • License MIT

A package to manage your rest api calls, cache mutations and all

Package Exports

  • rest-api-kit
  • rest-api-kit/dist/index.js
  • rest-api-kit/dist/index.mjs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (rest-api-kit) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Rest Api Kit

Welcome to rest-api-kit – your go-to solution for gaining precise control over caching in API requests within your React and React Native applications. Tired of feeling restricted by caching mechanisms that lack flexibility and clarity? Look no further. With rest-api-kit, developers like you can finally take charge of caching with ease. Say goodbye to complex configurations and unreliable results. Our package empowers you to determine exactly when cache entries are created, updated, or deleted, based on parameters you define. Whether you're building a web application with React or a mobile app with React Native, rest-api-kit simplifies caching implementation without compromising on effectiveness. Take control of your cache today with rest-api-kit

installation

rest-api-kit is available for use as a package on npm:

npm i rest-api-kit

or yarn:

yarn add rest-api-kit

What's in it?

Rest API kit comes with a base and hooks. The hooks are created from endpoint objects that are injected with the createEndpoints method as you'll see in the usage section of this documentation.

Usage

Import createRestBase

Import the createRestBase from rest-api-kit like so:

import { createRestBase } from "rest-api-kit";

Assign it

assign it to a variable like so:

const api = createRestBase({ baseUrl: "https://jsonplaceholder.typicode.com" });

Inject the endpoints

Create the endpoints at the base of your index file or App so it gets loaded in soon as uour project starts up.

const injector = api.createEndpoints((builder) => ({
  getATodo: builder({
    url: "/todos/1",
    params: {
      preferCacheValue: false,
      saveToCache: true,
      successCondition: (data) => {
        if (data.completed) {
          return true;
        }
        return false;
      },
      transformResponse: (data) => {
        // always return data;
        return data;
      }
    }
  }),
  createTodo: builder({
    url: "/post",
    params: {
      method: 'POST',
      updates: ['getATodo'],
    }
  }),
}));

export const { useGetATodo, useCreateTodo, useDeleteTodo } = injector;

Use it.

In the components that you need it in, you can use it like so:

const [getATodo, { data }] = useGetATodo();
const [deleteATodo, state] = useDeleteTodo();


  console.log(state, "<= state");

  useEffect(() => {
    getATodo();
  }, [])

  const deleteTodo = () => {
    deleteATodo({
      id: todoId
    })
  }

Params