Custom State Management Package

createStore 📦

createStore is a custom state management package that provides a simple way to create and manage state in a React application.

Installation 🚀

npm install use-mini-store

Usage 🤖

import createStore from "use-mini-store";

export useStore = createStore({ count: 1 });

Parameters 🛠️

initialState (Object): The initial state object. Returns 🚀 Returns a function that generates a custom hook for accessing and managing state.

Custom Hook Usage 💻

// use the returned hook from createStore to get and set state values
const [count, setCount, removeEvent] = useStore('count');

useStore(key) 🎣

A custom hook generated by createStore for managing state.

Parameters 🧩

key (String): The key to access the specific state value.

Returns 🎁

An array with the following elements:

• The current state value.
• A function to update the state value.
• A function to remove the event listener associated with the state key (in case of unmount / dont need re render for that value).

Example 🚀

// Example usage in a component
import createStore from 'use-mini-store';

const useStore = createStore({count: 1});

const Counter () => {
  const [count, setCount] = useStore('count');
  const increment = () => {
    setCount(prev => prev + 1);
  }
  
  return <button onClick={increment}>{count}</button>;
}

Notes 📝

• Components using the same state key will re-render when the state is updated.
• To stop listening to state changes and prevent unnecessary re-renders, call the removeEvent function returned by useStore.