treble-gsm

 

Treble Global State Management

Treble is a Hook-based global state management container and library for React.js apps. It is inspired by a blog post by Luke Hall. Treble's goal is to provide a simple way to manage global state in your React app by providing an easy setup, little boilerplate, and a straight forward API.

Getting Started

Install Treble

npm install treble-gsm

or

yarn add treble-gsm

Create Treble Store

Create a Store.js file in your app. Example below.

import { createStore } from 'treble-gsm';

const Store = createStore([
    {
        action: 'updatePokemon',
        state: { pokemon: 'Mewtwo' }
    },
    {
        action: 'updatePokemonGame',
        state: { pokemonGame: 'Pokemon Red' }
    }
],/* optional parameters */);

export default Store;

Treble Container Component

Import the Treble container component and Store.js into your App.js or index.js and wrap it around the components you wish to have access to your store. Pass the Store into the Treble store prop. Your app now has global state management!

import  React  from  'react';
import  Treble  from  'treble-gsm';
import  Store  from  './_store';

const App = () => {
    return (
        <Treble store={Store}>
            {/* Components */}
        </Treble>
    );
}

export  default  App;

For more documentation visit the official website, get-treble-gsm.com.