Fixing the invisibles posts

src/pages/blog/index.vue

@@ -37,10 +37,10 @@
 </template>
 
 <script lang="ts">
-import {useAsync, useContext} from "@nuxtjs/composition-api";
+import {defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
 import {Post} from "../../../@types/types";
 
-export default {
+export default defineComponent({
   name: "blog",
   head() {
     return {
@@ -61,5 +61,5 @@ export default {
       posts,
     }
   }
-}
+})
 </script>

src/pages/index.vue

@@ -2,20 +2,43 @@
   <main>
     <Banner />
     <AboutHome />
-    <PostsHome />
-    <ProjectsHome />
+    <PostsHome :posts="posts"/>
+    <ProjectsHome :projects="projects"/>
     <AdHome />
   </main>
 </template>
 
 <script lang="ts">
 import Vue from 'vue'
+import {useAsync, useContext} from "@nuxtjs/composition-api";
+import {Post, Project} from "../../@types/types";
 
 export default Vue.extend({
   head() {
     return {
       title: 'Arthur Danjou - FullStack Web & Software Developer'
     }
+  },
+  setup() {
+    const { $content, i18n } = useContext()
+
+    const projects = useAsync(() => {
+      return $content(`projects`)
+        .limit(3)
+        .fetch<Project>()
+    })
+
+    const posts = useAsync(() => {
+      return $content(`articles/${i18n.locale}`)
+        .sortBy('date', 'asc')
+        .limit(3)
+        .fetch<Post>()
+    })
+
+    return {
+      posts,
+      projects
+    }
   }
 })
 </script>