feat: add MDX support and blog functionality

- Updated next.config.ts to include MDX support with new page extensions.
- Added dependencies for MDX in package.json.
- Refactored Home component to include BlogList.
- Adjusted layout and styling in Projects and Timeline components.
- Implemented dynamic blog post routing with generateStaticParams and BlogPost component.
- Created BlogLayout for consistent blog page structure.
- Added initial blog post in MDX format.
- Developed BlogList component to display a list of blog posts.
- Introduced blog utility functions to read and parse MDX files.

src/lib/blog.ts

@@ -0,0 +1,42 @@
+"use server";
+
+import { readdirSync, readFileSync } from "fs";
+import { join } from "path";
+import matter from "gray-matter";
+
+export interface Post {
+  slug: string;
+  title: string;
+  description: string;
+  date: string;
+  tags?: string[];
+}
+
+export async function getPosts(): Promise<Post[]> {
+  const postsDir = join(process.cwd(), "src/app/blog/posts");
+  const files = readdirSync(postsDir).filter((file) => file.endsWith(".mdx"));
+
+  const posts = files
+    .map((file) => {
+      const filePath = join(postsDir, file);
+      const fileContent = readFileSync(filePath, "utf-8");
+      const { data } = matter(fileContent);
+      const slug = file.replace(".mdx", "");
+
+      return {
+        slug,
+        title: data.title || "Untitled",
+        description: data.description || "",
+        date: data.date || "",
+        tags: data.tags || [],
+      };
+    })
+    .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+
+  return posts;
+}
+
+export async function getPostBySlug(slug: string): Promise<Post | null> {
+  const posts = await getPosts();
+  return posts.find((post) => post.slug === slug) || null;
+}