La Taverne is an elementary Flux implementation to manage your state.

The goal is to keep Redux original power and simplicity, removing the headaches of addons like Redux-thunks or Reselect.

import createLaTaverne from 'taverne';
import {Taverne} from 'taverne/hooks';

const Demo = () => {
  const onIncrement = {
    on: 'increment',
    reduce: (state, payload) => {
      state.clickCount++;
    }
  };

  const {dispatch, store} = createLaTaverne({
    counter: {
      initialState: {clickCount: 0},
      reactions: [onIncrement]
    }
  });

  return (
    <Taverne dispatch={dispatch} store={store}>
      <App />
    </Taverne>
  );
};

import {useTaverne} from 'taverne/hooks';

const App = () => {
  const {dispatch, pour} = useTaverne();
  const clickCount = pour('counter.clickCount');

  const increment = () => {
    dispatch({
      type: 'increment'
    });
  };

  return <h1 onClick={increment}>{clickCount}</h1>;
};

0

Increment

La Taverne

Let's keep what is great in Redux:

  • 1 external, predictable and centralized state.
  • actions + reducers
  • middlewares
  • easily debuggable with devtools

Now let's add the Immer magic to assure immutability in your reducing.

focus on React

La Taverne provides an optional, yet easy integration with React using custom hooks.

This was actually the original idea: working on the React performance on local rendering without all the manual memoization.

const {dispatch, pour} = useTaverne();
const clickCount = pour('counter.clickCount');

const increment = () => {
  dispatch({
    type: 'increment'
  });
};