realar

Realar

Reactive state manager for React based on reactive-box.

Light, Fast, and Pretty looked :kissing_heart:

Usage

import React from 'react';
import { box, sel, shared } from 'realar';

class Counter {
  @box value = 0;

  increment = () => this.value += 1;
  decrement = () => this.value -= 1;
}

const sharedCounter = () => shared(Counter);

const App = () => {
  const { value, increment, decrement } = sharedCounter();
  return (
    <p>
      Counter: {value}
      <br />
      <button onClick={decrement}>Prev</button>
      <button onClick={increment}>Next</button>
    </p>
  );
};

Demos

• Hello - shared state demonstration.
• Todos - todomvc implementation.

Installation

npm install --save realar
# or
yarn add realar

And update your babel config if your want to use babel-plugin for automatic decorated arrow function components.

Enjoy and happy coding!