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

• djinn-state-react
• djinn-state-history

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