brunoksato/easy-peasy

Vegetarian friendly state for React

 

Vegetarian friendly state for React

 

npm install easy-peasy

Step 1 - Create your store

const store = createStore({
  todos: {
    items: ['Create store', 'Wrap application', 'Use store'],
    add: action((state, payload) => {
      state.items.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.items)
  const add = useStoreActions(actions => actions.todos.add)
  return (
    <div>
      {todos.map((todo, idx) => <div key={idx}>{todo}</div>)}
      <AddTodo onAdd={add} />
    </div>
  )
}

Features

• Zero configuration
• No boilerplate
• React hooks based API
• Computed properties - i.e. derived data
• Data fetching / side effects
• Testing helpers
• Extensive TypeScript support
• Global, shared, or component level stores
• React Native supported
• Redux Dev Tools supported
• Hot Reloading supported

Introduction

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, performance optimisation, developer tools etc.

Documentation

See the official website for tutorials, API docs, recipes, and more.

Backers

Thank goes to all our backers! [Become a backer].