mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
2e7bc1074d
* With-Redux-example-update-request Hello Next.js, I’ve added an additional example to “With-Redux” and updated some of the original code to help illustrate to less inexperienced developers how to implement Redux with Next.js. The example is a simple counter to help reinforce how the client and server renderings work together. In addition I also updated some of the redux boilerplate code to help fully demonstrate how redux can be implemented when using is with Next.js Please contact me at spencer.bigum@gmail.com for further questions or anything else you might need. Thanks, Spencer * fixed listing issues: examples/with-redux * Updated code based on @impronunciable Feedback
44 lines
1.1 KiB
JavaScript
44 lines
1.1 KiB
JavaScript
import { createStore, applyMiddleware } from 'redux'
|
|
import thunkMiddleware from 'redux-thunk'
|
|
|
|
const exampleInitialState = {
|
|
lastUpdate: 0,
|
|
light: false,
|
|
count: 0
|
|
}
|
|
|
|
export const actionTypes = {
|
|
ADD: 'ADD',
|
|
TICK: 'TICK'
|
|
}
|
|
|
|
// REDUCERS
|
|
export const reducer = (state = exampleInitialState, action) => {
|
|
switch (action.type) {
|
|
case actionTypes.TICK:
|
|
return Object.assign({}, state, { lastUpdate: action.ts, light: !!action.light })
|
|
case actionTypes.ADD:
|
|
return Object.assign({}, state, {
|
|
count: state.count + 1
|
|
})
|
|
default: return state
|
|
}
|
|
}
|
|
|
|
// ACTIONS
|
|
export const serverRenderClock = (isServer) => dispatch => {
|
|
return dispatch({ type: actionTypes.TICK, light: !isServer, ts: Date.now() })
|
|
}
|
|
|
|
export const startClock = () => dispatch => {
|
|
return setInterval(() => dispatch({ type: 'TICK', light: true, ts: Date.now() }), 800)
|
|
}
|
|
|
|
export const addCount = () => dispatch => {
|
|
return dispatch({ type: actionTypes.ADD })
|
|
}
|
|
|
|
export const initStore = (initialState = exampleInitialState) => {
|
|
return createStore(reducer, initialState, applyMiddleware(thunkMiddleware))
|
|
}
|