Running the App in the Browser about fullstack-graphql HOT 13 OPEN

I had this issue too. When Scott says make sure you are in client branch before running the project he is referring to the git branch and not the project folder. When you run these videos on a faster speed like I do its easy to miss something like that. For me a simple git checkout client (check the VSCODE UI bottom left has changed or a git branch to see if it was correctly changed over)

from fullstack-graphql.

If you are on video https://frontendmasters.com/courses/client-graphql-react/apollo-client-api-querying/, then you'll need to run these commands from your terminal:

git checkout origin/client
yarn
yarn app

Then open the browser on http://localhost:1234/ and get coding.

from fullstack-graphql.

I am facing the same issue,
I checked out to client branch first, then ran command npm install
after that, I ran npm run app
But I am geeting error, Someone help
The error is as follows -

[email protected] app /home/lonewolf/Desktop/fullstack-graphql
parcel client/index.html --out-dir client/dist

Server running at http://localhost:1234
🚨 /home/lonewolf/Desktop/fullstack-graphql/client/src/index.js: Invalid Version: undefined
at new SemVer (/home/lonewolf/Desktop/fullstack-graphql/node_modules/@babel/preset-env/node_modules/semver/semver.js:314:11)
at compare (/home/lonewolf/Desktop/fullstack-graphql/node_modules/@babel/preset-env/node_modules/semver/semver.js:647:10)
at lt (/home/lonewolf/Desktop/fullstack-graphql/node_modules/@babel/preset-env/node_modules/semver/semver.js:688:10)
at /home/lonewolf/Desktop/fullstack-graphql/node_modules/@babel/preset-env/lib/index.js:274:22
at Object.default (/home/lonewolf/Desktop/fullstack-graphql/node_modules/@babel/helper-plugin-utils/lib/index.js:22:12)
at getEnvPlugins (/home/lonewolf/Desktop/fullstack-graphql/node_modules/parcel/src/transforms/babel/env.js:62:34)
at getEnvConfig (/home/lonewolf/Desktop/fullstack-graphql/node_modules/parcel/src/transforms/babel/env.js:12:25)
at async getBabelConfig (/home/lonewolf/Desktop/fullstack-graphql/node_modules/parcel/src/transforms/babel/config.js:32:19)
at async babelTransform (/home/lonewolf/Desktop/fullstack-graphql/node_modules/parcel/src/transforms/babel/transform.js:6:16)
at async JSAsset.pretransform (/home/lonewolf/Desktop/fullstack-graphql/node_modules/parcel/src/assets/JSAsset.js:83:5)

from fullstack-graphql.

I tried various things but the one that worked for me was:

Start from a fresh origin/client
npm i -D [email protected]
npm i
npm run app

from fullstack-graphql.

@williamrjribeiro's solution didn't quite work for me, I had to add a npm install - otherwise I got errors from yarn about not being able to locate a bindings file.

git checkout origin/client
yarn
npm install
yarn app

from fullstack-graphql.

I faced with same your problem. I solved it by cloning the codes from client branch. But the server is not work, I'm trying to find why

from fullstack-graphql.

I have just solved the problem in which the server does not work by using code in solution branch.

from fullstack-graphql.

I'm facing the exact same problem even if i'm on the client branch... white browser window.
I'll try to clone (i forked)

I tried: same issue... :/

from fullstack-graphql.

@kaboumk Same issue here. Tried almost everything, including installing via npm and yarn, and being on the client branch. Still not working.

from fullstack-graphql.

It worked!! Go to the client branch, before you install any dependencies.

from fullstack-graphql.

If you are facing the problem like me , I have solved my problem with this:
Kinldy update your package.json file as mine below, After that I was able to successfully run the client build

{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"@apollo/react-hooks": "^3.1.2",
"apollo-cache-inmemory": "^1.6.3",
"apollo-client": "^2.6.4",
"apollo-link": "^1.2.13",
"apollo-link-context": "^1.0.19",
"apollo-link-http": "^1.5.16",
"apollo-server": "^2.9.6",
"babel-plugin-emotion": "^10.0.21",
"flexboxgrid": "^6.3.1",
"graphql": "^14.5.8",
"graphql-tag": "^2.10.1",
"json5": "^2.1.0",
"lowdb": "^1.0.0",
"nanoid": "^2.1.1",
"react": "^16.10.1",
"react-dom": "^16.10.1",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"react-select": "^3.0.8",
"react-spinners": "^0.6.1"
},
"scripts": {
"server": "node api/src/server.js",
"app": "parcel client/index.html",
"test-server": "jest api/tests"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@babel/core": "^7.14.0",
"@babel/preset-react": "^7.13.13",
"@playlyfe/gql": "^2.6.2",
"@types/react": "^16.14.6",
"babel-core": "^6.26.3",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"jest": "^24.9.0",
"parcel": "^2.0.0-beta.2"
}
}

from fullstack-graphql.

I am currently working on windows. I was using node v.18 and when I tried to run 'npm i' there was an error with Python. 'npm ERR! gyp ERR! find Python' . The solution was to install python according the documentation and run npm install again. After that everything works fine. Also saw link https://nodejs.org/en/docs/meta/topics/dependencies/ . In gyp section there is python dependency.. Good luck

from fullstack-graphql.

@williamrjribeiro's solution didn't quite work for me, I had to add a npm install - otherwise I got errors from yarn about not being able to locate a bindings file.

git checkout origin/client
yarn
npm install
yarn app

@SimonPringleWallace your solution worked for me, thanks for posting it!

from fullstack-graphql.