How to properly assign paths for react router?

Question

React

Good evening everyone. I continue to learn react. Here is an example of what is already being done. https://yurajun.github.io/react-test-work/
We get to the page with the worker, after clicking "home" we will see the general list of workers. Here you can add, delete, go to the description of the selected employee. You can edit the entry in the description of the selected worker. Everything is stored in localStorage. In general, everything is cool and I like it, that's just one question.
When working with localhost:3000, the paths started with "/" and everything is OK, but when I uploaded to git, the paths began to start with /react-test-work/ and when I went to the main one, I already had the path https://yurajun.github .io that already, as it were, cannot be like this and when you restart the whole application collapses.
Is it possible to somehow specify in react-router that my application can be both "/" and /react-test-work/
To start the application again, if nothing is displayed on the screen (blank screen), then delete the entry from localStorage 'r-workers' and go to https://yurajun.github.io/react-test-work/

Answer 1

You can pass a variable with a base URL using webpack.DefinePlugin or any other convenient method. When using create-react-app , it's convenient to use the .env file .
The base URL will be passed to the router using the basename property .
Example with .env variable:

<BrowserRouter basename={process.env.REACT_APP_BASE_URL} />