Create routes using React Route

Question

Next I’m using the React-router-dom while I’m serving the project folder as if it’s root works, the routes go to the specific components my problem is when I put in a server:

the front part where the React is placed inside the folder /app and my php scripts that interact with the front on /server.

different when I put the React at the root / it works perfectly.

<Router>
    <div>
      <a href="./">inicio</a><span> </span>
      <a href="./maps">maps</a><span> </span>
      <a href="./cadastro">cadastro</a>


      <Route path={"/app/maps"} component={TelaMaps} />
      <Route path={"/app/cadastro"} component={TelaCadastro} />

    </div>
  </Router>

Answer 1

Your problem is the route you take on your server to the React files.

If you are using webpack and express just you do a combination of the two to serve your files in the desired place.

An example:

Webpack output:

output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/'
  },

Express configuration:

const app = express();
app.use(express.static('dist'));