I made a react application that works with a prisma - graphql server. The server is located inside the react application. I want to deploy it with Heroku (first time ever using it). When I deploy to Heroku I get this error when I run heroku logs --tail
020-06-12T14:10:04.296156+00:00 heroku[web.1]: Process exited with status 0
2020-06-12T14:10:04.332716+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-12T14:10:04.335407+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-12T14:10:15.424387+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-12T14:10:17.947363+00:00 app[web.1]:
2020-06-12T14:10:17.947379+00:00 app[web.1]: > business-scheduler#0.1.0 start /app
2020-06-12T14:10:17.947379+00:00 app[web.1]: > react-scripts start
2020-06-12T14:10:17.947379+00:00 app[web.1]:
2020-06-12T14:10:20.724920+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.19.52.78/
2020-06-12T14:10:20.725386+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-12T14:10:20.725577+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-12T14:10:20.725681+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-12T14:10:20.725971+00:00 app[web.1]: Starting the development server...
2020-06-12T14:10:20.725972+00:00 app[web.1]:
2020-06-12T14:10:20.803624+00:00 heroku[web.1]: Process exited with status 0
2020-06-12T14:10:20.835709+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-12T14:27:07.241917+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=appoint-scheduler.herokuapp.com request_id=4a6d7846-488a-4a57-bd76-ee5b84c197fc fwd="94.227.127.41" dyno= connect= service= status=503 bytes= protocol=https
2020-06-12T14:27:07.688859+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=appoint-scheduler.herokuapp.com request_id=83928da3-bc4a-44f5-83fb-66a7c5b2611d fwd="94.227.127.41" dyno= connect= service= status=503 bytes= protocol=https
I am using yarn not npm on my project does anyone know what I need to do to be able to deploy my project?
Because my project is not running on heroku because I get this when trying to open the deployed version
Application error
An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details. You can do this from the Heroku CLI with the command
heroku logs --tail
I think the issue is that you're trying to start the react development server on heroku. Your react app should be served as a static js bundle which is generated after you run the production build cmd npm run build.
Have a look at https://github.com/mars/create-react-app-buildpack which is developed for this usecase only and makes it much easier.
If you're trying to deploy the whole stack ( react + prisma + graphql server )...take a look at this post which covers it in detail.
Hope this helps !
Related
I just learnt Typescript and tried to push it to Heroku to run online. However, I got this problem. Can anyone help me what is wrong with the configuration? I already have a Profile with web: npm start.
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"#types/jest": "^24.9.1",
"#types/node": "^12.12.54",
"#types/react": "^16.9.46",
"#types/react-dom": "^16.9.8",
"#types/styled-components": "^5.1.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"styled-components": "^5.1.1",
"typescript": "^3.7.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
When I tried to run it on heroku, these error shows up. Can anyone help me point out where I get wrong on the code? Thank you.
2020-08-20T02:04:52.768419+00:00 app[api]: Initial release by user kevxxxxx
2020-08-20T02:04:52.768419+00:00 app[api]: Release v1 created by user kevkxxxxx
2020-08-20T02:04:52.863227+00:00 app[api]: Enable Logplex by user kevkwxxxx
2020-08-20T02:04:52.863227+00:00 app[api]: Release v2 created by user kevkwxxxx
2020-08-20T02:05:02.000000+00:00 app[api]: Build started by user kevkwxxxx
2020-08-20T02:06:24.621179+00:00 app[api]: Release v3 created by user kevkwxxxx
2020-08-20T02:06:24.621179+00:00 app[api]: Deploy b542e4e6 by user kevkwxxxx
2020-08-20T02:06:24.637255+00:00 app[api]: Scaled to web#1:Free by user kevkwxxxx
2020-08-20T02:06:33.000000+00:00 app[api]: Build succeeded
2020-08-20T02:06:33.778274+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-20T02:06:37.345544+00:00 app[web.1]:
2020-08-20T02:06:37.345569+00:00 app[web.1]: > my-app#0.1.0 start /app
2020-08-20T02:06:37.345570+00:00 app[web.1]: > react-scripts start
2020-08-20T02:06:37.345570+00:00 app[web.1]:
2020-08-20T02:06:40.190225+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.16.1.122/
2020-08-20T02:06:40.190782+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-08-20T02:06:40.190901+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-08-20T02:06:40.191007+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-08-20T02:06:40.191239+00:00 app[web.1]: Starting the development server...
2020-08-20T02:06:40.191239+00:00 app[web.1]:
2020-08-20T02:06:40.320581+00:00 heroku[web.1]: Process exited with status 0
2020-08-20T02:06:40.357851+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-20T02:06:40.361139+00:00 heroku[web.1]: State changed from crashed to starting
2020-08-20T02:06:48.334774+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-20T02:06:50.949971+00:00 app[web.1]:
2020-08-20T02:06:50.949997+00:00 app[web.1]: > my-app#0.1.0 start /app
2020-08-20T02:06:50.949997+00:00 app[web.1]: > react-scripts start
2020-08-20T02:06:50.949998+00:00 app[web.1]:
2020-08-20T02:06:53.410228+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.19.104.146/
2020-08-20T02:06:53.410751+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-08-20T02:06:53.410902+00:00 app[web.1]: ℹ ��wds｣: Content not from webpack is served from /app/public
2020-08-20T02:06:53.411003+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-08-20T02:06:53.411229+00:00 app[web.1]: Starting the development server...
2020-08-20T02:06:53.411231+00:00 app[web.1]:
2020-08-20T02:06:53.535298+00:00 heroku[web.1]: Process exited with status 0
2020-08-20T02:06:53.573752+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-20T02:06:54.608604+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=guarded-depths-86821.herokuapp.com request_id=a715a5b6-5ebd-46a1-bc83-e5af1a8adf93 fwd="98.252.127.199" dyno= connect= service= status=503 bytes= protocol=https
2020-08-20T02:06:55.888464+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=guarded-depths-86821.herokuapp.com request_id=1c2e5980-a5b3-4a14-93b5-76ab3a8a4e1f fwd="98.252.127.199" dyno= connect= service= status=503 bytes= protocol=https
2020-08-20T02:15:00.000000+00:00 app[api]: Build started by user kevkwoxxxxx
2020-08-20T02:16:25.020488+00:00 app[api]: Deploy 96a06fc7 by user kevkwoxxxx
2020-08-20T02:16:25.020488+00:00 app[api]: Release v4 created by user kevkwxxxx
2020-08-20T02:16:25.756806+00:00 heroku[web.1]: State changed from crashed to starting
2020-08-20T02:16:33.000000+00:00 app[api]: Build succeeded
2020-08-20T02:16:38.637718+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-20T02:16:44.452152+00:00 app[web.1]:
2020-08-20T02:16:44.452164+00:00 app[web.1]: > my-app#0.1.0 start /app
2020-08-20T02:16:44.452164+00:00 app[web.1]: > react-scripts start
2020-08-20T02:16:44.452164+00:00 app[web.1]:
2020-08-20T02:16:46.910272+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.19.70.186/
2020-08-20T02:16:46.910678+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-08-20T02:16:46.910753+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-08-20T02:16:46.910818+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-08-20T02:16:46.910981+00:00 app[web.1]: Starting the development server...
2020-08-20T02:16:46.910981+00:00 app[web.1]:
2020-08-20T02:16:47.027054+00:00 heroku[web.1]: Process exited with status 0
2020-08-20T02:16:47.064473+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-20T02:16:49.868294+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=guarded-depths-86821.herokuapp.com request_id=2fa4ba33-25e5-4954-96c1-0ae870df9733 fwd="98.252.127.199" dyno= connect= service= status=503 bytes= protocol=https
2020-08-20T02:18:16.488972+00:00 heroku[web.1]: State changed from crashed to starting
2020-08-20T02:18:25.931282+00:00 heroku[web.1]: Starting process with command `npm start`
2020-08-20T02:18:29.027258+00:00 app[web.1]:
2020-08-20T02:18:29.027291+00:00 app[web.1]: > my-app#0.1.0 start /app
2020-08-20T02:18:29.027292+00:00 app[web.1]: > react-scripts start
2020-08-20T02:18:29.027292+00:00 app[web.1]:
2020-08-20T02:18:32.269220+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.17.23.86/
2020-08-20T02:18:32.269587+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-08-20T02:18:32.269687+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-08-20T02:18:32.269808+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-08-20T02:18:32.270062+00:00 app[web.1]: Starting the development server...
2020-08-20T02:18:32.270063+00:00 app[web.1]:
2020-08-20T02:18:32.371853+00:00 heroku[web.1]: Process exited with status 0
2020-08-20T02:18:32.411618+00:00 heroku[web.1]: State changed from starting to crashed
2020-08-20T02:18:49.691244+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=guarded-depths-86821.herokuapp.com request_id=b04d3419-ee10-4063-865f-d34ed4aee58e fwd="98.252.127.199" dyno= connect= service= status=503 bytes= protocol=https
You are using Webpack dev server. That server is not production ready and has a lot of different confiurations.
In simple words, in React, you use npm start to launch your app on your dev server. If you want to host your app, then you first build the artifacts by running npm run build which will generate all the artifacts in the dist folder in your application. Then, you take the contents from the dist directory and deploy it on a server.
To deploy it anywhere, you will need a server to host your files. Heroku, however has automated some of the deployment process for hosting apps.
Check this blog published by the Heroku team which shows how you can deploy the application with ZERO config.
2020-07-21T14:16:10.473788+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=reacthelloworld.herokuapp.com request_id=e53b2e2b-48a5-4251-844a-ebb4c202cad7 fwd="65.92.155.165" dyno= connect= service= status=503 bytes= protocol=https
2020-07-21T14:16:13.905886+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=reacthelloworld.herokuapp.com request_id=6a6143e4-0d01-4127-981e-b1652f909441 fwd="65.92.155.165" dyno= connect= service= status=503 bytes= protocol=https
The build folder is ready to be deployed.
You may serve it with a static server:
npm install -g serve
serve -s build
Find out more about deployment here:
bit.ly/CRA-deploy
-----> Caching build
- node_modules
-----> Pruning devDependencies
audited 1646 packages in 12.038s
62 packages are looking for funding
run `npm fund` for details
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
Build succeeded!
-- Discovering process types
Procfile declares types -> (none)
Default types for buildpack -> web
Compressing...
Done: 59.7M
-- Launching...
Released v3
https://reacthelloworld.herokuapp.com/ deployed to Heroku
I know it could be few things all over but I think heroku is not recognizing the path, I did deployed apps before but had to change the computer and re install node all over, at this point need an advice please
I think you are trying to host your React app on Heroku.
If that's the case, you can build React locally and upload static files to Heroku (this can help).
Or if you are trying to host your Node.js app which has React frontend, you should build the React app first and upload the Node.js app with it to Heroku. Heroku provides Node.js environment.
EDIT:
It turns out that npm/yarn was the issue.
Using yarn resolves the error.
i created an application with React.Js which fetches data using API. But when i tried deploying it over Heroku platform, it gave me error : Application Error
I have executed the steps specified on the heroku website, it is as follows:
Install the Heroku CLI
Download and install the Heroku CLI.
If you haven't already, log in to your Heroku account and follow the prompts to create a new SSH public key.
$ heroku login
Clone the repository
Use Git to clone app's source code to your local machine.
$ heroku git:clone -a app-name
$ cd app-name
Deploy your changes
Make some changes to the code you just cloned and deploy them to Heroku using Git.
$ git add .
$ git commit -am "make it better"
$ git push heroku master
It didn't worked!
Here is the log:
2020-06-22T12:40:27.850239+00:00 app[web.1]: > react-scripts start
2020-06-22T12:40:27.850239+00:00 app[web.1]:
2020-06-22T12:40:34.380682+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.125.90/
2020-06-22T12:40:34.381510+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-22T12:40:34.381685+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-22T12:40:34.381845+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-22T12:40:34.382179+00:00 app[web.1]: Starting the development server...
2020-06-22T12:40:34.382181+00:00 app[web.1]:
2020-06-22T12:40:34.546503+00:00 heroku[web.1]: Process exited with status 0
2020-06-22T12:40:34.619734+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-22T14:12:41.785222+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-22T14:12:52.279485+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-22T14:12:55.303019+00:00 app[web.1]:
2020-06-22T14:12:55.303037+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-22T14:12:55.303038+00:00 app[web.1]: > react-scripts start
2020-06-22T14:12:55.303038+00:00 app[web.1]:
2020-06-22T14:12:58.615357+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.17.197.178/
2020-06-22T14:12:58.616148+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-22T14:12:58.616286+00:00 app[web.1]: ℹ ｢wds��: Content not from webpack is served from /app/public
2020-06-22T14:12:58.616415+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-22T14:12:58.616671+00:00 app[web.1]: Starting the development server...
2020-06-22T14:12:58.616672+00:00 app[web.1]:
2020-06-22T14:12:58.788743+00:00 heroku[web.1]: Process exited with status 0
2020-06-22T14:12:58.845133+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-22T17:03:45.196711+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-22T17:03:58.482038+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-22T17:04:02.420806+00:00 app[web.1]:
2020-06-22T17:04:02.420839+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-22T17:04:02.420839+00:00 app[web.1]: > react-scripts start
2020-06-22T17:04:02.420840+00:00 app[web.1]:
2020-06-22T17:04:09.746354+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.17.93.82/
2020-06-22T17:04:09.746878+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-22T17:04:09.747007+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-22T17:04:09.747116+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-22T17:04:09.747412+00:00 app[web.1]: Starting the development server...
2020-06-22T17:04:09.747413+00:00 app[web.1]:
2020-06-22T17:04:09.999824+00:00 heroku[web.1]: Process exited with status 0
2020-06-22T17:04:10.062284+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-22T22:50:40.650238+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-22T22:50:48.917468+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-22T22:50:51.112063+00:00 app[web.1]:
2020-06-22T22:50:51.112085+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-22T22:50:51.112086+00:00 app[web.1]: > react-scripts start
2020-06-22T22:50:51.112086+00:00 app[web.1]:
2020-06-22T22:50:53.533795+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.140.22/
2020-06-22T22:50:53.534116+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-22T22:50:53.534199+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-22T22:50:53.534267+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-22T22:50:53.534433+00:00 app[web.1]: Starting the development server...
2020-06-22T22:50:53.534434+00:00 app[web.1]:
2020-06-22T22:50:53.615116+00:00 heroku[web.1]: Process exited with status 0
2020-06-22T22:50:53.658116+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-23T04:30:26.154959+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-23T04:30:33.609175+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-23T04:30:35.459308+00:00 app[web.1]:
2020-06-23T04:30:35.459322+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-23T04:30:35.459322+00:00 app[web.1]: > react-scripts start
2020-06-23T04:30:35.459323+00:00 app[web.1]:
2020-06-23T04:30:37.539192+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.16.168.226/
2020-06-23T04:30:37.539532+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-23T04:30:37.539611+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-23T04:30:37.539677+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-23T04:30:37.539842+00:00 app[web.1]: Starting the development server...
2020-06-23T04:30:37.539843+00:00 app[web.1]:
2020-06-23T04:30:37.607952+00:00 heroku[web.1]: Process exited with status 0
2020-06-23T04:30:37.640598+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-23T09:58:58.290664+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-23T09:59:07.251577+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-23T09:59:10.172374+00:00 app[web.1]:
2020-06-23T09:59:10.172390+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-23T09:59:10.172390+00:00 app[web.1]: > react-scripts start
2020-06-23T09:59:10.172390+00:00 app[web.1]:
2020-06-23T09:59:12.250288+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.17.189.230/
2020-06-23T09:59:12.250803+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-23T09:59:12.250906+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-23T09:59:12.251013+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-23T09:59:12.251258+00:00 app[web.1]: Starting the development server...
2020-06-23T09:59:12.251259+00:00 app[web.1]:
2020-06-23T09:59:12.385028+00:00 heroku[web.1]: Process exited with status 0
2020-06-23T09:59:12.442788+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-23T15:35:27.646908+00:00 heroku[web.1]: State changed from crashed to starting
2020-06-23T15:35:36.951718+00:00 heroku[web.1]: Starting process with command `npm start`
2020-06-23T15:35:39.713025+00:00 app[web.1]:
2020-06-23T15:35:39.713071+00:00 app[web.1]: > covidtracker#0.1.0 start /app
2020-06-23T15:35:39.713071+00:00 app[web.1]: > react-scripts start
2020-06-23T15:35:39.713072+00:00 app[web.1]:
2020-06-23T15:35:42.169764+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.13.178/
2020-06-23T15:35:42.170140+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-06-23T15:35:42.170236+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-06-23T15:35:42.170324+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-06-23T15:35:42.170506+00:00 app[web.1]: Starting the development server...
2020-06-23T15:35:42.170510+00:00 app[web.1]:
2020-06-23T15:35:42.247228+00:00 heroku[web.1]: Process exited with status 0
2020-06-23T15:35:42.285901+00:00 heroku[web.1]: State changed from starting to crashed
2020-06-23T16:23:37.027952+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=covid-007.herokuapp.com request_id=9b037027-7e0b-4a10-900e-9f306494d592 fwd="182.66.42.58" dyno= connect= service= status=503 bytes= protocol=https
2020-06-23T16:23:38.306139+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=covid-007.herokuapp.com request_id=db0251b8-ca7d-49d4-8561-f16d5834ab6f fwd="182.66.42.58" dyno= connect= service= status=503 bytes= protocol=https
2020-06-23T17:37:05.660570+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=covid-007.herokuapp.com request_id=a5b567d5-792c-492a-ba30-566590b7f3bf fwd="182.66.43.250" dyno= connect= service= status=503 bytes= protocol=https
2020-06-23T17:37:06.677313+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=covid-007.herokuapp.com request_id=8fa7e49f-d40e-48af-ba0a-db77420f8138 fwd="182.66.43.250" dyno= connect= service= status=503 bytes= protocol=https
2020-06-23T17:42:09.440304+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=covid-007.herokuapp.com request_id=b786c7e4-c4ff-4ce4-bd9c-139651c61845 fwd="182.66.168.226" dyno= connect= service= status=503 bytes= protocol=https
2020-06-23T17:42:10.695333+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=covid-007.herokuapp.com request_id=f16c168d-3bf6-40fe-ba7c-60c9f5b8199e fwd="182.66.168.226" dyno= connect= service= status=503 bytes= protocol=https
Here is my package.json:
{
"name": "covidtracker",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.10.2",
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"axios": "^0.19.2",
"chart.js": "^2.9.3",
"classnames": "^2.2.6",
"react": "^16.13.1",
"react-chartjs-2": "^2.9.0",
"react-countup": "^4.3.3",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Any sort of help would be appreciated as i'm totally clueless!
In Settings change the buildpack to https://github.com/mars/create-react-app-buildpack and then deploy again, this problem will get solved. It worked for me!
I had the same issue. Not sure what's going on behind the scenes but for me it was the react scripts package. After rolling back react-scripts package from 3.4.1 to 3.4.0 it fixed the issue.
Not a duplicate of Application Error when I deploy to heroku as they were missing a file.
Not a duplicate of Heroku Application Error When Deploying to Heroku which was a problem for a Ruby app.
Expected Result
I should be able to see my blog (built with Gatsby) deployed to heroku at its url at http://vllg.herokuapp.com/
Actual Result
The page shows an error which instructs me to check my logs, below is the result.
LOGS
2019-03-13T21:41:28.488417+00:00 app[web.1]: success createPages — 0.066 s
2019-03-13T21:41:28.539587+00:00 app[web.1]: success createPagesStatefully — 0.051 s
2019-03-13T21:41:28.542875+00:00 app[web.1]: success onPreExtractQueries — 0.003 s
2019-03-13T21:41:28.856797+00:00 app[web.1]: success update schema — 0.314 s
2019-03-13T21:41:28.917320+00:00 app[web.1]: warning Using the global `graphql` tag is deprecated, and will not be supported in v3.
2019-03-13T21:41:28.917324+00:00 app[web.1]: Import it instead like: import { graphql } from 'gatsby' in file:
2019-03-13T21:41:28.917326+00:00 app[web.1]: /app/src/pages/blog.js
2019-03-13T21:41:28.999695+00:00 app[web.1]: success extract queries from components — 0.143 s
2019-03-13T21:41:29.155426+00:00 app[web.1]: success run graphql queries — 0.156 s — 10/10 64.94 queries/second
2019-03-13T21:41:29.159995+00:00 app[web.1]: success write out page data — 0.004 s
2019-03-13T21:41:29.160825+00:00 app[web.1]: success write out redirect data — 0.001 s
2019-03-13T21:41:29.362576+00:00 app[web.1]: done generating icons for manifest
2019-03-13T21:41:29.363187+00:00 app[web.1]: success onPostBootstrap — 0.202 s
2019-03-13T21:41:29.363362+00:00 app[web.1]:
2019-03-13T21:41:29.363506+00:00 app[web.1]: info bootstrap finished - 6.089 s
2019-03-13T21:41:29.363561+00:00 app[web.1]:
2019-03-13T21:41:35.474922+00:00 app[web.1]: DONE Compiled successfully in 4713ms9:41:35 PM
2019-03-13T21:41:35.475029+00:00 app[web.1]:
2019-03-13T21:41:35.488519+00:00 app[web.1]:
2019-03-13T21:41:35.488812+00:00 app[web.1]: You can now view vllg in the browser.
2019-03-13T21:41:35.488882+00:00 app[web.1]:
2019-03-13T21:41:35.488935+00:00 app[web.1]: http://localhost:8000/
2019-03-13T21:41:35.489000+00:00 app[web.1]:
2019-03-13T21:41:35.489074+00:00 app[web.1]: View GraphiQL, an in-browser IDE, to explore your site's data and schema
2019-03-13T21:41:35.489139+00:00 app[web.1]:
2019-03-13T21:41:35.489197+00:00 app[web.1]: http://localhost:8000/___graphql
2019-03-13T21:41:35.489246+00:00 app[web.1]:
2019-03-13T21:41:35.489329+00:00 app[web.1]: Note that the development build is not optimized.
2019-03-13T21:41:35.489406+00:00 app[web.1]: To create a production build, use npm run build
2019-03-13T21:41:35.489460+00:00 app[web.1]:
2019-03-13T21:41:35.518813+00:00 app[web.1]: ℹ ｢wdm｣:
2019-03-13T21:41:35.518919+00:00 app[web.1]: ℹ ｢wdm｣: Compiled successfully.
2019-03-13T21:42:21.505858+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-03-13T21:42:21.505911+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-03-13T21:42:21.660871+00:00 heroku[web.1]: State changed from starting to crashed
2019-03-13T21:42:21.643794+00:00 heroku[web.1]: Process exited with status 137
2019-03-14T03:25:18.012932+00:00 heroku[web.1]: State changed from crashed to starting
2019-03-14T03:25:26.974905+00:00 heroku[web.1]: Starting process with command `npm start`
2019-03-14T03:25:29.221439+00:00 app[web.1]:
2019-03-14T03:25:29.221465+00:00 app[web.1]: > vllg#0.1.0 start /app
2019-03-14T03:25:29.221467+00:00 app[web.1]: > npm run develop
2019-03-14T03:25:29.221469+00:00 app[web.1]:
2019-03-14T03:25:29.642388+00:00 app[web.1]:
2019-03-14T03:25:29.642437+00:00 app[web.1]: > vllg#0.1.0 develop /app
2019-03-14T03:25:29.642951+00:00 app[web.1]: > gatsby develop
2019-03-14T03:25:29.642954+00:00 app[web.1]:
2019-03-14T03:25:34.179104+00:00 app[web.1]: lscpu: failed to determine number of CPUs: /sys/devices/system/cpu/possible: No such file or directory
2019-03-14T03:25:34.371576+00:00 app[web.1]: success open and validate gatsby-configs — 0.018 s
2019-03-14T03:25:35.101757+00:00 app[web.1]: success load plugins — 0.729 s
2019-03-14T03:25:36.254992+00:00 app[web.1]: success onPreInit — 1.153 s
2019-03-14T03:25:36.301769+00:00 app[web.1]: success delete html and css files from previous builds — 0.047 s
2019-03-14T03:25:36.341230+00:00 app[web.1]: success initialize cache — 0.039 s
2019-03-14T03:25:36.394596+00:00 app[web.1]: success copy gatsby files — 0.053 s
2019-03-14T03:25:36.405920+00:00 app[web.1]: success onPreBootstrap — 0.011 s
2019-03-14T03:25:36.570578+00:00 app[web.1]: success source and transform nodes — 0.165 s
2019-03-14T03:25:37.534865+00:00 app[web.1]: success building schema — 0.964 s
2019-03-14T03:25:37.682403+00:00 app[web.1]: success createPages — 0.145 s
2019-03-14T03:25:37.846729+00:00 app[web.1]: success createPagesStatefully — 0.164 s
2019-03-14T03:25:37.856984+00:00 app[web.1]: success onPreExtractQueries — 0.010 s
2019-03-14T03:25:38.258545+00:00 app[web.1]: success update schema — 0.401 s
2019-03-14T03:25:38.381310+00:00 app[web.1]: warning Using the global `graphql` tag is deprecated, and will not be supported in v3.
2019-03-14T03:25:38.381315+00:00 app[web.1]: Import it instead like: import { graphql } from 'gatsby' in file:
2019-03-14T03:25:38.381317+00:00 app[web.1]: /app/src/pages/blog.js
2019-03-14T03:25:38.546084+00:00 app[web.1]: success extract queries from components — 0.287 s
2019-03-14T03:25:38.877403+00:00 app[web.1]: success run graphql queries — 0.331 s — 10/10 30.74 queries/second
2019-03-14T03:25:38.888429+00:00 app[web.1]: success write out page data — 0.011 s
2019-03-14T03:25:38.889427+00:00 app[web.1]: success write out redirect data — 0.001 s
2019-03-14T03:25:39.394941+00:00 app[web.1]: done generating icons for manifest
2019-03-14T03:25:39.397600+00:00 app[web.1]: success onPostBootstrap — 0.508 s
2019-03-14T03:25:39.398607+00:00 app[web.1]:
2019-03-14T03:25:39.399205+00:00 app[web.1]: info bootstrap finished - 9.734 s
2019-03-14T03:25:39.399508+00:00 app[web.1]:
2019-03-14T03:25:49.598021+00:00 app[web.1]: DONE Compiled successfully in 7982ms3:25:49 AM
2019-03-14T03:25:49.598123+00:00 app[web.1]:
2019-03-14T03:25:49.668957+00:00 app[web.1]:
2019-03-14T03:25:49.669051+00:00 app[web.1]: You can now view vllg in the browser.
2019-03-14T03:25:49.669113+00:00 app[web.1]:
2019-03-14T03:25:49.669181+00:00 app[web.1]: http://localhost:8000/
2019-03-14T03:25:49.669263+00:00 app[web.1]:
2019-03-14T03:25:49.669509+00:00 app[web.1]: View GraphiQL, an in-browser IDE, to explore your site's data and schema
2019-03-14T03:25:49.669573+00:00 app[web.1]:
2019-03-14T03:25:49.669642+00:00 app[web.1]: http://localhost:8000/___graphql
2019-03-14T03:25:49.669711+00:00 app[web.1]:
2019-03-14T03:25:49.669766+00:00 app[web.1]: Note that the development build is not optimized.
2019-03-14T03:25:49.669875+00:00 app[web.1]: To create a production build, use npm run build
2019-03-14T03:25:49.669941+00:00 app[web.1]:
2019-03-14T03:25:49.809865+00:00 app[web.1]: ℹ ｢wdm｣:
2019-03-14T03:25:49.810002+00:00 app[web.1]: ℹ ｢wdm｣: Compiled successfully.
2019-03-14T03:26:27.415495+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-03-14T03:26:27.415791+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-03-14T03:26:27.640591+00:00 heroku[web.1]: Process exited with status 137
2019-03-14T03:26:27.669848+00:00 heroku[web.1]: State changed from starting to crashed
2019-03-14T06:29:40.584512+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=vllg.herokuapp.com request_id=05381bb0-3b5e-4191-b20f-bd1a0ab788fe fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:29:40.995063+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=vllg.herokuapp.com request_id=69bc54f5-3ffc-469c-8919-7f46eef7ed3f fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:31:47.930409+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=vllg.herokuapp.com request_id=53dd38e4-9b34-41fe-8838-2ce2f659ddc0 fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:31:48.205331+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=vllg.herokuapp.com request_id=140a8ca7-0a44-4a91-83f7-9726a1c1a94b fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:50:31.151053+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=vllg.herokuapp.com request_id=4aef2e8c-d00e-4fc6-9d72-f05fe676a7b1 fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:50:31.476418+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=vllg.herokuapp.com request_id=af2c772d-3299-4767-8c7b-e2fa0de414ab fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:52:49.412131+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=vllg.herokuapp.com request_id=84f885b2-a2d7-42c5-a4ff-8b9f2d692c39 fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
2019-03-14T06:52:49.675993+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=vllg.herokuapp.com request_id=23679509-eff5-46c2-86e6-1971c91dc368 fwd="98.164.218.149" dyno= connect= service= status=503 bytes= protocol=http
Repo
My code repository is available to browse at https://github.com/JGallardo/vllg
Attempted solutions and research
I found a similar issue of status 137 at Heroku "Process exited with status 137" node.js app but not sure how to apply anything there to my project
I see an error about needing to build a production build? that was not in the instructions by heroku in the tutorial that i followed but i ran npm run build and don't see a new build folder.
I also see that there is a R 10 error, i found a similar issue mentioned in Heroku Boot Timeout (Error R10) but that seems to perhaps be a python project as I think a Procfile is only for Ruby projects?
I haven't used Heroku before but I can give you some guidance perhaps looking at your logs.
gatsby develop is supposed to be a development command only for when your testing the site so it looks like it's having a conflict, though you shouldn't be using that command anyways as it should be built with gatsby build. Using Gatsby develop also does not provide an optimized version of your site so your missing out on many of the benefits.
That said gatsby build creates a public folder in your directory with static assets. For testing locally you should use gatsby serve to properly view the build and make sure it works as expected. For Heroku you shouldn't have to use the serve command you should be able to just give it your static assets in the public folder.
You can also "teach" Heroku how to build for you following this guide. https://www.gatsbyjs.org/docs/deploying-to-heroku/
Can also confirm Netlify is awesome for static sites and Gatsby.
The error message says Web process failed to bind to $PORT within 60 seconds of launch.
Heroku randomly assigns a port and sets into variable $PORT.
If it doesn't find anything using that port for 60 seconds, app crashes.
The easiest option is to create a Procfile
and add something like web: gatsby serve -p $PORT -H 0.0.0.0
, which runs app in given env. variable.
Heroku is more useful for server-side apps. With the command build, Gatsby provides you a static version of your blog. This way, you can upload it on a CDN, it's way more performant. I would advise Netlify:
It's free
It's based on your GitHub account
It automatically deploys new changes (via git commit hooks)
You can even use a custom domain
This is what I get when I call heroku logs --tail in the command line. I'm trying to figure out how to bind to the PORT environment variable.
- 2017-08-14T20:37:08.596686+00:00 heroku[web.1]: Starting process with command `npm start`
- 2017-08-14T20:37:12.430214+00:00 app[web.1]:
- 2017-08-14T20:37:12.430257+00:00 app[web.1]: > angular-seed#0.0.0 prestart /app
- 2017-08-14T20:37:12.430258+00:00 app[web.1]: > npm install
- 2017-08-14T20:37:12.430258+00:00 app[web.1]:
- 2017-08-14T20:37:15.512607+00:00 app[web.1]:
- 2017-08-14T20:37:15.512635+00:00 app[web.1]: > angular-seed#0.0.0 postinstall /app
- 2017-08-14T20:37:15.512636+00:00 app[web.1]: > bower install
- 2017-08-14T20:37:15.512637+00:00 app[web.1]:
- 2017-08-14T20:37:16.486773+00:00 app[web.1]:
- 2017-08-14T20:37:16.486791+00:00 app[web.1]: > angular-seed#0.0.0 start /app
- 2017-08-14T20:37:16.486792+00:00 app[web.1]: > http-server -a localhost - p 8000 -c-1 ./app
- 2017-08-14T20:37:16.486793+00:00 app[web.1]:
- 2017-08-14T20:37:16.825832+00:00 app[web.1]: Starting up http-server, serving ./app
- 2017-08-14T20:37:16.825845+00:00 app[web.1]: Available on:
- 2017-08-14T20:37:16.826624+00:00 app[web.1]: http://localhost:8000
- 2017-08-14T20:37:16.827943+00:00 app[web.1]: Hit CTRL-C to stop the server
- 2017-08-14T20:37:20.747552+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=portfolio- stacyareas.herokuapp.com request_id=f4146b40-cc31-4ca0-acc8-52e76b0cbd58 fwd="75.101.48.232" dyno= connect= service= status=503 bytes= protocol=https
- 2017-08-14T20:38:08.834223+00:00 app[web.1]: Error waiting for process to terminate: No child processes
- 2017-08-14T20:38:08.948625+00:00 heroku[web.1]: State changed from starting to crashed
- 2017-08-14T20:38:10.473956+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=portfolio- stacyareas.herokuapp.com request_id=9553660d-4199-407b-ab74-712e04940b06 fwd="75.101.48.232" dyno= connect= service= status=503 bytes= protocol=https
This is what I have in my index.js file
var express = require('express');
var app = express();
app.set('port', (process.env.PORT || 5000));
app.use(express.static(__dirname + '/public'));
// views is directory for all template files
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.get('/', function(request, response) {
response.render('pages/index');
});
app.listen(app.get('port'), function() {
console.log('Node app is running on port', app.get('port'));
});