hoodux
TypeScript icon, indicating that this package has built-in type declarations

1.0.4 • Public • Published

Hoodux

Hoodux is a helper to replace the React Redux with React hooks.

Usage

Install

$ npm install hoodux --save
 
or
 
$ yarn add hoodux

API

  1. useHooduxProvider(reducer, initState)

This is a hook to generate Hoodux Provider which should be placed on the top level of app. Hoodux provider will populate a state and dispatch to the app's components tree.

  1. useHoodux()

This is a hook to pop a state and dispatch to use in any component in your app.

Example

import { useHooduxProvider, useHoodux } from "hoodux";
 
const initState = {
  isSignedIn: false,
  count: 0
};
 
const reducer = (state, action) => {
  switch (action.type) {
    case "auth":
      return { isSignedIn: !state.isSignedIn };
    case "changeCount":
      return { count: action.payload };
    default:
      throw new Error("Invalid action type");
  }
};
 
const App = () => {
  const { HooduxProvider } = useHooduxProvider(reducer, initState);
  return (
    <HooduxProvider>
      <Main />
    </HooduxProvider>
  );
};
 
const Main = () => {
  const { state, dispatch } = useHoodux();
 
  return (
    <div>
      <button onClick={() => dispatch({ type: "auth" })}>Toggle</button>
      <button onClick={() => dispatch({ type: "changeCount", payload: 5 })}>
        Change count to 5
      </button>
    </div>
  );
};

Next to do

  • Add more types

Readme

Keywords

Package Sidebar

Install

npm i hoodux

Weekly Downloads

0

Version

1.0.4

License

MIT

Unpacked Size

7.54 kB

Total Files

12

Last publish

Collaborators

  • moondaddi