title: react router is not working with serve node static file on heroku?
body: <p>I have the following issue, I am serving build folder using node to client, below is the logic for my app.tsx and my node.js server, the current problem is once a redirect is happened if I refresh the page I simply get not found, nor I can return back how to solve this issue without using HashRouter?</p>
  <pre><code>import * as dotenv from 'dotenv';
  import express from 'express';
  import cors from 'cors';
  import bodyParser from 'body-parser';
  import path from 'path';
  import { dataHandeler } from './dataHandeler';
  import expressStaticGzip = require('express-static-gzip');
  
  dotenv.config();
  
  const app = express();
  
  app.use(cors());
  app.use(bodyParser.urlencoded({ extended: true }));
  app.use(express.json());
  
  const PORT = process.env.PORT || 5000;
  
  // Serve static assets in production
  if (process.env.NODE_ENV === 'production') {
    app.use(
      expressStaticGzip('client/build', {
        //enableBrotli: true, 
      })
    );
    //Set static folder
    app.use(express.static('client/build'));
  
    //Send Static folder
    app.get('/*', (request, response) =&gt; {
      response.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
    });
  }
  
  app.listen(PORT, console.log(`Server Started on Port ${PORT}`)!);
  </code></pre>
  <ul>
  <li>Works fine: <code>https://appname.herokuapp.com/</code></li>
  <li>Not found: <code>https://appname.herokuapp.com/app</code></li>
  </ul>
  <p>App</p>
  <pre><code>import React, { useState, useEffect, useContext } from 'react';
  // React Router
  import { BrowserRouter as Router, Route, Switch, HashRouter, Redirect } from 'react-router-dom';
  // Privite Route Component
  import { PrivateRoute } from './components/routes/PrivateRoute';
  // Components
  import Home from './components/Home/Home';
  import Hub from './components/App/lHub';
  // Context api
  import AuthProvider from './context/auth/AuthState';
  
  function App() {
    return (
      &lt;Router /*HashRouter hashType=&quot;noslash&quot;*/&gt;
        &lt;Switch&gt;
          &lt;Route exact path=&quot;/404&quot; component={NotFound404} /&gt;
          &lt;AuthProvider&gt;
            &lt;BackDrop /&gt;
            &lt;Route exact path=&quot;/&quot; component={Home} /&gt;
            &lt;PrivateRoute exact path=&quot;/app&quot; component={Hub} /&gt;
          &lt;/AuthProvider&gt;
        &lt;/Switch&gt;
      &lt;/Router /*HashRouter*/&gt; 
    );
  }
  
  export default App;
  </code></pre>