How to set context root of a ReactJs app?

Question

I need to set the context root of a react app to /myApp, so the app link will be https://mydomain/myApp instead of https://mydomain. I tried to set basename for Router, but it didn't work. Not sure what I missed. Here is the code snippet.

    import './styles/style.less';
    import React from 'react';
    import { render as renderToDOM } from 'react-dom';
    import { BrowserRouter as Router, Route, Redirect } from "react-router-dom";
    import Home from './components/Home';
    
    import { createStore, combineReducers, applyMiddleware } from 'redux'
    import ReduxThunk from 'redux-thunk'
    import { Provider } from 'react-redux';
    
    import { commonReducer } from './reducers/commonReducers';
    import { authReducer } from './reducers/authReducers';
    import { regionReducer } from './reducers/regionReducers';
    
    const { container } = global;
    container.style.display = null;
    
    const reducers = combineReducers({
        commonReducer,
        authReducer,
        regionReducer
    });
    
    const store = createStore(reducers, applyMiddleware(ReduxThunk));
    
    render();
    
    function render() {
        try {
            renderToDOM((
                <Provider store={store}>
                    <Router basename='/myApp'>
                        <Route path='/'>
                            <Home />
                        </Route>
                    </Router>
                </Provider>        
            ), container);
        }
        catch (e) {
            if (process.env.NODE_ENV !== 'production') {
                // TODO show an application error display
            }
            throw e;
        }
    }

With the code above, the app still loads at https://mydomain. When I hit https://mydomain/myApp, it throws 404 Not Found error.

Any help will be appreciated.