Create a React component with local state hosted by a local redux store
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Create stateful React Component using goodness from redux

Version Travis CI Quality Coverage Dependencies Gitter

Quick start: Say Hi

The form component that reads name and email from the user and submit the form to the API server.

import { Componentize } from "redux-component";

const createComponent = Componentize(/* ... */);

const Component = createComponent(function SayHi (props, state, actions) {
  return (
    <form onSubmit={e => actions.submitForm(props, e)}>
      {renderUsername(state.usernameLoading, props.userId, state.username)}
      <input type="text" value={} onChange={e => actions.textChanged(`name`, e)} />
      <input type="email" value={} onChange={e => actions.textChanged(`email`, e)} />
      <button type="submit">Hi</button>

This basically covers everything for creating a stateful React component.


See the full list of API.


redux-component requires React 0.13 or later.

npm install --save redux-component

All functions are available on the top-level export.

import { Componentize } from "redux-component";


React 0.14 introduces stateless function components. However, what if I want to use pure functions to create stateful React components?

That's what redux-component does.

Manage a component's local state using a local redux store.

A isolated redux store is created for each React component instance. It has nothing to do with your global flux architecture. There are several goodness for this approach:

  • Express component state transition in a single reducer function
  • Event callbacks in redux actions are clean and easy to reason about
  • You build pure functions all the way: render, actions and reducer
  • No more this.setState() touched in your code
  • Easy to test React component implements

See the complete example in the examples/gh-pages folder and demo hosted on GitHub.


devDependency Status

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request