Repository navigation
Running the App in the Browser #5
Description
So far-
Forked and cloned the App. Set it up through zsh terminal. Went into VS Code.
Tried running Yarn on the project. Yarn lock existed. SO eventually deleted lock. Then ran Yarn again. Got node modules and new yarn lock. Then Yarn app. Received Localhost:1234 running. Nothing showed on browser. cd into client and tried tried again on new port. still nothing. Either I'm doing something wrong. I'm studying the follow along, file structure looks right. Hmm Help
Activity
nvdai2401 commentedon Jan 15, 2020
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
nvdai2401 commentedon Jan 15, 2020
I have just solved the problem in which the server does not work by using code in solution branch.
DermotBoyle commentedon Apr 23, 2020
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)
kaboumk commentedon Feb 5, 2021
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... :/
prnvbirajdar commentedon May 6, 2021
@kaboumk Same issue here. Tried almost everything, including installing via npm and yarn, and being on the client branch. Still not working.
prnvbirajdar commentedon May 6, 2021
It worked!! Go to the client branch, before you install any dependencies.
karansinghnegi commentedon May 9, 2021
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 -
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)
karansinghnegi commentedon May 11, 2021
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"
}
}
williamrjribeiro commentedon Sep 7, 2021
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:Then open the browser on http://localhost:1234/ and get coding.
SimonPringleWallace commentedon Jan 5, 2022
@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.auesugui commentedon Feb 26, 2022
I tried various things but the one that worked for me was:
Start from a fresh origin/clientnpm i -D parcel-bundler@1.12.3npm inpm run appNikolovS commentedon Oct 26, 2022
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
jalexakos commentedon Jan 20, 2023
@SimonPringleWallace your solution worked for me, thanks for posting it!