import { Router, Route, IndexRoute, browserHistory } from 'react-router'
const router = (
<Router history={browserHistory}>
<Route path='/' component={Main}>
<IndexRoute component={} \/>
<Route path='/view/:postId' \/>
<\/Route>
<\/Router>
)
render(router, document.getElementById('root'))
One giant state for all data
import { createStore, compose } from 'redux'
import { syncHistoryWithStore } from 'react-router-redux'
import { browserHistory } from 'react-router'
import rootReducer from './reducers/index'
const store = createStore(rootReducer, defaultState)
export const history = syncHistoryWithStore(browserHistory, store)
export default store
action creators are functions which return actions:
function increment(index) {
return {
type: 'INCREMENT_LIKES',
index,
}
}
function addComment(postId, author, comment) {
return {
type: 'ADD_COMMENT',
postId,
author,
comment
}
}
reducers return the updated state
function posts(state = [], action) {
return state
}
export default posts
combine them in a root reducer
import { combineReducers } from 'redux'
import { routerReducer } from 'react-router-redux'
import posts from './posts'
const rootReducer = combineReducers({ posts, router: routerReducer })
export default rootReducer