diff --git a/src/components/ui/avatars/AvatarBlog.astro b/src/components/ui/avatars/AvatarBlog.astro
deleted file mode 100644
index d104064..0000000
--- a/src/components/ui/avatars/AvatarBlog.astro
+++ /dev/null
@@ -1,22 +0,0 @@
----
-// Import necessary components
-import { Image } from "astro:assets";
-
-import type { CollectionEntry } from "astro:content";
-
-const { blogEntry } = Astro.props;
-
-interface Props {
-  blogEntry: CollectionEntry<"blog">;
-}
----
-
-<div class="flex-shrink-0">
-  <Image
-    class="size-[46px] rounded-full border-2 border-neutral-50"
-    src={blogEntry.data.authorImage}
-    alt={blogEntry.data.authorImageAlt}
-    draggable={"false"}
-    format={"avif"}
-  />
-</div>
diff --git a/src/components/ui/avatars/AvatarBlogLarge.astro b/src/components/ui/avatars/AvatarBlogLarge.astro
deleted file mode 100644
index 7b94664..0000000
--- a/src/components/ui/avatars/AvatarBlogLarge.astro
+++ /dev/null
@@ -1,22 +0,0 @@
----
-// Import necessary components
-import { Image } from "astro:assets";
-
-import type { CollectionEntry } from "astro:content";
-
-const { blogEntry } = Astro.props;
-
-interface Props {
-  blogEntry: CollectionEntry<"blog">;
-}
----
-
-<div class="flex-shrink-0">
-  <Image
-    class="size-10 rounded-full sm:h-14 sm:w-14"
-    src={blogEntry.data.authorImage}
-    alt={blogEntry.data.authorImageAlt}
-    draggable={"false"}
-    format={"avif"}
-  />
-</div>
diff --git a/src/components/ui/cards/CardBlog.astro b/src/components/ui/cards/CardBlog.astro
deleted file mode 100644
index 8f3ba76..0000000
--- a/src/components/ui/cards/CardBlog.astro
+++ /dev/null
@@ -1,70 +0,0 @@
----
-// Import necessary components and utilities
-import AvatarBlog from "@components/ui/avatars/AvatarBlog.astro";
-import { Image } from "astro:assets";
-import { formatDate } from "@utils/utils";
-import type { CollectionEntry } from "astro:content";
-
-const { blogEntry, blogLocale = "" } = Astro.props;
-
-interface Props {
-  blogEntry: CollectionEntry<"blog">;
-  blogLocale?: string;
-}
----
-
-<!-- The following anchor tag is the main container for the card.
-     It's a link to the blog post detailed page.
-     The data-astro-prefetch is an Astro specific Dynamic HTML feature,
-     which automatically prefetches the linked page to speed up navigation. -->
-<a
-  class="group relative block rounded-xl outline-none ring-zinc-500 transition duration-500 focus-visible:ring dark:ring-zinc-200 dark:focus:outline-none"
-  href={blogLocale && blogLocale !== "en"
-    ? `/${blogLocale}/blog/${blogEntry.id.replace(/^fr\//, "")}/`
-    : `/blog/${blogEntry.id.replace(/^en\//, "")}/`}
-  data-astro-prefetch
->
-  <!-- The container for the blog post's cover image. Uses astro:assets' Image for image source -->
-  <div
-    class="relative h-[350px] w-full flex-shrink-0 overflow-hidden rounded-xl before:absolute before:inset-x-0 before:z-[1] before:size-full before:bg-gradient-to-t before:from-neutral-900/[.7]"
-  >
-    <Image
-      class="absolute start-0 top-0 size-full object-cover transition duration-500 group-hover:scale-110"
-      src={blogEntry.data.cardImage}
-      alt={blogEntry.data.cardImageAlt}
-      draggable={"false"}
-      loading={"eager"}
-      format={"avif"}
-    />
-  </div>
-  <!-- The container for the blog author's avatar and associated metadata (author name and publication date) -->
-  <div class="absolute inset-x-0 top-0 z-10">
-    <div class="flex h-full flex-col p-4 sm:p-6">
-      <div class="flex items-center">
-        <AvatarBlog blogEntry={blogEntry} />
-
-        <div class="ms-2.5 sm:ms-4">
-          <h4 class="font-bold text-neutral-50">
-            {blogEntry.data.author}
-          </h4>
-          <p class="text-xs text-neutral-50/[.8]">
-            {formatDate(blogEntry.data.pubDate)}
-          </p>
-        </div>
-      </div>
-    </div>
-  </div>
-  <!-- The container for the blog post's title and description -->
-  <div class="absolute inset-x-0 bottom-0 z-10">
-    <div class="flex h-full flex-col p-4 sm:p-6">
-      <h3
-        class="text-balance text-lg font-bold text-neutral-50 group-hover:text-neutral-50/[.8] sm:text-3xl"
-      >
-        {blogEntry.data.title}
-      </h3>
-      <p class="mt-2 text-pretty text-neutral-50/[.8]">
-        {blogEntry.data.description}
-      </p>
-    </div>
-  </div>
-</a>
diff --git a/src/components/ui/cards/CardBlogRecent.astro b/src/components/ui/cards/CardBlogRecent.astro
deleted file mode 100644
index fbc430d..0000000
--- a/src/components/ui/cards/CardBlogRecent.astro
+++ /dev/null
@@ -1,66 +0,0 @@
----
-// Import all required components and utilities
-import { Image } from "astro:assets";
-import type { CollectionEntry } from "astro:content";
-import AvatarBlogLarge from "@components/ui/avatars/AvatarBlogLarge.astro";
-import PrimaryCTA from "@components/ui/buttons/PrimaryCTA.astro";
-
-const { blogEntry, recentBlogLocale = "" } = Astro.props;
-
-interface Props {
-  blogEntry: CollectionEntry<"blog">;
-  recentBlogLocale?: string;
-}
----
-
-<!-- Root container, which is divided into 2 grid column layout for larger screens -->
-<div class="grid gap-8 sm:grid-cols-2 sm:items-center">
-  <!-- Container for the blog post's cover image -->
-  <div class="sm:order-2">
-    <div class="relative rounded-lg pt-[50%] sm:pt-[100%]">
-      <Image
-        class="absolute start-0 top-0 size-full rounded-xl object-cover"
-        src={blogEntry.data.cardImage}
-        alt={blogEntry.data.cardImageAlt}
-        draggable={"false"}
-        loading={"eager"}
-        format={"avif"}
-      />
-    </div>
-  </div>
-  <!-- Container for the blog post's heading, author avatar, author's role, and read more button -->
-  <div class="sm:order-1">
-    <!-- Blog title which is also a hyperlink to the blog detail page  -->
-    <h2
-      class="text-balance text-2xl font-bold tracking-tight text-neutral-800 dark:text-neutral-200 md:text-3xl lg:text-4xl lg:leading-tight xl:text-5xl xl:leading-tight"
-    >
-      <a
-        class="outline-none ring-zinc-500 transition duration-300 hover:text-orange-400 focus-visible:ring dark:text-neutral-300 dark:ring-zinc-200 dark:hover:text-neutral-50 dark:focus:outline-none"
-        href={recentBlogLocale && recentBlogLocale !== "en" ? `/${recentBlogLocale}/blog/${blogEntry.id.replace(/^fr\//, '')}/` : `/blog/${blogEntry.id.replace(/^en\//, '')}/`}
-      >
-        {blogEntry.data.description}
-      </a>
-    </h2>
-    <!-- Container for the author's avatar and metadata -->
-    <div class="mt-6 flex items-center sm:mt-10">
-      <AvatarBlogLarge blogEntry={blogEntry} />
-
-      <div class="ms-3 sm:ms-4">
-        <p class="font-bold text-neutral-800 dark:text-neutral-200 sm:mb-1">
-          {blogEntry.data.author}
-        </p>
-        <p class="text-xs text-neutral-500">
-          {blogEntry.data.role}
-        </p>
-      </div>
-    </div>
-    <!-- Read More button which is a link to the blog post detailed page -->
-    <div class="mt-5">
-      <PrimaryCTA
-        url={recentBlogLocale && recentBlogLocale !== "en" ? `/${recentBlogLocale}/blog/${blogEntry.id.replace(/^fr\//, '')}/` : `/blog/${blogEntry.id.replace(/^en\//, '')}/`}
-        title="Read More"
-        data-astro-prefetch
-      />
-    </div>
-  </div>
-</div>
diff --git a/src/components/ui/cards/CardRelated.astro b/src/components/ui/cards/CardRelated.astro
deleted file mode 100644
index 118bc92..0000000
--- a/src/components/ui/cards/CardRelated.astro
+++ /dev/null
@@ -1,41 +0,0 @@
----
-// Import necessary modules and utilities
-import { Image } from "astro:assets";
-import { formatDate } from "@utils/utils";
-import type { CollectionEntry } from "astro:content";
-
-const { blogEntry, recentBlogLocale = "" } = Astro.props;
-
-interface Props {
-  blogEntry: CollectionEntry<"blog">;
-  recentBlogLocale?: string;
-}
----
-
-<a
-  class="group block rounded-xl outline-none ring-zinc-500 transition duration-300 focus-visible:ring dark:ring-zinc-200 dark:focus:outline-none"
-  href={recentBlogLocale && recentBlogLocale !== "en"
-    ? `/${recentBlogLocale}/blog/${blogEntry.id.replace(/^fr\//, "")}/`
-    : `/blog/${blogEntry.id.replace(/^en\//, "")}/`}
-  data-astro-prefetch
->
-  <div>
-    <Image
-      class="aspect-video rounded-xl"
-      src={blogEntry.data.cardImage}
-      alt={blogEntry.data.cardImageAlt}
-      draggable={"false"}
-      format={"avif"}
-    />
-    <!-- The title of the blog post -->
-    <h3
-      class="mt-2 text-balance text-lg font-medium text-neutral-800 group-hover:text-orange-400 dark:text-neutral-300 dark:group-hover:text-neutral-50"
-    >
-      {blogEntry.data.title}
-    </h3>
-    <!-- The formatted publication date of the blog post -->
-    <p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400">
-      {formatDate(blogEntry.data.pubDate)}
-    </p>
-  </div></a
->
diff --git a/src/pages/index.astro b/src/pages/index.astro
index c82ca47..92aa06b 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -27,9 +27,6 @@ const avatarSrcs: Array<string> = [
   "https://images.unsplash.com/photo-1492562080023-ab3db95bfbce?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80",
 ];
 
-const posts = await getCollection("blog");
-
-console.log("posts", posts)
 ---
 
 <MainLayout>