# contux

> Redux alternative using react contuxt API

Latest version **0.0.3** (published 2018-03-14) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install contux
pnpm add contux
yarn add contux
bun add contux
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2018-03-14 |
| First published | 2018-03-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 338.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | marudhupandiyang@gmail.com |
| Maintainers | marudhupandiyang |
| Keywords | contux |

## Links

- npm: https://www.npmjs.com/package/contux
- Repository: https://github.com/marudhupandiyang/contux
- Homepage: https://github.com/marudhupandiyang/contux#readme
- Issues: https://github.com/marudhupandiyang/contux/issues
- npm.io page: https://npm.io/package/contux

## Dependencies (2)

- [react](https://npm.io/package/react.md) ^16.3.0-alpha.1
- [shallow-equals](https://npm.io/package/shallow-equals.md) ^1.0.0

## Recent versions

- 0.0.3 (latest) — 2018-03-14
- 0.0.2 — 2018-03-04
- 0.0.1 — 2018-03-04

## README

# contux
  Simple store library mimicking the popular Redux API by making use of the new **React Context API** that will be introduced in version 16.3.0.

### **NOTE:** This is in development and will be production ready when the Context API is released.


## Installation

    npm install contux

  or if you use `yarn`

    yarn add contux

## Features

  1. Updates only when the state changes. This is made sure by `shallow compare` of the state.
  2. Receives the Contux state and Component props in `mapStateToProps` function. Allows one to manipulate state based on the props before sending it to the component.

## Instructions

 1. Prepare your `initial state`.

        const initialState = { count: 0 };

 2. Declare your `rootReducer that reduces your actions to a state.

        const rootReducer = (state, action) => {
          switch (action.type) {
            case 'increment': {
              const newState = { ...state };
              newState.count += 1;
              return newState;
            }

            default:
              return state;
          }
        };

 3. Surround your root component to enable that state is passed to all the children.

        import Contux from 'contux';

        const App = () => (
          <Contux
            initialState={initialState}
            reducer={rootReducer}
          >
            <Tick name="John" />
          </Contux>
        );


 4. `connect` the component where you need state and dispatch functions.

        const Tick = ({ tickCount, dispatch }) => (
          <div>
            <b>{tickCounter}</b>
            <br />
            <button onClick={() => {
              dispatch({
                type: 'increment',
              });
            }}
            >
              Increment
            </button>
          </div>
        );

        const mapStateToProps = (state, props) => ({ tickCounter: `${props.name}: ${state.count}` });
        export default connect(mapStateToProps)(Tick);


## Roadmap:
  1. More features to come in.

---
_Source: https://npm.io/package/contux · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._