英語対応する

[0si43]

• コンテンツは完全日本語となっているが、日本語ノンネイティブのユーザー向けに英語コンテンツを出す
• ブラウザの言語設定を見て、コンテンツを出しわける
• ヘッダーかフッターから「JP / EN」みたいに選択できるようにする
• ブログ記事全文に英訳を用意するのは非現実的なので、機械翻訳かな？
• 機械翻訳が簡単に使えたら、理想は英語以外にも対応したいが、そこは調べてみて……という感じ

[0si43]

国際化対応をWebだとi18nと呼ぶらしい

https://nextjs.org/docs/advanced-features/i18n-routing

[0si43]

自分で翻訳文全部用意するなら

https://qiita.com/mojibakeo/items/25930bb6eee33594af54

[0si43]

こんなnext.config.jsを書くと、

module.exports = {
    i18n: {
      locales: ['ja', 'en-US'],
      defaultLocale: 'ja',
      domains: [
        {
          domain: 'example.com',
          defaultLocale: 'ja',
        },
        {
          domain: 'example.en-US',
          defaultLocale: 'en-US',
        },
      ],
    },
  }

domain/en-US という名前でindexページを生成してくれる

できればブラウザの機械翻訳にお任せして、と思ってるんだけど、なんか上手く働いてくれないな

[0si43]

機械翻訳以外で変えたい部分ってここぐらいなので、ここだけ↓みたいに対応すればいいか

const { locale } = useRouter()

{locale === 'ja' ? '（しとみ）' : '(Shetommy)'}

[0si43]

next.config.jsでjapaneseしか対応してないことを明記しようかとも思ったけど、

module.exports = {
    i18n: {
      locales: ['ja'],
      defaultLocale: 'ja',
    },
  }

これをやっちゃうとrouterがjapaneseになっちゃうようでした

[0si43]

Chromeの翻訳噛ました状態。
冗長だったり、ニュアンスがちょっと違ったりはあるんだけど、意味は七割ぐらいは通るかなという感じの仕上がり。
これでいいかな