title: Why my browser shows blank page when I run express server (React.js)?
body: <p>I'm new to React. I want to deploy my react project to Heroku. To do that I implemented a simple express server. But nothing renders on my browser at <code>localhost:3000</code> when I run the server with <code>node server/server.js</code>. Am I missing something obvious here?</p>
  <p>My project structure:</p>
  <p><a href="https://i.stack.imgur.com/TUwY4.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TUwY4.png" alt="My project structure" /></a></p>
  <p>server.js:</p>
  <pre><code>const path = require('path');
  const express = require('express');
  const app = express();
  const port = process.env.PORT || 3000;
  
  // console.log that your server is up and running
  app.listen(port, () =&gt; console.log(`Listening on port ${port}`));
  
  // create a GET route
  app.get('/*', (req, res) =&gt; {
    res.send(res.sendFile(path.join(__dirname, '../src/index.html')));
  });
  </code></pre>
  <p>index.html:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
    &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot; /&gt;
      &lt;link rel=&quot;icon&quot; href=&quot;%PUBLIC_URL%/favicon.ico&quot; /&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot; /&gt;
      &lt;meta name=&quot;theme-color&quot; content=&quot;#000000&quot; /&gt;
      &lt;meta
        name=&quot;description&quot;
        content=&quot;Web site created using create-react-app&quot;
      /&gt;
  
      &lt;link rel=&quot;manifest&quot; href=&quot;%PUBLIC_URL%/manifest.json&quot; /&gt;
      &lt;title&gt;React App&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;noscript&gt;You need to enable JavaScript to run this app.&lt;/noscript&gt;
      &lt;div id=&quot;root&quot;&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>