title: how to incorporate API data in i18next instead of static file
body: <p>I have saved file in <code>public folder</code> in react for different <code>language</code> for <code>translation</code>. now I have requirement to get that data from <code>API</code>. I am able to call API and get data. I also know how to use <code>translation</code>. but I am not able to incorporate API call in translation code file.</p>
  <p>API.</p>
  <pre><code> axios
        .get(
          'http://localhost:8080/file_download/' +
            navigator.lnaguage
        )
        .then((res) =&gt; {
          console.log(res.data);
          });
        });
    }
  </code></pre>
  <p>Below is my translation code fr static files.
  for ex in <code>TRANSLATIONS_FR</code> I need to store output of <code>API</code>.</p>
  <p>i18file.js:-</p>
  <pre><code>import i18next from 'i18next';
  
  const LanguageDetector = require('i18next-browser-languagedetector');
  const initReactI18next = require('react-i18next');
  import xios from 'axios';
  
  import { TRANSLATIONS_FR } from './../public/locales/fr/fr.js';
  import { TRANSLATIONS_EN } from '../public/locales/en/en.js';
  
  i18next
    .use(LanguageDetector)
    .use(initReactI18next)
    .init({
      resources: {
        en: TRANSLATIONS_EN,
        fr: TRANSLATIONS_FR,
      },
      fallbackLng: 'fr',
    });
  
  i18next.changeLanguage(navigator.language);
  
  export default i18next;
  </code></pre>
  <p>I have to insert that <code>API</code> code into <code>i18file.js</code> file. if <code>browser</code> detecting <code>en</code> then I have to call for <code>english</code> and assign in <code>resources</code>. if browser detecting frech then I have to do for same.</p>
  <p>Could you please suggest. I will write the code.</p>
  <p><strong>Edit1:-</strong>
  I am writing below <code>code</code> and it is throwing <code>error</code>.
  Below <code>API</code> will send the <code>json data</code> from <code>database</code>. this data I am <code>not storing in file</code> but directly using.</p>
  <pre><code>http://localhost:8080//file_download/en
  Below is the code
  
  import i18next from 'i18next';
  import Backend from 'i18next-http-backend';
  
  const LanguageDetector = require('i18next-browser-languagedetector');
  const initReactI18next = require('react-i18next');
  
   i18next
    .use(Backend)
    .use(LanguageDetector)
    .use(initReactI18next)
    .init({
      backend: {
         loadPath: 'http://localhost:8080//file_download/en' //this is API path which will return result.
      }, 
      resources: {
        en:res.data //I need to assign here.
      },
      fallbackLng: 'fr',
    });
    i18next.changeLanguage(navigator.language);
  export default i18next;
  </code></pre>
  <p>How can I incorporate the <code>API</code> in above <code>code</code> and use its <code>data</code> for eg in <code>en</code> language.</p>