react-persisted-global-state

About

Simple React hook for global state which is persisted to Local Storage.

This allows sharing state between multiple components or different instance of the same component, all while the changes are persisted to the browser's Local Storage.

Installing

Install react-persisted-global-state and its peer-dependencies:

# For users of npm
npm install --save react-persisted-global-state react-use

# For users of Yarn
yarn add react-persisted-global-state react-use

Usage

import { createPersistedGlobalState } from 'react-persisted-global-state';

// Register a re-usable instance of our global state store
const useMyPersistedGlobalState = createPersistedGlobalState<string>(
  'my-localstorage-key',
  'Hello, world!'
);

const MyComponent = () => {
  const [state, setState, removeState] = useMyPersistedGlobalState();

  return (
    <input type="text" value={state} onChange={e => setState(e.target.value)} onClear />
  );
};

Releasing

We use release-it to automate our creating releases for this application. A new release can be rolled out by running:

yarn release

✨ Contributors

Thanks goes to these wonderful people (emoji key):

Adriaan Knapen 💻 🔧 📖 ⚠️

This project follows the all-contributors specification. Contributions of any kind welcome!