0

This is a simple calculator app that is supposed to save all calculations made as strings, and all users with the calculator's site open would be updated with the new calculations anyone makes on the site.

I am trying to deploy a project using React, MySQL db, and JawsDB on Heroku, but after following the Heroku/Jaws deployment instructions that we used on our Note Taker assignment, my db connection is not working. I am getting the errors: "TypeError: Failed to fetch", and "GET http://..... net ERR_CONNECTION REFUSED"

Would greatly appreciate any help you can offer.

error messages in console

Repo: https://github.com/AndrewCodesDontYaKnow/ReactCalc

URL: https://lit-reaches-09190.herokuapp.com/

RangerRanger
  • 2,455
  • 2
  • 16
  • 36
Andrew Smith
  • 483
  • 1
  • 3
  • 16

1 Answers1

0

The error is that you use port 4000 in your build folder for your database server. In online website it doesn't recognize it, and also port 3306
So, No problem in your server.js, but in App.js you have to replace all:

"http://localhost:3306/"

with just:

"/"

So it will be:

...
fetch("/calculations")
...
fetch(`/calculations/add?calc=${calculationArray[calculationArray.length - 1]}`)
...
fetch(`/clear/`)
...

By this way you will run the database server on the same port of the react js app.

Then you must run npm run build to create build folder, that will be deployed to heroku.

OR
simply, in build folder you can replace all:

"http://localhost:4000/"

with:

"/"

Something else: You don't have to upload node_modules folder to github to deploy your app. Heroku will not need it.
You use git, so you should rename .gitignore.txt to only .gitignore without any format extension, and write:

node_modules

in it, to ignore this folder in git push

Amr Eraky
  • 1,423
  • 7
  • 13
  • Thanks a bunch. I have made those changes and am trying to push to Heroku but am on a new error: ! [remote rejected] HEAD -> master (pre-receive hook declined) heroku error – Andrew Smith Nov 10 '20 at 19:54