danielstern / redux-saga-cart Goto Github PK
View Code? Open in Web Editor NEWA fully-functional shopping cart built with Redux Saga using Yield - Run with accompanying server https://github.com/danielstern/redux-saga-shopping-cart-server
A fully-functional shopping cart built with Redux Saga using Yield - Run with accompanying server https://github.com/danielstern/redux-saga-shopping-cart-server
In the itemDetailsSaga following code is written in the course:
export function* itemDetailsSaga() {
const { items } = yield take(SET_CART_ITEMS)
yield items.map((item) => fork(loadItemDetails, item))
}
However this does not set each individual item into the loadItemDetails function. Instead following method works:
Yield all
export function* itemDetailsSaga() {
const { items } = yield take(SET_CART_ITEMS)
yield all(items.map((item) => fork(loadItemDetails, item)))
}
Getting this error when running npm start command
babel-node not recognized as internal or external command
I'm watching your pluralsight videos on 2020 and when you're creating the first app saga you are importing delay like this:
import { delay } from 'redux-saga';
but you should import like this:
import { delay } from 'redux-saga/effects';
I hope it helps!
I get this error when i try to npm install
After solving heaps of broken dependencies, finally the Begin branch showed something different.
Here is the error message:
Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.
F:\temp\Playground\redux\redux-saga-cart\node_modules\core-js\library\fn\json\stringify.js:4
return $JSON.stringify.apply($JSON, arguments);
^TypeError: Converting circular structure to JSON
at Object.stringify ()
at stringify (F:\temp\Playground\redux\redux-saga-cart\node_modules\core-js\library\fn\json\stringify.js:4:26)
at compile (F:\temp\Playground\redux\redux-saga-cart\node_modules\babel-cli\node_modules\babel-register\lib\node.js:105:42)
at loader (F:\temp\Playground\redux\redux-saga-cart\node_modules\babel-cli\node_modules\babel-register\lib\node.js:144:14)
at Object.require.extensions.(anonymous function) [as .js] (F:\temp\Playground\redux\redux-saga-cart\node_modules\babel-cli\node_modules\babel-register\lib\node.js:154:7)
at Module.load (internal/modules/cjs/loader.js:630:32)
at tryModuleLoad (internal/modules/cjs/loader.js:570:12)
at Function.Module._load (internal/modules/cjs/loader.js:562:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:801:12)
at Object. (F:\temp\Playground\redux\redux-saga-cart\node_modules\babel-cli\lib_babel-node.js:154:22)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start:babel-node server/server.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\franv_000\AppData\Roaming\npm-cache_logs\2019-03-09T05_33_55_873Z-debug.log
Here is my package.json
As you can see here, I removed or ^ and added missing packages.
{
"name": "react-redux-starter",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "jest",
"start": "babel-node server/server.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel": "^6.23.0",
"babel-cli": "^6.26.0",
"babel-core": "6.18.2",
"babel-loader": "6.2.8",
"babel-preset-react": "6.23.0",
"babel-regenerator-runtime": "6.5.0",
"chance": "1.0.6",
"classnames": "2.2.5",
"cors": "2.8.3",
"express": "4.15.3",
"immutable": "3.8.1",
"isomorphic-fetch": "2.2.1",
"lodash": "4.17.4",
"query-string": "4.3.4",
"react": "15.5.4",
"react-dom": "15.4.2",
"react-redux": "5.0.5",
"redux": "3.6.0",
"redux-logger": "3.0.6",
"redux-saga": "0.15.5",
"redux-thunk": "2.2.0",
"reselect": "2.5.4",
"socket.io": "2.0.3",
"webpack": "1.13.3",
"webpack-dev-middleware": "1.10.1",
"webpack-hot-middleware": "2.17.1"
},
"devDependencies": {
"babel-plugin-transform-object-rest-spread": "^6.19.0",
"babel-plugin-transform-regenerator": "^6.26.0",
"babel-preset-es2015": "^6.18.0",
"chai": "4.0.2",
"jest": "20.0.4",
"mocha": "3.4.2",
"redux-devtools": "3.4.0",
"redux-tool": "1.0.0",
"webpack-dev-server": "1.16.5"
}
}
Please help.
Just wanted to create an issue for discoverability in case anyone else makes this mistake. If you follow the course instructions, you may run:
npm install redux-saga ---save
or
yarn add redux-saga --save
If you do this as of today, you'll install redux-saga
1.x
You need to ensure you install specifically 0.15.3
as shown in the course unless you want to update all the code examples to work with the new changes in 1.x (which contains breaking changes).
npm install redux-saga@^0.15.3 ---save
or
yarn add redux-saga@^0.15.3 --save
An enterprising learner could do this but I wanted to call it out just in case you're stuck wondering why the code doesn't work ๐
Thanks @danielstern!
Today i'm started with that course, and npm start
fails all the time, even when i checked node version and installed all packaged with sudo command. Only when i add babel-cli
, it's successfully launched, just for your information, maybe it will save someones time
After run npm install
command I got a warning in the command line:
> [email protected] install /var/www/development/redux-saga/redux-saga-cart/node_modules/uws
> node-gyp rebuild > build_log.txt 2>&1 || exit 0
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
added 755 packages from 768 contributors and audited 32 packages in 14.881s
found 2 vulnerabilities (1 low, 1 high)
run `npm audit fix` to fix them, or `npm audit` for details
withing package.json file
The command npm audit fix
doesn't fix the problem due to some dependencies need to be fixed withing package.json file!
Got a question: why babel CLI isn't added as a required package? It may be loaded from node_modules
directory for the npm start
command. No everyone uses babel, and sometimes it may be used for a few projects, so maybe there's no need to have installed it globally!
First and foremost, great course material. Solid presentation and pace. Thank you. It would be great if the client app install did not rely on the global presence of various packages. Is there a way around this? Thanks in advance for letting me know.
Hello, I am having trouble with net::ERR_CONNECTION_REFUSED while fethich the current user information.
I am pretty sure that I've allowed these ports to be available for communicating to each other but the fetch is failing anyway.
Hi Daniel,
Need Ur advice
first appears in module.6 last practical lesson 9.Checkout Saga
export function* checkout(){
const user = yield select(currentUserSelector)
yield put(setCheckoutPhase(QUANTITY_VERIFICATION_CHECKOUT_PHASE))
....
I'm localize prolem here in currentUserSaga.js,
unfortunatly ReactDev Tools not working at my PC
import { take, put, call, apply, select} from 'redux-saga/effects'
import fetch from 'isomorphic-fetch'
import {
GET_CURRENT_USER_INFO,
setCurrentUser
} from './../actions'
import {
currentUserSelector
} from './../selectors'
export function* currentUserSaga() {
const { id } = yield take(GET_CURRENT_USER_INFO);
const response = yield call(fetch, http://localhost:8081/user/${id}
)
const data = yield apply(response, response.json)
console.info("ID", id)
console.info("Data?", data)
yield put(setCurrentUser(data))
const user = yield select(currentUserSelector)
console.info("Current User?", user)
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.