feathers-reduxify-authentication
Wrap feathers-client.authentication so it works transparently with Redux, as well as authentication, authorization packages for React-Router.
- Work with standard
feathers-client.authentication
on the client. - Dispatch feathers authentication and logout to Redux.
- Integrate with
react-router
andreact-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.
; // Define permissionsconst UserIsAuthenticated = ;const UserIsAdmin = ; // React routing<Provider store=store> <Router history=history> <Route path="/" component=AppWrapper> <Route path="/user/profilechange" component= // USER MUST BE AUTHENTICATED /> <Route path="/user/roleschange" component= // AUTHENTICATED AND ADMIN /> </Route> </Router></Provider>
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
.
;; // Configure feathers-clientconst app = ...
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 atstate.auth.user
.client/index.js
sets up React routing and permissions.client/screens/Users/UserSignIn/FormContainer.js
both authenticates users and logs them out.
Motivation
- 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.
Installation
Install Nodejs.
Run npm install --save-dev feathers-reduxify-authentication
in your project folder.
You can then:
// ES6;// ES5const feathersReduxifyAuthentication = ;
/src
on GitHub contains the ES6 source.
API Reference
Each module is fully documented.
Also see Working example above.
Build
npm test
to transpile the ES6 code in /src
to ES5 in /lib
.
Contributing
Guide to ideomatic contributing.
Change Log
License
MIT. See LICENSE.