Global access to post summaries for all posts on site

jsconfig.json

@@ -9,7 +9,8 @@
 		"skipLibCheck": true,
 		"sourceMap": true,
 		"strict": true,
-		"moduleResolution": "bundler"
+		"moduleResolution": "bundler",
+        "allowImportingTsExtensions": true
 	}
 	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
 	//

src/routes/+layout.server.ts

@@ -0,0 +1,32 @@
+/*
+    * Provides post summaries to all pages. That means every page can access summaries
+    * for all posts on the website.
+*/
+
+import { posts } from './post/data.js';
+
+// Basically the same as Post but might contain less infomation - save storage
+type Summary = {
+    url : string,
+    title : string,
+    description : string,
+    creation_date : number,
+    modification_date: number,
+};
+
+export function load() {
+    let summaries : Summary[] = [];
+
+    posts.map((post) => {
+        let summary : Summary = {
+            url: post.url,
+            title : post.title,
+            description : post.description,
+            creation_date : post.creation_date,
+            modification_date : post.modification_date
+        };
+        summaries.push(summary);
+    });
+
+    return { summaries };
+}

src/routes/+page.svelte

@@ -1,7 +1,18 @@
+<script lang="ts">
+    export let data;
+</script>
+
 <div class="main-title">
     <h1>The Deprived Devs</h1>
 </div>
 
+<h1>Recent posts on Deprived.dev</h1>
+<ul>
+    <!-- TODO: Filter by date or something -->
+    {#each data.summaries as summary}
+        <li><a href="/post/{summary.url}">{summary.title}</a></li>
+    {/each}
+</ul>
 
 <style>
     .main-title {

src/routes/post/+page.server.ts

@@ -1,20 +0,0 @@
-import { posts } from './data.js';
-
-// Basically the same as Post but might contain less infomation - save storage
-// type Summary = {
-//     url : string,
-//     title : string,
-//     description : string,
-//     creation_date : number,
-//     modification_date: number,
-// };
-
-export function load() {
-    return {
-        summaries: posts.map((post) => ({
-            url: post.url,
-            title: post.title,
-            description: post.description
-        }))
-    };
-}

src/routes/post/+page.svelte

@@ -1,8 +1,8 @@
-<script>
+<script lang="ts">
     export let data;
 </script>
 
-<p>hello</p>
+<h1>All posts on deprived.dev!</h1>
 <ul>
     {#each data.summaries as summary}
         <li><a href="/post/{summary.url}">{summary.title}</a></li>

svelte.config.js

@@ -1,7 +1,9 @@
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 import adapter from '@sveltejs/adapter-static';
 
 /** @type {import('@sveltejs/kit').Config} */
 export default {
+    preprocess: vitePreprocess(),
 	kit: {
         prerender: {
             handleHttpError: 'fail'