
Vegetarian friendly state for React
Easy Peasy provides you with an intuitive API to quickly and easily manage the state for your React application. Batteries are included - no configuration is required to support derived state, API calls, developer tools etc.
npm install easy-peasy
Step 1 - Create your store
const store = createStore({
todos: ['Create store', 'Wrap application', 'Use store'],
addTodo: action((state, payload) => {
state.add.push(payload)
})
});
Step 2 - Wrap your application
function App() {
return (
<StoreProvider store={store}>
<TodoList />
</StoreProvider>
);
}
Step 3 - Use the store
function TodoList() {
const todos = useStoreState(state => state.todos);
const addTodo = useStoreActions(actions => actions.addTodo);
return (
<div>
{todos.map((todo, idx) => <div key={idx}>{todo}</div>)}
<AddTodo onAdd={addTodo} />
</div>
);
}
Features
- Zero configuration
- No boilerplate
- React hooks based API
- Computed properties - i.e. derived data
- Data fetching / side effects
- Persist state to session/local storage
- Testing helpers
- Extensive TypeScript support
- Global, shared, or component level stores
- React Native supported
- Redux Dev Tools supported
- Hot Reloading supported