Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Milestone task]: SPA部分の実装方法の検討 #91

Open
nkte8 opened this issue Apr 11, 2024 · 4 comments
Open

[Milestone task]: SPA部分の実装方法の検討 #91

nkte8 opened this issue Apr 11, 2024 · 4 comments
Assignees
Labels
enhancement New feature or request

Comments

@nkte8
Copy link
Owner

nkte8 commented Apr 11, 2024

How it would to do to accomplish?

Astroでi18nを実装するにあたって、どのようにページの生成を行うかを検討する
SPAページ部分、具体的にはsrc/pages/app.astroおよびsrc/component/Client配下のコンポーネントの実装方法を検討する

What it should do to accomplish?

具体的な実装方法の考案・提示

@nkte8 nkte8 added the enhancement New feature or request label Apr 11, 2024
@nkte8 nkte8 self-assigned this Apr 11, 2024
so-asano added a commit that referenced this issue Apr 12, 2024
nkte8 pushed a commit that referenced this issue Apr 13, 2024
nkte8 pushed a commit that referenced this issue Apr 13, 2024
@nkte8 nkte8 changed the title [Milestone task]: 動的ページ部分の実装方法の検討 [Milestone task]: SPA部分の実装方法の検討 Apr 13, 2024
@so-asano
Copy link
Collaborator

@nkte8
調査・実験した結果を報告します。

実現したかったこと

  • 言語コードをパスに含んだルーティングの実装の容易化
  • 翻訳ファイルの導入とその適用

試したこと

結果

  • astro-i18next は環境の問題で導入できなかった
  • paraglide は導入が煩雑だったため却下した
  • astro-i18n-aut は導入でき、言語ごとのパスの作成とパスからの言語判別まではできた
  • astro-i18n は導入でき、翻訳ファイルの導入とその適用ができた

結論

  • astro-i18n-autastro-i18n の組み合わせでいくのがよいかもしれない

さらなる検討事項

  • 翻訳ファイルで対応しきれない場合(ドキュメントページなど)はどうするか
  • リンクに関しては astro-i18n の機能でパスに現在の言語コードを含めることができるが、それ以外のケースではどう対応するか
  • 翻訳ファイルに関して、ファイルの分け方、ネームスペースの使いかた、キーの命名規則などを決める必要がある

@nkte8
Copy link
Owner Author

nkte8 commented Apr 13, 2024

補足

パッケージの選出は Astro公式ドキュメントのCommunity librariesから選出している
https://docs.astro.build/ja/recipes/i18n/

@so-asano
Copy link
Collaborator

@nkte8
調査・実験した結果を報告します。

実現したかったこと

  • ドキュメントページに .md ファイルの内容をレンダリングする
  • 言語別に .md ファイルを用意し、パスに含まれる言語コードにしたがって出し分ける

結果

  • プレビューの /i18ntest//en/i18ntest/ を参照のこと
  • ほぼうまくいったが、デプロイ先の環境だとなぜか /ja/ がうまくいかない

結論

  • この方法を採用してもよいとおもう

さらなる検討事項

  • .mdx ファイルもおそらく使える。ドキュメントでより柔軟な表現をおこなうためにはこちらのほうがいいかもしれない
  • Lint のエラーが残っているので対応が必要かもしれない(いまはコメントで無視させている)
  • フォールバックの処理をいれていないので、/fr/ などとすると 404 になる

@nkte8
Copy link
Owner Author

nkte8 commented Apr 14, 2024

@so-asano Discordで出した話を記載します

リダイレクトの指向性変更について

  • 現在検証ではデフォルト言語から元のパス(文字コードなし)にリダイレクトしている動作を行っているが、逆に、元のパス(文字コードなし)から言語ありのパスにリダイレクトできないか
    • 文字コードなしで問題が発生しないが文字コードありで問題が発生する、みたいな事象が起きた際に、フィードバックの観点で問題の発覚が難しくなることを懸念している
  • デフォルトの /ja/ -> / のリダイレクトを無効にはできる
  • Astro側でSSRモードであればリダイレクト自体を制御することは可能
    • ライブラリとの共存が可能であるかの懸念あり
    • リダイレクトするページのサンプルを作成する → @nkte8

リダイレクトの方法(Astro Reference)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
Status: No status
Development

No branches or pull requests

2 participants