PORT=4000
REACT_APP_MICRO_APP_NAME=Counter
REACT_APP_MICRO_APP_URL=http://localhost:4001

PORT=4001
REACT_APP_NAME=Counter

$ cd ./main-app
$ yarn
$ yarn start

$ cd ./sub-app-counter
$ yarn
$ yarn start

// Config Name Sub APP
const APP_NAME = process.env.REACT_APP_NAME;
// Setup value render for window
const RENDER_SUB_APP = `render_${APP_NAME}`;
// Setup value unmount for window
const UNMOUNT_SUB_APP = `unmount_${APP_NAME}`;

// Main will use it when render in Main App
window[RENDER_SUB_APP] = (containerId, history) => {
  ReactDOM.createRoot(document.getElementById(containerId)).render(
    <App history={history} />
  );
};
// Main will use it when unmount in Main App
window[UNMOUNT_SUB_APP] = (containerId) => {
  ReactDOM.createRoot(
    document.getElementById(containerId)
  ).unmountComponentAtNode(document.getElementById(containerId));
};
// If you direction sub app then run into
if (!document.getElementById(`${APP_NAME}-container`)) {
  ReactDOM.createRoot(document.getElementById("root")).render(<App />);
}