In @fluent/react, all <Localized> components need access to an instance of the ReactLocalization class, the central localization store to which they subscribe. The <LocalizationProvider> component takes advantage of React's Context API and makes translations available to all localized elements in the app without passing them explicitly.

ReactDOM.render(
    <LocalizationProvider l10n={…}>
        </App />
    </LocalizationProvider>,
    document.getElementById('root')
);

The LocalizationProvider component takes one prop: l10n. It should be an instance of ReactLocalization holding a sequence of FluentBundle instances which will be used — in order — to format translations. If a translation is missing in one bundle, ReactLocalization will fall back to the next one.