Wrap feathers-client.authentication so it works with Redux, as well as authentication, authorization packages for React-Router.

feathers, feathersjs, authentication, react-router, redux
npm install feathers-reduxify-authentication@1.0.1



Wrap feathers-client.authentication so it works transparently with Redux, as well as authentication, authorization packages for React-Router.

Build Status

  • Work with standard feathers-client.authentication on the client.
  • Dispatch feathers authentication and logout to Redux.
  • Integrate with react-router and react-router-redux.
  • Use popular Redux, React-Router authentication and authorization packages for React routing.

Code Examples

What we want to be able to do

This is typical code for React routing and permissions.

import { UserAuthWrapper } from 'redux-auth-wrapper';

// Define permissions
const UserIsAuthenticated = UserAuthWrapper({
  authSelector: (state) => state.auth.user, // BEING ABLE TO DO THIS IS ONE REASON TO USE THIS REPO
  predicate: user => user && user.isVerified,
const UserIsAdmin = UserAuthWrapper({
  authSelector: (state) => state.auth.user, // BEING ABLE TO DO THIS IS ONE REASON TO USE THIS REPO
  predicate: user => user && user.isVerified && user.roles && user.roles.indexOf('admin') !== -1,

// React routing
<Provider store={store}>
  <Router history={history}>
    <Route path="/" component={AppWrapper}>
      <Route path="/user/profilechange"
        component={UserIsAuthenticated(UserProfileChange)} // USER MUST BE AUTHENTICATED
      <Route path="/user/roleschange"
        component={UserIsAuthenticated(UserIsAdmin(UserRolesChange))} // AUTHENTICATED AND ADMIN

require('feathers-client').authentication cannot be used as-is in this scenario or other scenarios involving Redux-based projects.

feathers-reduxify-authentication wraps feathers-client.authentication so it behaves transparently as 100% compatible Redux code.

Making feathers-client.authentication work with Redux

You wrap require('feathers-client').authentication, insert the wrapper's reducer into Redux's combineReducers, and use the wrapper's action creators with Redux's dispatch.

Voila, 100% Redux compatible with the current user retained in Redux's store.

import feathers from 'feathers-client';
import feathersReduxifyAuthentication from 'feathers-reduxify-authentication';

// Configure feathers-client
const app = feathers(). ... .configure(feathers.authentication({ ... });

// Reduxify feathers-client.authentication
feathersAuthentication = reduxifyAuthentication(app,
  { isUserAuthorized: (user) => user.isVerified } // WE INSIST USER IS 'verified' TO AUTHENTICATE

// Add to Redux reducer
const rootReducer = combineReducers({ ..., auth: feathersAuthentication.reducer, ...});

// Dispatch actions as needed. Params are the same as for feathers.authentication().
dispatch(feathersAuthentication.authenticate({ type: 'local', email, password })).then().catch();

Working Example

This package is used in feathers-starter-react-redux-login-roles which implements full featured local authentication with user roles, email verification, forgotten passwords, etc.

You can review how that project uses feathers-reduxify-authentication:

  • client/feathers/index.js configures feathers and reduxifies feathers-client.authentication.
  • client/reducers/index.js adds our authentication to Redux's reducers. Our current user will be stored at state.auth.user.
  • client/index.js sets up React routing and permissions.
  • client/screens/Users/UserSignIn/FormContainer.js both authenticates users and logs them out.


  • Feathers is a great real-time client-server framework.
  • Redux is a great state container for the front-end.
  • React is a great declarative UI.
  • React-Router is a complete routing library for React by React.
  • There are several packages which handle authentication and authorization for React-Router and Redux.

This repo let's everyone work together easily.


Install Nodejs.

Run npm install --save-dev feathers-reduxify-authentication in your project folder.

You can then:

// ES6
import feathersReduxifyAuthentication from 'feathers-reduxify-authentication';
// ES5
const feathersReduxifyAuthentication = require('feathers-reduxify-authentication');

/src on GitHub contains the ES6 source.

API Reference

Each module is fully documented.

Also see Working example above.


npm test to transpile the ES6 code in /src to ES5 in /lib.


Contribute to this repo.

Guide to ideomatic contributing.

Change Log

List of notable changes.