Skip to content

Commit

Permalink
Merge pull request #5 from lexich/reducerName+urlTransform
Browse files Browse the repository at this point in the history
Reducer name+url transform
  • Loading branch information
lexich committed Aug 31, 2015
2 parents ec10ccf + c220ea2 commit f10d879
Show file tree
Hide file tree
Showing 15 changed files with 1,786 additions and 494 deletions.
9 changes: 2 additions & 7 deletions .eslintrc
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,6 @@
"browser": true,
"node": true
},
"globals": {
"Em": true,
"DS": true,
"Modernizr": true
},
"ecmaFeatures": {
"arrowFunctions": true,
"blockBindings": true,
Expand All @@ -29,7 +24,6 @@
"jsx": false
},
"rules": {
"no-var": 0,
"no-multi-spaces": 0,
"space-infix-ops": 0,
"quotes": [
Expand All @@ -49,6 +43,7 @@
"no-param-reassign": 0,
"no-extend-native": 0,
"no-empty": 0,
"guard-for-in": 0
"guard-for-in": 0,
"comma-dangle": 0
}
}
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,4 @@ npm-debug.log
coverage/
bower_components
/lib
.DS_Store
58 changes: 46 additions & 12 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@

Inspired by [Redux-rest](https://github.com/Kvoti/redux-rest) and is recommended to work with [Redux](https://github.com/gaearon/redux).



## Install
with npm
```sh
Expand Down Expand Up @@ -41,22 +43,22 @@ import reduxApi, {transformers} from "redux-api";
}
// equivalent
{
entry: {
entry: {
url: "/api/v1/entry",
transformer: transformers.object, //it's default value
transformer: transformers.object, //it's default value
options: {} //it's default value
}
}
```
**url** - endpoint for rest api
> *type*: String
> *type*: String
**transformer** - response transformer
> *type*: Function
> *default*: transformers.object
> *example*: It's a good idea to write custom transformer
for example you have responce
```json
{ "title": "Hello", "message": "World" }
{ "title": "Hello", "message": "World" }
```
Custom transformer
```js
Expand All @@ -75,18 +77,18 @@ import reduxApi, {transformers} from "redux-api";
options: {
method: "post",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
"Accept": "application/json",
"Content-Type": "application/json"
}
}
```

- **fetch** - rest backend. Redux-api recommends to use `fetch` API for rest [whatwg-fetch](https://www.npmjs.com/package/whatwg-fetch)
- **fetch** - rest backend. Redux-api recommends to use `fetch` API for rest [whatwg-fetch](https://www.npmjs.com/package/whatwg-fetch)
> *type*: Function
> *default*: null
#### actions
```js
```js
import reduxApi, {transformers} from "redux-api";
const rest = reduxApi({
entries: "/api/v1/entry",
Expand Down Expand Up @@ -115,16 +117,46 @@ store = {
const {dispatch} = this.props;
dispatch(rest.actions.entries()); // GET "/api/v1/entry"
dispatch(rest.actions.entry({id: 1}, {
body: JSON.stringify({ name: 'Hubot', login: 'hubot'
body: JSON.stringify({ name: "Hubot", login: "hubot"
}})); // POST "/api/v1/entry/1" with body

//also available helper methods
dispatch(rest.actions.entries.reset()) // set initialState to store
dispatch(rest.actions.entries.sync()) // this mathod save you from twice requests
// flag `sync`. if `sync===true` requst
// flag `sync`. if `sync===true` requst
// wouldnt execute
```
#### reducerName
Sometimes though, you might want named actions that go back to the same reducer. For example:
```js
import reduxApi, {transformers} from "redux-api";
const rest = reduxApi({
getUser: {
reducerName: "user"
url: "/user/1", // return a user object
}
updateUser: {
reducerName: "user"
url: "/user/1/update",
options: {
method: "post"
}
}
});
const {actions} = rest;

// In component with redux support (see example section)
const {dispatch} = this.props;
dispatch(rest.actions.getUser()); // GET "/api/v1/entry"
dispatch(rest.actions.updateUser({}, {
body: JSON.stringify({ name: "Hubot", login: "hubot"})
})); // POST "/api/v1/entry/1" with body

```
In the above example, both getUser, and updateUser update the same user reducer as they share the same reducerName
For example used es7 javascript, [Redux@1.0.0-rc](https://github.com/gaearon/redux/tree/v1.0.0-rc), but it's pretty simple to migrate this code to [Redux@v0.12.0](https://github.com/gaearon/redux/tree/v0.12.0)
###Example
Expand Down Expand Up @@ -174,11 +206,11 @@ class Application {
// fetch `/api/v1/regions
dispatch(rest.actions.regions.sync());
//specify id for GET: /api/v1/entry/1
dispatch(rest.actions.entry({id: 1}));
dispatch(rest.actions.entry({id: 1}));
}
render() {
const {entry, regions} = this.props;
const Regions = regions.data.map((item)=> <p>{ item.name }</p>)
const Regions = regions.data.map((item)=> <p>{ item.name }</p>)
return (
<div>
Loading regions: { regions.loading }
Expand All @@ -197,3 +229,5 @@ React.render(
document.getElementById("content")
);
```
### [Releases Changelog](https://github.com/lexich/redux-api/releases)
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "redux-api",
"version": "0.0.4",
"version": "0.1.0",
"main": "dist/redux-api.min.js",
"dependencies": {}
}
Loading

0 comments on commit f10d879

Please sign in to comment.