👽️ Render data using @primicio/helpers package #14

package.json

@@ -16,6 +16,7 @@
 	},
 	"type": "module",
 	"dependencies": {
+		"@prismicio/helpers": "^2.3.8",
 		"boxicons": "^2.1.4"
 	}
 }

src/components/+nav.svelte

@@ -0,0 +1,27 @@
+<script>
+  import { page } from "$app/stores";
+</script>
+
+<nav>
+    <h1>logo</h1>
+    <ul>
+        <li><a href="/">Home</a></li>
+        <li><a href="/diensten">Diensten</a></li>
+        <li><a href="/over">Over ons</a>/li>
+        <li><a href="/contact">Contact</a></li>
+    </ul>
+</nav>
+
+<style>
+  /* NAV MENU */
+  nav {
+    display: flex;
+    max-width: 1000px;
+    width: 100%;
+    margin: 0 auto;
+    justify-content: space-between;
+  }
+  ul{
+    display: flex;
+  }
+</style>

src/routes/+layout.svelte

@@ -0,0 +1,12 @@
+<script>
+ import { page } from "$app/stores";
+ import Nav from "../components/+nav.svelte";
+
+
+</script>
+
+<header>
+    <Nav></Nav>
+</header>
+<slot/>
+

src/routes/+page.js

@@ -0,0 +1,17 @@
+import createClient from "$lib/vendors/prismicClient.js";
+
+export async function load({ fetch, request }) {
+
+  const client = createClient({ fetch, request })
+  const documents = await client.getAllByType('homepage')
+
+    if (documents) {
+        return { 
+          documents
+        }
+    }
+
+    return {
+        status: 404,
+    }
+}

src/routes/+page.svelte

@@ -1,2 +1,14 @@
-<h1>Welcome to SvelteKit</h1>
-<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
+<script>
+      import * as prismicH from "@prismicio/helpers";
+      
+      export let data;
+      const textfield = data.documents[0].data.ritch_text_field
+      console.log(data.documents[0].data.ritch_text_field)
+</script>
+
+<h1>Dit is de home pagina</h1>
+
+<h2>api data</h2>
+{@html prismicH.asHTML(textfield)}
+
+<!-- <pre>{JSON.stringify(data, null, 2)}</pre> -->

src/routes/contact/+page.js

@@ -0,0 +1,17 @@
+import createClient from "$lib/vendors/prismicClient.js";
+
+export async function load({ fetch, request }) {
+
+  const client = createClient({ fetch, request })
+  const documents = await client.getAllByType('page')
+
+    if (documents) {
+        return { 
+          documents
+        }
+    }
+
+    return {
+        status: 404,
+    }
+}

src/routes/contact/+page.svelte

@@ -0,0 +1,8 @@
+<script>
+      export let data;
+      console.log(data.documents)
+</script>
+
+<h1>contact pagina</h1>
+
+<pre>{JSON.stringify(data, null, 2)}</pre>