DEV Community

Step by step React, NodejS and MySQL Simple Full Stack Application 2018 (part: 5)

Maryam Keshavarz on November 25, 2018

In this article I try to solve bugs of project, upload it on Github. probably after running the project you will see nothing on the browser and wi...

Read full post

Xiaohan Du • Apr 6 '20

I think my problem is in here: Then use npm install axios for backend and bower install axios for using axios to frontend commands in terminal to access axios and use it., can you add some explanation of where to install for backend and where to install for frontend, and where to start the servers please?

alivadjid • Apr 7 '20 • Edited

Sorry. I had a problem in this lesson. After add CORS,and modified app.js.
For your problem.
"Then use npm install axios for backend"----- I wrote: npm install axios. At the terminal in vusual studio.
"and bower install axios for using axios to frontend commands in terminal to access axios and use it".------Wrote "bower install axios" at GitBash =) After this command must appeare "bower_components" folder in /express-react/backend/client/src
Try this

Xiaohan Du • Apr 7 '20

Appreciate that. I follow what you said: changed to app.get('/users', function(req, res), installed axios in /express-react/backend/client/src and saw bower_components in /express-react/backend/client/src, but still see the same error: TypeError: Cannot read property 'map' of undefined

alivadjid • Apr 8 '20

Ok. what do you see at localhost: 3001? are there information from your SQL?

Xiaohan Du • Apr 8 '20

At localhost: 3001 I see Express Welcome to Express, and at localhost: 3000 I see TypeError: Cannot read property 'map' of undefined, this happens at axios.get('/users') .then((data) => { console.log(data.data.users); this.setState({ users: data.data.users }); }) .catch(error => console.log(error));

alivadjid • Apr 9 '20

At localhost 3001 you must see data from your SQL database.
Something like this: "{"users":[{"id":1,"username":"Kris","surname": ..."
Can you send github repo for find issue?

Xiaohan Du • Apr 10 '20

Hi alivadjid,
Please see my repo https://github.com/thinkvantagedu/HW10.git
Thank you

Xiaohan Du • Apr 10 '20

If I run node server in directory simple-react-mysql, I can see the data from my SQL database in localhost:3000

alivadjid • Apr 10 '20 • Edited

well, you shoud to restart lesson 4. From position 2 and install all components from lesson.

Xiaohan Du • Mar 31 '20

Hi Maryam, thanks for the tutorial. What does it mean by bower install axios for using axios to frontend commands? I tried bower install axios and it said command not found. If I continue with npm start my React project, it gave the error Cannot read property 'map' of undefined, please help!

alivadjid • Apr 6 '20

Good day!
Try at html-routes.js file change line: app.get('/', function(req, res)
to
app.get('/users', function(req, res)
and then project must work.
I think that connected with express method app.get. Which mounted middleware function on the /users.
And than App.js on client folder refer to it.
If I'm wrong, please correct me =)