I'm trying to deploy a 'create-react-app' project to Heroku. I used the Heroku Create-React-App boilerplate and followed another tutorial on setting up a backend api for connecting to my custom server.js
file.
When I deploy to Heroku, the build runs fine but my app still will not connect to my server.js
file.
I assume this is either because the proxy
property in my package.json
is supposed to point to the same port defined in my server.js
file (which Heroku would assign automatically, which I don't know how to check) or perhaps my server.js
file isn't running at all.
Been having a very hard time finding any resources that properly explain how to deploy a 'create-react-app' with a custom back-end (server.js).
package.json:
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"proxy": "https://localhost:5000",
"dependencies": {
"axios": "^0.17.1",
"body-parser": "^1.18.2",
"md5": "^2.2.1",
"mongodb": "^3.0.2",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-scripts": "1.1.1",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2"
},
"scripts": {
"start": "react-scripts start",
"start:server":"node server.js",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Line in server.js
where I set the port:
const port = process.env.PORT || 5000;
I was able to deploy my app to Heroku by following this tutorial from fullstackreact.com and studying the accompanying repo.
Basically, I needed to bundle my client-side code and then make sure my server.js file was serving that bundle as a static file. I'm sure there's other ways to go about this, like running concurrent scripts for the webpack-dev-server and the backend api (server.js), but this worked for me without much headaches.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.