Skip to content

TrendingTechnology/simpler-state

 
 

Repository files navigation

SimpleR State

npm build coverage license

SimpleR State is an ultra-lightweight library that provides the simplest state management for React.

  • Minimalist API; no complicated concepts or boilerplate
  • Use plain functions to update state (including async)
  • Largely unopinionated with flexible syntax
  • Extremely simple to unit test state logic
  • Highly extensible with plug-ins (e.g. persistence, dev tools)
  • Full TypeScript support with uncomplicated types
  • Made specifically for React, and built on React Hooks
  • Multiple times faster than context/reducer solution
  • It's tiny, just around 1 KB (minified + gzipped)

Get all these benefits with one dependency install:

npm install simpler-state

Two Easy Steps!

Step 1: Create an entity (shared state) and actions (updater functions)

// counter.js

import { entity } from 'simpler-state'

export const counter = entity(0)

export const increment = by => {
  counter.set(counter.get() + by)
  // alternatively: counter.set(val => val + by)
}

export const decrement = by => {
  counter.set(counter.get() - by)
  // alternatively: counter.set(val => val - by)
}

Step 2: Use the entity in your components with hooks

import { useEntity } from 'simpler-state'
import { counter, increment, decrement } from 'counter'

const CounterView = () => {
  const count = useEntity(counter)
  // alternatively: const count = counter.use()

  return (
    <>
      <div>{count}</div>

      <button onClick={() => increment(1)}> + </button> 
      <button onClick={() => decrement(1)}> - </button>
    </>
  )
}

It's that simple! But the library can do a lot more.

Documentation

Learn more about what you can do with SimpleR State at simpler-state.js.org.

Feedback

I have opened a Request For Comments (here) on GitHub. Your comments and suggestions would be greatly appreciated.

And if you like this library, the concept, and its simplicity, please give it a star on the GitHub repo to let me know. 😀

Prior Art

This library is an evolution of the already production-proven react-entities that I also wrote. It shares the same stable core, but with a very different API.

About

The simplest app state management for React

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%