title: Heroku H10 works on localhost, won't work in deployment
body: <p>This error seems to be pretty popular here! The app works great locally, but when deploying to Heroku... crickets, Application crashes.</p>
  
  <p>This is server.js</p>
  
  <pre><code>
  var app = express();
  var PORT = process.env.PORT || process.env.REACT_APP_PORT;
  app.use(express.urlencoded({ extended: true }));
  app.use(express.json());
  
  (process.env.NODE_ENV === "production") ? app.use(express.static("build")) : app.use(express.static("public"));
  
  //code goes here
  
  app.use(cors());
  
  app.get('*', function (req, res) {
      res.redirect('api/tweets');
  })
  
  app.get('api/tweets', function (req, res) {
      tweetData.findOne({}, [], { $orderby : { 'created_at' : -1 } }, function(err, post) {
          console.log(post);
          res.send(post);
      });
  });
  
  app.listen(PORT, function() {
      console.log("App running on port " + PORT);
  });
  
  
  </code></pre>
  
  <p>This is log entry</p>
  
  <pre><code>2020-05-10T00:12:59.057966+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=quarantine-life.herokuapp.com request_id=bd00538a-e6c4-4d33-ab5b-957eca72146f fwd="68.173.68.75" dyno= connect= service= status=503 bytes= protocol=https
  </code></pre>
  
  <p>This is the API call in App.js</p>
  
  <pre><code>  callTwitterApi = async () =&gt; {
      await axios.get(my_heroku_app_URL_goes_here)
        .then(res =&gt; {
            //pipeline length control
            if (this.state.count === 20){ 
              this.clearTweets();
            }
            //checking if the tweet is new
            this.checkIfNew(res.data);
        })
        .catch (error =&gt; {
          this.setState({ error, isLoading: true });
        })
        this.setState({isLoading: true, isNew: ""});
    }
  </code></pre>
  
  <p>Package.json:</p>
  
  <pre><code>
  `{
    "name": "quarantine-life",
    "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",
      "axios": "^0.19.2",
      "bootstrap": "^4.4.1",
      "cors": "^2.8.5",
      "dotenv-webpack": "^1.7.0",
      "express": "^4.17.1",
      "gh-pages": "^2.2.0",
      "http-proxy-middleware": "^1.0.3",
      "mongo": "^0.1.0",
      "mongoose": "^5.9.10",
      "morgan": "^1.10.0",
      "nodemon": "^2.0.3",
      "react": "^16.13.1",
      "react-animated-css": "^1.2.1",
      "react-bootstrap": "^1.0.1",
      "react-dom": "^16.13.1",
      "react-scripts": "3.4.1",
      "react-transition-group": "^4.4.0",
      "twitter": "^1.7.1"
    },
    "scripts": {
      "start": "react-scripts start &amp; node server.js",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "eject": "react-scripts eject"
    },
    "eslintConfig": {
      "extends": "react-app"
    },
    "browserslist": {
      "production": [
        "&gt;0.2%",
        "not dead",
        "not op_mini all"
      ],
      "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
      ]
    },
    "devDependencies": {
      "concurrently": "^5.2.0",
      "dotenv": "^8.2.0"
    },
    "proxy": "HEROKU_URL_GOES_HERE"
  }
  `
  </code></pre>
  
  <p>I've tried the following approaches</p>
  
  <ul>
  <li>proxy entry onto package.json</li>
  <li>middleware npm package</li>
  <li>ungodly amount of beer</li>
  </ul>
  
  <p>Any help for this noob right here, greatly appreciated! </p>