diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 7f8d6d2..487f1cc 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2,12 +2,29 @@
 	import Card from '@/components/ui/card/card.svelte';
 	import type { Post } from '../types';
 	import { Content } from '@/components/ui/card';
+  import { apiBase } from '@/stores/url';
 
-	interface Props {
-		posts: Post[];
-	}
+  $effect(async()=>{
+      await getPosts();
+  });
+
+  let posts: Post[] = $state([]);
+
+  async function getPosts() {
+	    const { subscribe } = apiBase;
+	    let baseUrl: string = '';
+
+	    subscribe((value) => {
+		      baseUrl = value;
+	    })();
+
+	    const req = await fetch(`${baseUrl}/api/posts/timeline?pageSize=3`);
+	    if (req.ok){
+          posts = await req.json();
+      }
+
+  }
 
-	let { posts = [] }: Props = $props();
 </script>
 
 <div class="flex min-h-fit w-full items-center justify-center p-6 md:p-10">
diff --git a/src/routes/+page.ts b/src/routes/+page.ts
index ff3a798..77ab0a0 100644
--- a/src/routes/+page.ts
+++ b/src/routes/+page.ts
@@ -1,16 +1 @@
-import { apiBase } from '@/stores/url';
-
 export const ssr = true;
-
-export async function load({}) {
-	const { subscribe } = apiBase;
-	let baseUrl: string = '';
-
-	subscribe((value) => {
-		baseUrl = value;
-	})();
-
-	const req = await fetch(`${baseUrl}/Posts`);
-	if (req.ok) return { posts: req };
-	else return { posts: [] };
-}