What is the best way to translate slugs in the official i18n Astro?

[clever saffron]

Currently, I feel like I'm repeating a lot of code by duplicating the same 'index.astro', but I can't find information...

Additionally, the folder structure ends up quite messy and disorganized...

Furthermore, I have also been forced to make each page a component, which again triples the folder structure

I haven't found a better solution, to be honest, it's really been bothering me.

/pages
  /es
    /sobre-nosotros
      index.astro
  index.astro
  /about-us
    index.stro
/components
  /pages
    MainPage.astro
    AboutUsPage.astro

[cosmic tendon]

i18n from Astro itself isn't there yet. I just use i18next integration of Astro everytime i need multiple languages on a site. https://github.com/yassinedoghri/astro-i18next

[cyan saffron]

I'm currently in a similar position as OP. Using an integration isn't cutting it for me, I want to know the best practice for what we have in Astro. Here is a similar discussion, with some useful hints: https://discord.com/channels/830184174198718474/1196093973899509791

[dreamy lance]

You could do something like:

src/pages/[lang]/index.astro

then use the lang from params to display the correct content.
https://docs.astro.build/en/guides/routing/#dynamic-routes

[paper nova]

you can check my repo https://github.com/RodrigoTomeES/cv I recently implemented i18n following this documentation:

• https://docs.astro.build/en/recipes/i18n
• https://docs.astro.build/en/guides/internationalization

[cyan saffron]

That's what I'm doing in parts, but it's not that simple if you want to set prefixDefaultLocale: false

[cyan saffron]

Awesome, I will check it out later! Had a hard time finding implementations which use Astro's internal i18n capabilities. I wish we could get an i18n recipe, which use them.

[cyan saffron]

Very interesting, thanks for sharing! I didn't put the content for my default language in its separate folder and can see now, that it might be good idea to do that. One thing which still confuses the hell out of me is, why do we need src/i18n/config.ts, if we now can configure i18n in astro.config.mjs (https://docs.astro.build/en/guides/internationalization/#configure-i18n-routing)? And as a follow up question (which, I guess, shows my lack of basic JS knowledge 😬 ), if we configure it in astro.config.mjs, how can we access the properties defaultLocale and locales when needed?

[zenith ice]

I had the same issues and questions and set up this starter: https://github.com/kslstn/astro-i18n-blog-starter

I define the locales in i18n.ts and import those to astro.config.js. I don't know why it's not set up like that in the docs, as the whole point of a good i18n setup is that you don't have maintain settings in multiple places.

Anyway, IMO the marketing material around the i18n features aren't factually incorrect, but give the impression of being more than what it is. It's far from what a complete, flexible implementation may need. My hope is that the team had more in mind and will ship more later on. I tried to set up the starter in such a way that the additions are hopefully easy to replace with new, native functions.

i18n Next may be better in many respects, but I'm afraid that building the foundations on that right now will make it difficult to replace it with future built-in Astro features. Not sure if that fear is justified—I just don't know it well enough.

[cyan saffron]

Very interesting approach, thanks for this! "the whole point of a good i18n setup is that you don't have maintain settings in multiple places" I coudn't agree more...

[paper nova]

Yes, I also did that so I could access the object and reuse it

[cyan saffron]

I get that it might make more sense to use something like i18next, but I want to first understand why I have to use it, respectively what the current built-in implementation is lacking. I totally agree, that the current docs don't do a good job selling the i18n feature, recipes/i18n and guides/internationalization kind of trample on each others toes.

[paper nova]

You can't I think, for that reason I used a separate file and later I imported it in astro config

Anyway I think the documentation and Astro implementation is better than Next.js default i18n

[cyan saffron]

That's what I thought. It's really stupid how much this bothers me 😆