basic implementation of i18n for text

components/Sidebar.vue

@@ -2,6 +2,7 @@
   aside.nav
     .sidebar
       template(v-for='category in categories')
+        //- nuxt-link(:to='$i18n.path(category.slug)') {{ category.title }}
         nuxt-link(:to='category.slug') {{ category.title }}
 </template>
 

locales/de.json

@@ -0,0 +1,5 @@
+{
+  "general": {
+    "siteTitle": "Was ist 💎 webgems?"
+  }
+}

locales/en.json

@@ -0,0 +1,5 @@
+{
+  "general": {
+    "siteTitle": "What is 💎 webgems?"
+  }
+}

locales/fr.json

@@ -0,0 +1,5 @@
+{
+  "general": {
+    "siteTitle": "What is 💎 webgems?"
+  }
+}

pages/index.vue

@@ -1,8 +1,7 @@
 <template lang="pug">
 .welcome
   main
-    h1.text-black.font-bold.text-xl.mb-2 What is&nbsp;
-      span 💎 webgems?
+    h1.text-black.font-bold.text-xl.mb-2 {{ $t('general.siteTitle') }}
     p Webgems is a goto place for devs and designers to find new resources and more. As a beginner it's sometimes not easy to find what you need since you don't know what you should look for.
     p Therefore i created this project to have the most common and best resources for beginners and veterans in one place. Kinda like a bookmarks list for devs and designers, containing only the best gems out there.
     p If you want to add your own gem, go ahead and open a pull request on github (click on that octocat at the top right corner).&nbsp;