Issues with heroku deployment (MERN stack application)

Question

I am trying to deploy a MERN stack application using heroku, however I am facing issues during deployment.

I get the following error:

MongoNetworkError failed to connect to server [cluster0-shard-00-00-yyfkd.mongodb.net:27017] on first connect [MongoNetworkError: connection 5 to cluster0-shard-00-00-yyfkd.mongodb.net:27017 closed]

I set up the environment variables needed but I continuously get the same error.

I have tried to use the mlab addon explained in this video https://www.youtube.com/watch?v=qXIG8iKO7Fo&t=318s which did not work.

I tried to change the DATABASE environment variable from:

mongodb+srv::@cluster0-yyfkd.mongodb.net/test?retryWrites=true&w=majority

to:

mongodb+srv://:@cluster0-yyfkd.mongodb.net/.

This also did not work.

I upgraded heroku cli to the latest version which also did not work.

I tried to deploy the app several times as I read that this can work in certain occasions (I have deployed the app over 20 times now).

My internet connection is healthy.

I am currently running the following versions of node and npm:

"engines": {
    "node": "10.15.3",
    "npm": "6.10.3"
  },

My package.json currently looks like this:

{   "name": "clear",   "version": "1.0.0",   "description": "",   "main": "server.js",   "scripts": {
    "client": "cd client && npm start",
    "server": "nodemon server.js",
    "build": "cd client && npm run build",
    "dev": "concurrently --kill-others-on-fail \"npm run server\" \"npm run client\"",
    "start": "node server.js",
    "heroku-postbuild": "cd client && npm install && npm install --only=dev --no-shrinkwrap && npm run build"   },   "author": "",   "license": "ISC",   "dependencies": {
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.19.0",
    "compression": "^1.7.4",
    "concurrently": "^5.1.0",
    "cookie-parser": "^1.4.4",
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-mongo-sanitize": "^1.3.2",
    "express-rate-limit": "^5.0.0",
    "helmet": "^3.21.1",
    "hpp": "^0.2.2",
    "html-to-text": "^5.1.1",
    "jsonwebtoken": "^8.5.1",
    "mongodb": "^3.5.4",
    "mongoose": "^5.7.1",
    "morgan": "^1.9.1",
    "multer": "^1.4.2",
    "ndb": "^1.1.5",
    "nodemailer": "^6.3.0",
    "npm": "^6.4.1",
    "path": "^0.12.7",
    "pug": "^2.0.4",
    "slugify": "^1.3.5",
    "stripe": "^7.9.1",
    "validator": "^11.1.0",
    "xss-clean": "^0.1.1"   },   "engines": {
    "node": "10.15.3",
    "npm": "6.10.3"   },   "devDependencies": {
    "cross-env": "^7.0.0",
    "concurrently": "^4.0.1"   } }

This is the code that I am running in server.js:

const DB = process.env.DATABASE.replace(
  '<PASSWORD>',
  process.env.DATABASE_PASSWORD
);

mongoose
  .connect(DB, {
    useNewUrlParser: true,
    useCreateIndex: true, 
    useUnifiedTopology: true,
    useFindAndModify: false
  })
  .then(() => console.log('DB connection successful!'));

const port = process.env.PORT || 4000;
const server = app.listen(port, () => {
  console.log(`App running on port ${port}...`);
});

Any help or sense or direction will be greatly appreciated!