react-vodka
v0.0.9
Published
React CRUD system
Downloads
36
Maintainers
Readme
Vodka
Vodka is a class to easily help build reducers and sagas for you. Vodka also manages tree like structure for objects of objects
Install
Yarn
yarn add react-vodka
npm
npm install react-vodka --save
Example usage
// mixers.js
import Vodka from 'react-vodka';
const vodka = new Vodka({
baseUrl: 'https://api.bookstore.local',
headers: {
'Content-Type': 'application/json',
},
});
vodka.shot({
name: 'books',
endpoint: 'books/{book}',
key:'slug',
});
// Create a mapped child module of books
vodka.shot({
parents: 'books',
name: 'pages',
endpoint: 'books/{book}/pages/{pages}/',
});
// Create a mapped child module of pages
vodka.shot({
parents: 'books.pages',
name: 'words',
endpoint: 'books/{book}/pages/{page}/words/{word}',
});
//additional example
vodka.shot({
name: 'pages',
endpoint: '/books/{book}/pages/{pages}/',
parents: 'books', //optional
key: 'slug', //optional default "id"
configs: [ //optional [prefixed automatically]
'CREATE_LINE',
'CREATE_LINE_ASYNC',
], //optional
reducers: { //optional
'CREATE_LINE' : (state, action) => {
return Object.assign({}, state, {
lines: Object.assign(state.books[action.params.book].lines, action.lines),
});
},
},
sagas: [
function* () {
while(true) {
const action = yield effects.take('CREATE_LINE');
console.log(action);
//do something with your saga
}
},
],
except: [ //optional
'store',//remove store method
],
});
// Muiltple shots example
vodka.shots([
{
name: 'books',
endpoint: 'books/{book}',
key:'slug',
},
{
name: 'pages',
parents: 'books',
endpoint: 'books/{book}/{pages}/',
},
{
name: 'words',
parents: 'books.pages',
endpoint: 'books/{book}/pages/{page}/words/{word}',
},
]);
export default vodka;
Install Vodka into your app
import React from 'react';
import ReactDOM from 'react-dom';
import vodka from './modules/Mixers';
import {combineReducers} from 'redux';
import {routerReducer} from 'react-router-redux';
import {reducer as form} from 'redux-form';
import {createStore} from 'react-vodka';
import {Provider} from 'react-redux';
import {BrowserRouter as Router } from 'react-router-dom';
import {syncHistoryWithStore} from 'react-router-redux';
import {createBrowserHistory} from 'history';
import Routes from './modules/Route';
import {persistStore} from 'redux-persist';
import localForage from 'localforage';
import * as preLoader from './modules/PreLoader/config';
import preloaderReducer from './modules/PreLoader/reducer';
const reducers = combineReducers({
routing: routerReducer,
form,
preloaderReducer,
...vodka.getReducers(),
});
const sagas = [
...vodka.getSagas(),
];
const browserHistory = createBrowserHistory();
const store = createStore(browserHistory, reducers, sagas, window.data);
const history = syncHistoryWithStore(browserHistory, store);
persistStore(store, {storage: localForage}, () => {
store.dispatch({
type: preLoader.SET_LOADER,
loaded: true,
});
});
ReactDOM.render(
<Provider store={store} key="provider">
<Router history={history}>
<div>
<Routes/>
</div>
</Router>
</Provider>
, document.getElementById('app'));
if (process.env.NODE_ENV !== 'production') {
window.React = React;
}
Vodka also comes with an Auth class to easily build an auth saga and reducer.
import Vodka, {Auth} from 'react-vodka';
const auth = new Auth({
baseUrl: 'http://localhost:8000/admin',
register:false,
});
const vodka = new Vodka({
baseUrl: 'http://localhost:8000/admin',
auth: auth,
});
export default vodka;
Local package development
git clone
yarn && yarn build && npm link
TODO
- [x] Need to find a way to add a trailing slash if outgoing url doesn't already have one
- [x] Need to figure out how to have a manageable config object
- [x] Need to replace child's parent's reducer function with an object with child's key as a property
- [ ] Need to add sagas to manage children easier rather than update parent each time
- [ ] Figure out how to export a immutable object/array
- [x] Rename Vodka file to index
- [x] Build package and install in stylique app for testing properly
- [ ] Have a go at building a routes component
- [x] Refactor child to parent method calling by removing parent, name object
- [ ] Make sure child reducer types do not conflict with parent's
- [ ] Test that sagas work correctly
- [ ] Test child setup
- [ ] Update dependencies
- [ ] Rewrite README
Not so important right now
- [x] Add custom reducer methods to vodka function config
- [x] Add custom saga methods to vodka function config