Djinn-state NPM

Djinn-state

A powerful yet simple application state management.

The Djinn-state was developed with the objective to be less verbose and simple to maintain and scale Javascript applications.

Features

Supported in browsers and NodeJs
Simple to implement
Register and retrieve registered services by just giving the class of the service you want
Singleton and scoped services
Subscribe and unsubscribe to service state changes

Libraries

Install

npm npm i --save djinn-state

yarn yarn add djinn-state

Using

// djinn.js
import { Djinn, DjinnService } from 'djinn-state';

const djinn = new Djinn();

// AuthService.js
class AuthService extends DjinnService {
  state = {
    token: '',
  };
  
  authenticate() {
    this.patch({
      token: 'someNewTokenHere',
    });
  }
}

// HttpService.js
class HttpService extends DjinnService {
  initService() {
    super.initService();
    this.authService = djinn.getService(AuthService);
  }
  
  get(url) {
    const token = this.authService.state.token;
    const headers = {
      'Authorize': `Bearer ${token}`,
    };
    
    makeHttpRequest(url, headers);
  }
}

// djinnServices.js
djinn.register(AuthService);
djinn.register(HttpService);
djinn.start();

// myPage.js
const authService = djinn.getService(AuthService);

const onStateUpdate = (update) => {
  console.log(update); // { token: { current: 'someNewTokenHere', previous: '' } }  
};

const unsubscribe = authService.subscribe(onStateUpdate);

authService.authenticate();
// onStateUpdate() called

console.log(authService.state); // { token: 'someNewTokenHere' }

unsubscribe(); // Don't listen to changes anymore