Finally structure for the project

Language versions, translations in separate files.

astro.config.mjs

@@ -31,5 +31,9 @@ export default defineConfig({
     routing: {
       prefixDefaultLocale: true
     },
+    fallback: {
+      de: "en",
+      fr: "en"
+    },
   }
 });

src/i18n/cs.js

@@ -0,0 +1,3 @@
+export const cs = {
+	title: "CS Test",
+};

src/i18n/de.js

@@ -0,0 +1,3 @@
+export const de = {
+	title: "DE Test",
+};

src/i18n/dictionary.js

@@ -0,0 +1,11 @@
+import { cs } from "./cs";
+import { de } from "./de";
+import { en } from "./en";
+import { fr } from "./fr";
+
+export const dictionary = {
+	en: en,
+	fr: fr,
+	de: de,
+	cs: cs
+};

src/i18n/en.js

@@ -0,0 +1,3 @@
+export const en = {
+	title: "EN Test",
+};

src/i18n/fr.js

@@ -0,0 +1,3 @@
+export const fr = {
+	title: "FR Test",
+};

src/pages/[lang]/index.astro

@@ -1,6 +1,8 @@
 ---
 import { getLocaleByPath } from "astro:i18n";
 import MainLayout from "../../layouts/MainLayout.astro";
+import { dictionary } from "../../i18n/dictionary";
+const { title } = dictionary[Astro.currentLocale];
 
 export async function getStaticPaths() {
   return ["en", "fr", "cs", "de"].map((lang) => {
@@ -9,11 +11,9 @@ export async function getStaticPaths() {
 }
 ---
 
-<MainLayout title="sitetitle" description="sitedescription" lang={Astro.currentLocale}>
+<MainLayout title={title} description="sitedescription" lang={Astro.currentLocale}>
   <h1>Welcome</h1>
   <p>
-    "homeP1"
     {Astro.url.toString()}
-    {getLocaleByPath(Astro.currentLocale)}
   </p>
 </MainLayout>

src/pages/index.astro

@@ -1,6 +1,12 @@
 ---
 import { getLocaleByPath } from "astro:i18n";
 import MainLayout from "../layouts/MainLayout.astro";
+
+// Don't remove - redirects user to language version for the preffered language
+if (Astro.preferredLocale) {
+  return Astro.redirect(`/${Astro.preferredLocale}/`);
+}
+
 ---
 
 <MainLayout title="sitetitle" description="sitedescription" lang="en">