Neurological Phenomenon Multiplexer

    redux-devshare

    0.3.0 • Public • Published

    redux-devshare

    NPM version NPM downloads Build Status Dependency Status Code Climate Code Coverage License Code Style

    redux-devshare is a redux connector for devshare.

    Getting Started

    Install through NPM

    1. Install: npm install --save redux-devshare

    2. Include and use redux-devshare when creating redux middleware, when calling an action, or when combining reducers (examples in Documentation section below).

    Examples

    Simple example coming soon

    Documentation

    Middleware

    import { createStore, applyMiddleware, compose } from 'redux'
    import rootReducer from '../reducers' // Combined reducers
    import thunk from 'redux-thunk'
    import { Middleware } from 'redux-devshare'
     
    const createStoreWithMiddleware = compose(
      // Save for redux middleware
      applyMiddleware(thunk, Middleware)
    )(createStore)

    Reducers

    Add reducers to combineReducers function:

    import { combineReducers } from 'redux'
    import { routerStateReducer } from 'redux-router'
    import { Reducers } from 'redux-devshare'
    const { account, projects, entities } = Reducers
     
    let rootReducer = combineReducers({
      account,
      projects,
      entities,
      router: routerStateReducer
    })
     
    export default rootReducer

    Actions

    Example of using Actions from redux-devshare in a smart/linked component (also known as a "container"):

    import React, { Component, PropTypes } from 'react'
    import { bindActionCreators } from 'redux'
    import { connect } from 'react-redux'
    import { Actions } from 'redux-devshare'
     
    class Main extends Component {
      constructor (props) {
        super(props)
      }
      onLoginClick = e => {
        e.preventDefault()
        const testLogin = { username: 'test', password: 'asdfasdf' }
        this.props.login(testLogin)
      }
      render () {
        return (
          <div className="App">
            <button onClick={ this.onLoginClick }>
              Login
            </button>
          </div>
        )
      }
    }
     
    // Place state of redux store into props of component
    function mapStateToProps(state) {
      return {
        account: state.account
      }
    }
     
    // Place action methods into props
    function mapDispatchToProps(dispatch) {
      return bindActionCreators(Actions, dispatch)
    }
     
    export default connect(mapStateToProps, mapDispatchToProps)(Main)
     

    Install

    npm i redux-devshare

    DownloadsWeekly Downloads

    20

    Version

    0.3.0

    License

    MIT

    Last publish

    Collaborators

    • prescottprue