Heroku Application Crashes - Is not serving static html content (Express server)

Question

I am continuously getting this error on Heroku when I try to serve up a static html page with some basic js, img and css. I tried all the help on SO and made changes to index.js, changes related to file structuring, changing paths, heroku restart. Having super hard luck. I am giving the details of the problem below. Please help me out.

MY FILE STRUCTURE LOOKS LIKE THIS

├── package.json
├── node_modules
├── .gitignore
├── public
├────────img
├────────js
├────────css
├────────index.html
├── src
├────────index.js

I used the command heroku git:remote -a instagif and then git push heroku master . Everything comipiles and deploys perfectly. The project works on the local system perfectly fine. But, when I try to access it via instagif.herokuapp.com. It simply gives an application error.

ERROR LOGS RIGHT AFTER TRYING TO ACCESS instagif.herokuapp.com
2020-03-30T05:05:45.618259+00:00 heroku[web.1]: State changed from starting to crashed
2020-03-30T05:05:45.500290+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2020-03-30T05:05:45.500402+00:00 heroku[web.1]: Stopping process with SIGKILL
2020-03-30T05:05:45.599597+00:00 heroku[web.1]: Process exited with status 137
2020-03-30T05:05:46.579266+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=instagif.herokuapp.com request_id=1c907ab2-e79d-491c-a03b-c01ebc0c35c7 fwd="24.21.57.152" dyno= connect= service= status=503 bytes= protocol=http
2020-03-30T05:05:47.707731+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=instagif.herokuapp.com request_id=af0d271a-e34b-4524-8218-39d40dee8bff fwd="24.21.57.152" dyno= connect= service= status=503 bytes= protocol=http
2020-03-30T05:05:47.735754+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=instagif.herokuapp.com request_id=20abfcb0-dd7e-4748-bd68-82feecefe711 fwd="24.21.57.152" dyno= connect= service= status=503 bytes= protocol=http

My index.js file looks like below:

const express = require("express")
const path = require('path')

var port = process.env.PORT || 3000

const PATH = path.join(__dirname,"../public")
app = express()
app.use(express.static(PATH))

app.listen(3000,()=>{
    console.log(`Server live at port: ${port}`)
})

Please do help. I have been stuck on this since a long long time. Tried all the different answers on SO, but, none seem to work for me.

Answer 1

app.listen(3000,()=>{
    console.log(`Server live at port: ${port}`)
})

You are not binding to the $PORT . You are listening to port 3000 and printing out the $PORT value.

2020-03-30T05:05:45.500290+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch

Should be:

app.listen(port,()=>{
    console.log(`Server live at port: ${port}`)
})