diff --git a/frontend/Dockerfile b/frontend/Dockerfile
index 269e10e..362d54e 100644
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -5,6 +5,7 @@ FROM node:16 as builder
 # ENV API_URL=http://api:80
 ENV API_URL=https://mawoka.eu
 ENV REDIS_URL=$REDIS
+ENV VITE_SENTRY=https://4981de1f72f24fd7b5e21b8913b93a02@o661934.ingest.sentry.io/6254641
 # change working directory
 WORKDIR /usr/src/app
 
diff --git a/frontend/package.json b/frontend/package.json
index 151e258..629ee5e 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -15,6 +15,8 @@
 	"devDependencies": {
 		"@felte/validator-yup": "^1.0.1",
 		"@fontsource/marck-script": "^4.5.2",
+		"@sentry/browser": "^6.18.2",
+		"@sentry/tracing": "^6.18.2",
 		"@sveltejs/adapter-auto": "next",
 		"@sveltejs/adapter-node": "^1.0.0-next.70",
 		"@sveltejs/kit": "next",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index f332e18..36a7c54 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -3,6 +3,8 @@ lockfileVersion: 5.3
 specifiers:
   '@felte/validator-yup': ^1.0.1
   '@fontsource/marck-script': ^4.5.2
+  '@sentry/browser': ^6.18.2
+  '@sentry/tracing': ^6.18.2
   '@sveltejs/adapter-auto': next
   '@sveltejs/adapter-node': ^1.0.0-next.70
   '@sveltejs/kit': next
@@ -39,6 +41,8 @@ specifiers:
 devDependencies:
   '@felte/validator-yup': 1.0.1_yup@0.32.11
   '@fontsource/marck-script': 4.5.2
+  '@sentry/browser': 6.18.2
+  '@sentry/tracing': 6.18.2
   '@sveltejs/adapter-auto': 1.0.0-next.31
   '@sveltejs/adapter-node': 1.0.0-next.70
   '@sveltejs/kit': 1.0.0-next.295_sass@1.49.9+svelte@3.46.4
@@ -196,6 +200,69 @@ packages:
       picomatch: 2.3.1
     dev: true
 
+  /@sentry/browser/6.18.2:
+    resolution: {integrity: sha512-EsqKSNboi2gOiMuEwQranLucxrARi00y2vgUnaPXcqTKTlVlHDetoWHvq8/r29idA1JHGka5tDrwrmWccWIkrg==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/core': 6.18.2
+      '@sentry/types': 6.18.2
+      '@sentry/utils': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
+  /@sentry/core/6.18.2:
+    resolution: {integrity: sha512-r5ad/gq5S/JHc9sd5CUhZQT9ojQ+f+thk/AoGeGawX/8HURZYAgIqD565d6FK0VsZEDkdRMl58z1Qon20h3y1g==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/hub': 6.18.2
+      '@sentry/minimal': 6.18.2
+      '@sentry/types': 6.18.2
+      '@sentry/utils': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
+  /@sentry/hub/6.18.2:
+    resolution: {integrity: sha512-d0AugekMkbnN12b4EXMjseJxtLPc9S20DGobCPUb4oAQT6S2oDQEj1jwP6PQ5vtgyy+GMYWxBMgqAQ4pjVYISQ==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/types': 6.18.2
+      '@sentry/utils': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
+  /@sentry/minimal/6.18.2:
+    resolution: {integrity: sha512-n7KYuo34W2LxE+3dnZ47of7XHuORINCnXq66XH72eoj67tf0XeWbIhEJrYGmoLRyRfoCYYrBLWiDl/uTjLzrzQ==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/hub': 6.18.2
+      '@sentry/types': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
+  /@sentry/tracing/6.18.2:
+    resolution: {integrity: sha512-hg6NLqrqJ5sUPTyWEQ2RqdnhQVnyLtx8II0IyWxQLDWD8UCe3Mu6G7mroDtakPWcP+lWz6OnKfMEfuhMcxR8fw==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/hub': 6.18.2
+      '@sentry/minimal': 6.18.2
+      '@sentry/types': 6.18.2
+      '@sentry/utils': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
+  /@sentry/types/6.18.2:
+    resolution: {integrity: sha512-WzpJf/Q5aORTzrSwer/As1NlO90dBAQpaHV2ikDDKqOyMWEgjKb5/4gh59p9gH8JMMnLetP1AvQel0fOj5UnUw==}
+    engines: {node: '>=6'}
+    dev: true
+
+  /@sentry/utils/6.18.2:
+    resolution: {integrity: sha512-EC619jesknyu4xpwud5WC/5odYLz6JUy7OSFy5405PpdGeh/m8XUvuJAx4zDx0Iz/Mlk0S1Md+ZcQwqkv39dkw==}
+    engines: {node: '>=6'}
+    dependencies:
+      '@sentry/types': 6.18.2
+      tslib: 1.14.1
+    dev: true
+
   /@socket.io/base64-arraybuffer/1.0.2:
     resolution: {integrity: sha512-dOlCBKnDw4iShaIsH/bxujKTM18+2TOAsYz+KSc11Am38H4q5Xw8Bbz97ZYdrVNM+um3p7w86Bvvmcn9q+5+eQ==}
     engines: {node: '>= 0.6.0'}
diff --git a/frontend/src/routes/__layout.svelte b/frontend/src/routes/__layout.svelte
index 8aec80a..d07b704 100644
--- a/frontend/src/routes/__layout.svelte
+++ b/frontend/src/routes/__layout.svelte
@@ -2,40 +2,55 @@
 	import '../app.css';
 	import Navbar from '$lib/navbar.svelte';
 	import { navbarVisible } from '$lib/stores.ts';
+	import * as Sentry from '@sentry/browser';
+	import { BrowserTracing } from '@sentry/tracing';
+
+	if (import.meta.env.VITE_SENTRY !== null) {
+		Sentry.init({
+			dsn: import.meta.env.VITE_SENTRY,
+			integrations: [new BrowserTracing()],
+
+			// Set tracesSampleRate to 1.0 to capture 100%
+			// of transactions for performance monitoring.
+			// We recommend adjusting this value in production
+			tracesSampleRate: 0.5
+		});
+	}
+
 </script>
 
 {#if $navbarVisible}
 	<Navbar />
-	<div class="pt-16 h-screen">
+	<div class='pt-16 h-screen'>
 		<slot />
 	</div>
 {:else}
 	<slot />
 {/if}
 
-<style lang="scss">
-	:global(body) {
-		background: linear-gradient(to right, #009444, #39b54a, #8dc63f);
-		// height: 100%;
-		// width: 100%;
-		background-repeat: no-repeat;
-		background-size: cover;
-		/*background: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%); */
-		/*background: linear-gradient(-225deg, #22E1FF 0%, #1D8FE1 48%, #625EB1 100%); */
-		color: beige;
-		background-size: 400% 400%;
-		animation: background_animation 30s ease infinite;
-	}
+<style lang='scss'>
+  :global(body) {
+    background: linear-gradient(to right, #009444, #39b54a, #8dc63f);
+    // height: 100%;
+    // width: 100%;
+    background-repeat: no-repeat;
+    background-size: cover;
+    /*background: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%); */
+    /*background: linear-gradient(-225deg, #22E1FF 0%, #1D8FE1 48%, #625EB1 100%); */
+    color: beige;
+    background-size: 400% 400%;
+    animation: background_animation 30s ease infinite;
+  }
 
-	@keyframes background_animation {
-		0% {
-			background-position: 0% 50%;
-		}
-		50% {
-			background-position: 100% 50%;
-		}
-		100% {
-			background-position: 0% 50%;
-		}
-	}
+  @keyframes background_animation {
+    0% {
+      background-position: 0% 50%;
+    }
+    50% {
+      background-position: 100% 50%;
+    }
+    100% {
+      background-position: 0% 50%;
+    }
+  }
 </style>