title: React SEO with multi-languages
body: <p>I use only one domain(<a href="http://www.test.com" rel="nofollow noreferrer">www.test.com</a>) with two languages(ko, en).</p>
  <p>If I change my site's langauge to en. My domain will be <a href="http://www.test.com/en" rel="nofollow noreferrer">www.test.com/en</a>.</p>
  <p>On the Google, I want to show my site's seo depend on locale.</p>
  <p>If i search my site in Korea, title and description will be shown korean.</p>
  <p>It will be displayed in English elsewhere.</p>
  <p>I use MetaTag Component.</p>
  <p>I about to print out the seo according to the condition statement.</p>
  <p>If language which is selected is en, MetaTag show En.</p>
  <p>However, I can not sure It works.</p>
  <p>Is there perfect solution to solve this situation?</p>
  <pre class="lang-js prettyprint-override"><code>&lt;Wrapper&gt;
          &lt;MetaTag /&gt;
          &lt;Routes&gt;
            {/* Main */}
            &lt;Route element={&lt;CustomRouter isLoggedIn={getCookie('access_token')} /&gt;}&gt;
              &lt;Route path=&quot;/app/team/*&quot; element={&lt;Dashboard /&gt;}/&gt;
              &lt;Route path=&quot;/app/user/settings/*&quot; element={&lt;SettingUser /&gt;}/&gt;
              &lt;Route path=&quot;/app/team/settings/*&quot; element={&lt;SettingTeam /&gt;}/&gt;
              {/* EN */}
              &lt;Route path=&quot;en/app/team/*&quot; element={&lt;Dashboard /&gt;}/&gt;
              &lt;Route path=&quot;en/app/user/settings/*&quot; element={&lt;SettingUser /&gt;}/&gt;
              &lt;Route path=&quot;en/app/team/settings/*&quot; element={&lt;SettingTeam /&gt;}/&gt;
            &lt;/Route&gt;
            &lt;Route path={`/`} element={&lt;Home /&gt;} /&gt;
            {/* Contact */}
            &lt;Route path=&quot;/contact&quot; element={&lt;Contact /&gt;} /&gt;
            {/* Auth */}
            &lt;Route path=&quot;/app/sign-in&quot; element={&lt;SignIn /&gt;} /&gt;
            &lt;Route path=&quot;/app/sign-up&quot; element={&lt;SignUp /&gt;} /&gt;
            &lt;Route path=&quot;/app/password/reset&quot; element={&lt;PwdReset /&gt;} /&gt;
            {/* policies */}
            &lt;Route path=&quot;/policies/privacy&quot; element={&lt;Privacy /&gt;} /&gt;
            &lt;Route path=&quot;/policies/terms&quot; element={&lt;Terms /&gt;} /&gt;
            {/* teams */}
            &lt;Route path=&quot;/teams/new/*&quot; element={&lt;NewTeam /&gt;} /&gt;
            &lt;Route path=&quot;/teams/new/channel&quot; element={&lt;SelectChannel /&gt;} /&gt;
            &lt;Route path=&quot;/teams/new/link&quot; element={&lt;Link /&gt;} /&gt;
            {/* ENGLISH */}
            &lt;Route path={`/en`} element={&lt;Home /&gt;} /&gt;
            {/* Contact */}
            &lt;Route path=&quot;/en/contact&quot; element={&lt;Contact /&gt;} /&gt;
            {/* Auth */}
            &lt;Route path=&quot;/en/app/sign-in&quot; element={&lt;SignIn /&gt;} /&gt;
            &lt;Route path=&quot;/en/app/sign-up&quot; element={&lt;SignUp /&gt;} /&gt;
            &lt;Route path=&quot;/en/app/password/reset&quot; element={&lt;PwdReset /&gt;} /&gt;
            {/* policies */}
            &lt;Route path=&quot;/en/policies/privacy&quot; element={&lt;Privacy /&gt;} /&gt;
            &lt;Route path=&quot;/en/policies/terms&quot; element={&lt;Terms /&gt;} /&gt;
            {/* teams */}
            &lt;Route path=&quot;/en/teams/new/*&quot; element={&lt;NewTeam /&gt;} /&gt;
            &lt;Route path=&quot;/en/teams/new/channel&quot; element={&lt;SelectChannel /&gt;} /&gt;
            &lt;Route path=&quot;/en/teams/new/link&quot; element={&lt;Link /&gt;} /&gt;
          &lt;/Routes&gt;
        &lt;/Wrapper&gt;
  </code></pre>