diff --git a/webapp/src/routes/__error.svelte b/webapp/src/routes/__error.svelte
new file mode 100644
index 0000000..27c027c
--- /dev/null
+++ b/webapp/src/routes/__error.svelte
@@ -0,0 +1,19 @@
+<script context="module" lang="ts">
+	import type { Load } from '@sveltejs/kit';
+
+	export const load: Load = ({ error, status }) => {
+		return {
+			props: {
+				title: `${status}: ${error?.message}`
+			}
+		};
+	};
+</script>
+
+<script lang="ts">
+	export let title: string;
+</script>
+
+<div class="prose max-w-2xl">
+	<h1>{title}</h1>
+</div>
diff --git a/webapp/src/routes/note/[id].svelte b/webapp/src/routes/note/[id].svelte
index 4b1e851..60c90cd 100644
--- a/webapp/src/routes/note/[id].svelte
+++ b/webapp/src/routes/note/[id].svelte
@@ -5,14 +5,27 @@
 	export const load: Load = async ({ params, fetch, session, stuff }) => {
 		const url = `${import.meta.env.VITE_BACKEND_URL}/note/${params.id}`;
 		const response = await fetch(url);
-		const note: EncryptedNote = await response.json();
 
-		note.insert_time = new Date(note.insert_time as unknown as string);
-
-		return {
-			status: response.status,
-			props: { note }
-		};
+		if (response.ok) {
+			try {
+				const note: EncryptedNote = await response.json();
+				note.insert_time = new Date(note.insert_time as unknown as string);
+				return {
+					status: response.status,
+					props: { note }
+				};
+			} catch {
+				return {
+					status: 500,
+					error: response.statusText
+				};
+			}
+		} else {
+			return {
+				status: response.status,
+				error: response.statusText
+			};
+		}
 	};
 </script>