Declarative State and Logic Management

Introduction • Key Features • Basic Example • Documentation • Feedback • Contribution

What is Reclare ?

Reclare is a lightweight library to manage the application state alongside business logic, without compromising from the predictability of the state. It is inspired by Redux and the Elm architecture and includes many of the familiar concepts.

Key Features

• Manage state and logic together
• Unidirectional data flows
• Predictable, immutable state
• Handle requests / side effects
• Built-in way to modularise your code
• For all frameworks - offical middleware for React
• Easy to install, minimal configuration
• Easy-to-grasp concepts

Basic Example

View on JSFiddle

Below is an example of what declarations would look like in the context of a simple counter implementation with one simple rule: the counter cannot go below zero:

{
  on: 'increment',
  reducer: ({ state }) => ({ ...state, counter: state.counter + 1 })
  reaction: ({ state }) => console.log(`Incremented to ${state.counter}`)
},
{
  on: 'decrement',
  when: ({ state }) => state.counter > 0,
  reducer: ({ state }) => ({ ...state, counter: state.counter - 1 }),
  reaction: ({ state }) => console.log(`Decremented to ${state.counter}`)
},
{
  on: 'decrement',
  when: ({ state }) => state.counter <= 0,
  reaction: () => alert('Counter already at zero')
}

Upon the broadcast of increment, the first declaration will be invoked. It will increment the counter and log the updated number. decrement event hits two declarations. First one only invokes when the counter is greater than zero and decrements the counter. Second one invokes when counter is zero, and alerts the error message.

Broadcasting these events would look something like this: