React Typescript i18n : i18next::translator: missingKey en translation

I have been trying to use 'backend' option to load my translations but seeing 'missing_key' for all the translations. Attached are the screenshots of my code. Any help will be appreciated.

Check if the keys in your translation files match each other. They must be identical, example:

en/translation.json

{
  "name": "Name"
}

fr/translation.json

{
  "name": "Nom"
}