-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
e8373b6
commit 16fb07d
Showing
6 changed files
with
196 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import { createStore } from "redux"; | ||
|
||
const reducer = (initialState=0, action) => { | ||
if (action.type === "INC") { | ||
return initialState + 1; | ||
} else if (action.type === "DEC") { | ||
return initialState - 1; | ||
} | ||
return initialState; | ||
} | ||
|
||
const store = createStore(reducer, 1) | ||
|
||
store.subscribe(() => { | ||
console.log("store changed", store.getState()); | ||
}) | ||
|
||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "DEC"}) | ||
store.dispatch({type: "DEC"}) | ||
store.dispatch({type: "DEC"}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
import { combineReducers, createStore } from "redux"; | ||
|
||
// I would live in a separate file | ||
const userReducer = (state={}, action) => { | ||
switch(action.type) { | ||
case "SET_NAME": { | ||
return {...state, name: action.payload}; | ||
break; | ||
} | ||
case "SET_AGE": { | ||
return {...state, age: action.payload}; | ||
break; | ||
} | ||
} | ||
return state; | ||
} | ||
|
||
// I would live in a separate file | ||
const tweetsReducer = (state=[], action) => { | ||
switch(action.type) { | ||
case "ADD_TWEET": { | ||
return state.concat({ | ||
id: Date.now(), //fake an ID by using a timestamp | ||
text: action.payload, | ||
}); | ||
break; | ||
} | ||
} | ||
return state; | ||
} | ||
|
||
const reducers = combineReducers({ | ||
user: userReducer, | ||
tweets: tweetsReducer | ||
}) | ||
|
||
const store = createStore(reducers) | ||
|
||
store.subscribe(() => { | ||
console.log("store changed", store.getState()); | ||
}) | ||
|
||
store.dispatch({type: "SET_NAME", payload: "Will"}) | ||
store.dispatch({type: "SET_AGE", payload: 35}) | ||
store.dispatch({type: "SET_AGE", payload: 34}) | ||
store.dispatch({type: "ADD_TWEET", payload: "OMG LIKE LOL"}) | ||
store.dispatch({type: "ADD_TWEET", payload: "I am so like seriously like totally like right now"}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
import { applyMiddleware, createStore } from "redux"; | ||
|
||
const reducer = (initialState=0, action) => { | ||
if (action.type === "INC") { | ||
return initialState + 1; | ||
} else if (action.type === "DEC") { | ||
return initialState - 1; | ||
} else if (action.type === "MULT") { | ||
throw new Error("AHHHH!!"); | ||
} | ||
return initialState; | ||
} | ||
|
||
const logger = (store) => (next) => (action) => { | ||
console.log("Logged", action); | ||
return next(action); | ||
}; | ||
|
||
|
||
const errorHandler = (store) => (next) => (action) => { | ||
try { | ||
return next(action); | ||
} catch(e) { | ||
console.log("ERROR!", e); | ||
} | ||
}; | ||
|
||
const middleware = applyMiddleware( | ||
logger, | ||
errorHandler | ||
) | ||
const store = createStore(reducer, middleware) | ||
|
||
store.subscribe(() => { | ||
console.log("store changed", store.getState()); | ||
}) | ||
|
||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "INC"}) | ||
store.dispatch({type: "DEC"}) | ||
store.dispatch({type: "DEC"}) | ||
store.dispatch({type: "DEC"}) | ||
store.dispatch({type: "MULT"}) | ||
store.dispatch({type: "DEC"}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
import { applyMiddleware, createStore } from "redux"; | ||
import axios from "axios"; | ||
import logger from "redux-logger"; | ||
import thunk from "redux-thunk"; | ||
import promise from "redux-promise-middleware"; | ||
|
||
const initialState = { | ||
fetching: false, | ||
fetched: false, | ||
users: [], | ||
error: null, | ||
}; | ||
|
||
const reducer = (state=initialState, action) => { | ||
switch (action.type) { | ||
case "FETCH_USERS_PENDING": { | ||
return {...state, fetching: true} | ||
break; | ||
} | ||
case "FETCH_USERS_REJECTED": { | ||
return {...state, fetching: false, error: action.payload} | ||
break; | ||
} | ||
case "FETCH_USERS_ FULFILLED": { | ||
return { | ||
...state, | ||
fetching: false, | ||
fetched: true, | ||
users: action.payload, | ||
} | ||
break; | ||
} | ||
} | ||
return state | ||
} | ||
|
||
const middleware = applyMiddleware(promise(), thunk, logger()) | ||
const store = createStore(reducer, middleware) | ||
|
||
store.dispatch({ | ||
type: "FETCH_USERS", | ||
payload: axios.get("http://rest.learncode.academy/api/wstern/users") | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,35 +1,43 @@ | ||
import { combineReducers, createStore } from "redux"; | ||
import { applyMiddleware, createStore } from "redux"; | ||
import axios from "axios"; | ||
import logger from "redux-logger"; | ||
import thunk from "redux-thunk"; | ||
import promise from "redux-promise-middleware"; | ||
|
||
const userReducer = (state={}, action) => { | ||
switch(action.type) { | ||
case "CHANGE_NAME": { | ||
state = {...state, name: action.payload} | ||
const initialState = { | ||
fetching: false, | ||
fetched: false, | ||
users: [], | ||
error: null, | ||
}; | ||
|
||
const reducer = (state=initialState, action) => { | ||
switch (action.type) { | ||
case "FETCH_USERS_PENDING": { | ||
return {...state, fetching: true} | ||
break; | ||
} | ||
case "FETCH_USERS_REJECTED": { | ||
return {...state, fetching: false, error: action.payload} | ||
break; | ||
} | ||
case "CHANGE_AGE": { | ||
state = {...state, age: action.payload} | ||
case "FETCH_USERS_FULFILLED": { | ||
return { | ||
...state, | ||
fetching: false, | ||
fetched: true, | ||
users: action.payload, | ||
} | ||
break; | ||
} | ||
} | ||
return state; | ||
}; | ||
return state | ||
} | ||
|
||
const tweetsReducer = (state=[], action) => { | ||
return state; | ||
}; | ||
const middleware = applyMiddleware(promise(), thunk, logger()) | ||
const store = createStore(reducer, middleware) | ||
|
||
const reducers = combineReducers({ | ||
user: userReducer, | ||
tweets: tweetsReducer, | ||
store.dispatch({ | ||
type: "FETCH_USERS", | ||
payload: axios.get("http://rest.learncode.academy/api/wstern/users") | ||
}) | ||
|
||
const store = createStore(reducers); | ||
|
||
store.subscribe(() => { | ||
console.log("store changed", store.getState()) | ||
}) | ||
|
||
store.dispatch({type: "CHANGE_NAME", payload: "Will"}) | ||
store.dispatch({type: "CHANGE_AGE", payload: 35}) | ||
store.dispatch({type: "CHANGE_AGE", payload: 36}) | ||
|