Back end Node requests work on localhost but not in Heroku deployment

Question

I have been working on practicing deployment to Heroku using a basic MERN app that is an exercise tracker. You can see the page here. Right now the UI is working but every request to the backend is met with a 503 error. After spending three hours googling and trying to problem solve, I thought I'd consult stackOverflow.

In my current project, I have everything working on my local host, but not in heroku. I can cross off a the connect with MongoDB being the issue because it works locally. Right now, my instincts are that the issue is either in my backend package.json file, server.js file, procfile, or config.js.

I'm still learning to work with Node, so even if you can't tell me the answer, but can just tell me some steps I should take to trouble shoot, I'd be most appreciative.

IF you'd like to see my full code on github, you can see it here.

Here is a sample of the error message I get in the heroku logs.

2020-09-01T13:24:28.665631+00:00 heroku[router]: at=error code=H12 desc="Request timeout" method=GET path="/exercises/" host=exercise-tracker-deployment-3.herokuapp.com request_id=f2b3dfaa-3e08-449a-b3a4-453ca864cc0f fwd="129.137.144.10" dyno=web.1 connect=1ms service=30001ms status=503 bytes=0 protocol=https

Here is my current package.json for my backend

{
  "name": "backend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "cd client && npm run build",
    "install-client": "cd client && npm install",
    "heroku-postbuild": "cd client && npm install && npm run build",
    "start": "node server.js",
    "client": "cd client && npm start",
    "dev": "concurrently -n 'server,client' -c 'red,green'  \"nodemon server.js\" \"npm run client\""
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "mongoose": "^5.10.0"
  }
}

Here is my server.js

const express = require('express');
const cors = require('cors');
const mongoose = require('mongoose')


require('dotenv').config();


    const app = express();
    const port = process.env.PORT || 5000;
    
    
    app.use(cors());
    app.use(express.json());
    app.use(express.static('client/build'))
    
    const uri = process.env.ATLAS_URI;
            
    mongoose.connect(uri, { useNewUrlParser: true, useCreateIndex: true }
    );
    const connection = mongoose.connection;
    
    
    connection.once('open', () => {
      console.log("MongoDB database connection established successfully");
    })
    
    const exercisesRouter = require('./routes/exercises');  
    const usersRouter = require('./routes/users');  
    
    app.use('/exercises', exercisesRouter);  
    app.use('/users', usersRouter);
    
    app.listen(port, () => {
    console.log(`Server is running on port: ${port}`);
    });

This is my very basic procfile

web: npm start

This is my config.js

import dotenv from 'dotenv'
dotenv.config();

export const BACKEND_URL = process.env.NODE_ENV === 'development'? "http://locahost:5000" : "https://exercise-tracker-deployment-3.herokuapp.com/" 

Answer 1

I had a similar problem, and the solution was actually because in MongoDB Atlas -> Network Access -> IP Whitelist , I had not added 0.0.0.0/0 as a new IP Address.

After adding this, the code will run smoothly.

Also check if the collections and Database you are using are already made in the Cluster, even if they are empty.