0

I created a simple Schedule management app using Hasura GraphQL API and React. I tried to host my app on Heroku by linking by github repository with it however, its not working propwerly. I am using Heroku and GraphQL for the first time so I am unavle to figure out what exactly am I doing wrong.

My Github Repository Linkfro my source code: https://github.com/yash-sethia/Schedule-Management-App-using-GraphQL-and-React

My heroku app link (That show's an error screen) : https://schedule-management-app.herokuapp.com/

This is the error message displayed in the logs :

    2020-11-11T04:57:35.434926+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-11T08:14:26.702564+00:00 heroku[web.1]: State changed from crashed to starting
2020-11-11T08:14:44.659544+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-11T08:14:47.483996+00:00 app[web.1]:
2020-11-11T08:14:47.484007+00:00 app[web.1]: > webd_project@0.1.0 start /app
2020-11-11T08:14:47.484007+00:00 app[web.1]: > react-scripts start
2020-11-11T08:14:47.484008+00:00 app[web.1]:
2020-11-11T08:14:50.665030+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.243.110/
2020-11-11T08:14:50.665788+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-11-11T08:14:50.665967+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-11-11T08:14:50.666129+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-11-11T08:14:50.666503+00:00 app[web.1]: Starting the development server...
2020-11-11T08:14:50.666504+00:00 app[web.1]:
2020-11-11T08:14:50.778105+00:00 heroku[web.1]: Process exited with status 0
2020-11-11T08:14:51.016955+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-11T13:52:48.230487+00:00 heroku[web.1]: State changed from crashed to starting
2020-11-11T13:52:59.344712+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-11T13:53:01.550816+00:00 app[web.1]:
2020-11-11T13:53:01.550849+00:00 app[web.1]: > webd_project@0.1.0 start /app
2020-11-11T13:53:01.550850+00:00 app[web.1]: > react-scripts start
2020-11-11T13:53:01.550850+00:00 app[web.1]:
2020-11-11T13:53:03.757281+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.19.87.134/
2020-11-11T13:53:03.757641+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-11-11T13:53:03.757738+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-11-11T13:53:03.757806+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-11-11T13:53:03.757993+00:00 app[web.1]: Starting the development server...
2020-11-11T13:53:03.757994+00:00 app[web.1]:
2020-11-11T13:53:03.852308+00:00 heroku[web.1]: Process exited with status 0
2020-11-11T13:53:03.892089+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-11T19:28:16.774146+00:00 heroku[web.1]: State changed from crashed to starting
2020-11-11T19:28:34.737934+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-11T19:28:37.269259+00:00 app[web.1]:
2020-11-11T19:28:37.269283+00:00 app[web.1]: > webd_project@0.1.0 start /app
2020-11-11T19:28:37.269283+00:00 app[web.1]: > react-scripts start
2020-11-11T19:28:37.269284+00:00 app[web.1]:
2020-11-11T19:28:39.241913+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.16.104.210/
2020-11-11T19:28:39.242274+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-11-11T19:28:39.242349+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-11-11T19:28:39.242427+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-11-11T19:28:39.242585+00:00 app[web.1]: Starting the development server...
2020-11-11T19:28:39.242586+00:00 app[web.1]:
2020-11-11T19:28:39.306313+00:00 heroku[web.1]: Process exited with status 0
2020-11-11T19:28:39.339563+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-12T01:20:50.986428+00:00 heroku[web.1]: State changed from crashed to starting
2020-11-12T01:21:04.061714+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-12T01:21:07.918791+00:00 app[web.1]:
2020-11-12T01:21:07.918811+00:00 app[web.1]: > webd_project@0.1.0 start /app
2020-11-12T01:21:07.918812+00:00 app[web.1]: > react-scripts start
2020-11-12T01:21:07.918812+00:00 app[web.1]:
2020-11-12T01:21:11.178494+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.192.242/
2020-11-12T01:21:11.178876+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-11-12T01:21:11.178944+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-11-12T01:21:11.179026+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-11-12T01:21:11.179232+00:00 app[web.1]: Starting the development server...
2020-11-12T01:21:11.179234+00:00 app[web.1]:
2020-11-12T01:21:11.269635+00:00 heroku[web.1]: Process exited with status 0
2020-11-12T01:21:11.325157+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-12T06:57:29.079557+00:00 heroku[web.1]: State changed from crashed to starting
2020-11-12T06:57:41.430648+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-12T06:57:44.032930+00:00 app[web.1]:
2020-11-12T06:57:44.032950+00:00 app[web.1]: > webd_project@0.1.0 start /app
2020-11-12T06:57:44.032950+00:00 app[web.1]: > react-scripts start
2020-11-12T06:57:44.032951+00:00 app[web.1]:
2020-11-12T06:57:46.396411+00:00 app[web.1]: ℹ ｢wds｣: Project is running at http://172.18.237.234/
2020-11-12T06:57:46.396697+00:00 app[web.1]: ℹ ｢wds｣: webpack output is served from
2020-11-12T06:57:46.396777+00:00 app[web.1]: ℹ ｢wds｣: Content not from webpack is served from /app/public
2020-11-12T06:57:46.396841+00:00 app[web.1]: ℹ ｢wds｣: 404s will fallback to /
2020-11-12T06:57:46.397012+00:00 app[web.1]: Starting the development server...
2020-11-12T06:57:46.397013+00:00 app[web.1]:
2020-11-12T06:57:46.473000+00:00 heroku[web.1]: Process exited with status 0
2020-11-12T06:57:46.511649+00:00 heroku[web.1]: State changed from starting to crashed
2020-11-12T07:38:08.135193+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=64916495-a682-4895-8725-0a876ca78165 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:38:08.892960+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=8efbff92-a5f9-401a-ae7b-5afb620fc95b fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:39:14.552520+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=622ae611-b44e-4738-9987-fa7f2077ceca fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:39:15.245006+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=740f836f-6c7c-4a71-8069-e3ce75dd8e88 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:40:41.931479+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=c1b7dbbd-ef85-4433-b330-ef5e08d27467 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:40:42.807842+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=f471954f-6720-450b-a3a7-f8d3448ab11e fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:51:39.028875+00:00 app[api]: Starting process with command `heroku logs --tail` by user yyashsethia@gmail.com
2020-11-12T07:51:55.700302+00:00 heroku[run.4516]: State changed from starting to up
2020-11-12T07:51:56.076838+00:00 heroku[run.4516]: Awaiting client
2020-11-12T07:51:56.130401+00:00 heroku[run.4516]: Starting process with command `heroku logs --tail`
2020-11-12T07:52:01.025743+00:00 heroku[run.4516]: Process exited with status 127
2020-11-12T07:52:01.069575+00:00 heroku[run.4516]: State changed from up to complete
2020-11-12T07:52:12.830669+00:00 app[api]: Starting process with command `logs --tail` by user yyashsethia@gmail.com
2020-11-12T07:52:29.374524+00:00 heroku[run.2810]: Awaiting client
2020-11-12T07:52:29.402908+00:00 heroku[run.2810]: Starting process with command `logs --tail`
2020-11-12T07:52:29.481583+00:00 heroku[run.2810]: State changed from starting to up
2020-11-12T07:52:33.681435+00:00 heroku[run.2810]: Process exited with status 127
2020-11-12T07:52:33.728441+00:00 heroku[run.2810]: State changed from up to complete
2020-11-12T07:54:17.364720+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=5a9bb0b1-5095-44c8-acb1-0632cda59581 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:54:19.387732+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=bebd1fa5-55d4-4da5-a0a4-998b4bec5807 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:54:56.265063+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=5f8e7bf2-1de0-444b-85bd-e5bd1c2d0021 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:54:57.285648+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=4a299aab-d7d2-4722-ae7e-e696b8d3f361 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:58:58.856040+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=572807eb-60db-4cfd-9d94-d867c16ba55f fwd="34.227.83.108" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:58:58.887428+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=d82b4c44-506d-4a29-94eb-f4ddb044ba58 fwd="34.227.83.108" dyno= connect= service= status=503 bytes= protocol=http
2020-11-12T07:59:04.492151+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=HEAD path="/" host=schedule-management-app.herokuapp.com request_id=7fe9e10d-a5bd-432f-bd70-c3d7aa0f4931 fwd="217.182.175.162" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:59:50.143201+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/robots.txt" host=schedule-management-app.herokuapp.com request_id=8f9dd1ec-d7b3-46be-aeee-d52dda0ae196 fwd="107.23.92.82" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T07:59:50.164349+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=159cfbb3-c7ae-4c9c-8a1b-8e21783da8ea fwd="107.23.92.82" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T08:14:04.114629+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=schedule-management-app.herokuapp.com request_id=8ed69468-d73e-4331-8609-7c35a659ce78 fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https
2020-11-12T08:14:04.947352+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=schedule-management-app.herokuapp.com request_id=57a5208a-06d3-4ed2-8e2c-657179f357ef fwd="182.64.168.27" dyno= connect= service= status=503 bytes= protocol=https

My app works perfectly fne on my system so I am assuming that I am making a mistake at hosting. Please help.

Yash Sethia
  • 55
  • 1
  • 8

1 Answers1

1

You need to specify a buildpack. Follow the official docs here. Suggests using the Heroku CLI. I had no problem deploying your repo to heroku using those instructions.

If you must do it your way (github integration) you can set the buildpack in app.json.

Abraham Labkovsky
  • 1,771
  • 6
  • 12
  • I tried deploying my app using CLI, but when I open the app, a blank white screen is displayed. I am not sure what am I doing wrong. This is the link that is shown in the Webpack section of my Config. Variables in Heroke : `https://buildpack-registry.s3.amazonaws.com/buildpacks/mars/create-react-app.tgz` – Yash Sethia Nov 12 '20 at 23:25
  • That is the correct buildpack. I see that one in my account too. I have no problem seeing the actual webpage when I deploy. – Abraham Labkovsky Nov 13 '20 at 03:35
  • Try a new folder on your machine. Clone master branch into a new directory. Then, just push to Heroku, with a different app name, using the CLI instructions and with the correct buildpack. (I did delete the package-lock.json before deploying but I doubt that is your issue). I dont see how it can work for only 1 of us... – Abraham Labkovsky Nov 13 '20 at 03:38
  • BTW, your handiwork is [here](https://test-react-deploy-so.herokuapp.com/) until I delete this app from my heroku acct – Abraham Labkovsky Nov 13 '20 at 03:40
  • Can I add the buildpack to an existing react app ? I think I figured out the problem. When I set up my database at Hasura GraphQL it creates a heroku app. I have pushed my code to that app, but can set the webpack – Yash Sethia Nov 13 '20 at 18:55
  • If you are hosting the hasura engine on heroku, don't push any front end to that app. You can use an ENV variable to point to the hasura URL for requests from your front end. But make that a completely separate app. As I said, make a new folder and clone just the front end. Follow the instructions above to push that to a new app with heroku, using the correct buildpack. Use a separate app for the Hasura and point your front end to it – Abraham Labkovsky Nov 15 '20 at 03:39