diff --git a/src/lib/types.d.ts b/src/lib/types.d.ts
new file mode 100644
index 0000000..216354f
--- /dev/null
+++ b/src/lib/types.d.ts
@@ -0,0 +1,6 @@
+import type { SvelteComponent } from "svelte";
+
+
+interface MDsveXComponent extends SvelteComponent {
+    metadata: Record<string, unknown>;
+}
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index e3a1e68..bf7ab51 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
+	import type { MDsveXComponent } from '$lib/types';
 	import type { SvelteComponent } from 'svelte';
 
 	const blog_entries: [string, SvelteComponent][] = Object.entries(
 		import.meta.glob('/src/routes/blogs/**/+page.svx', { eager: true })
 	).map(([key, value]) => [
 		key.split('/src/routes').pop()?.split('/+page.svx').slice(0, -1).pop() as string,
-		value as SvelteComponent
+		value as MDsveXComponent
 	]);
 	console.log(blog_entries);
 </script>
@@ -13,5 +14,5 @@
 <h1>Welcome to SvelteKit</h1>
 <p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
 {#each blog_entries as [href, page]}
-	<a {href}>{href}</a><br />
+	<a {href}>{page.metadata?.title}</a><br />
 {/each}
diff --git a/src/routes/blogs/test/+page.svx b/src/routes/blogs/test/+page.svx
index 7725386..f4367f8 100644
--- a/src/routes/blogs/test/+page.svx
+++ b/src/routes/blogs/test/+page.svx
@@ -1,5 +1,5 @@
 ---
-layout: blog
+title: "Blog Entry #1"
 ---
 
 # Title
@@ -9,3 +9,10 @@ layout: blog
 1. asd
 2. asd
 3. asd
+
+```js
+{..., lib}:
+{
+    "hello" = "world";
+}
+```
\ No newline at end of file