Just use ReactDOM.render into a separate, top-level <div> that is usually empty. And then have the close button of the modal call ReactDOM.unmountComponentAtNode.

Alternatively, don't bother with all of this and just mount the modal into your children. Use CSS `position: absolute/fixed` to position it. Of course this assumes your ancestor elements don't have certain properties like `position: relative` or `transform` set, but this is usually not a problem.

It was pretty common to use https://github.com/tajo/react-portal for modals before React 16. It provided most (or all, I haven't really compared yet) of the functionality React 16 provides now so they've re-written it to just be a nice wrapper around the `createPortal` API.

Append the modal component to the react app element, and then change the app state to open it. The disadvantage is that your modal exists outside of the component that opens it, so you can't pass in props from parent to child. But as long as the triggering component and the modal have access to the same app state store it's not a problem, and fairly clean.