diff --git a/frontend/src/lib/components/Energy/Energy.svelte b/frontend/src/lib/components/Energy/Energy.svelte
index fac7599..390f694 100644
--- a/frontend/src/lib/components/Energy/Energy.svelte
+++ b/frontend/src/lib/components/Energy/Energy.svelte
@@ -1,20 +1,9 @@
 <script lang="ts">
-	import { GetFood } from "$wails/main/App.js";
-	import { main } from '$wails/models'
-
-	let food: main.Food[] = [];
-	GetFood().then((result) => {
-		if (!result.success) {
-			console.error(result.error);
-			return;
-		}
-		food = result.data
-		console.log(food);
-	});
+	import { foodStore } from "$lib/store/FoodStore";
 </script>
 
 <template>
-	{#each food as f}
+	{#each $foodStore as f}
 		<div>{f.food}</div>
 	{/each}
 </template>
\ No newline at end of file
diff --git a/frontend/src/lib/store/FoodStore.ts b/frontend/src/lib/store/FoodStore.ts
new file mode 100644
index 0000000..00e3575
--- /dev/null
+++ b/frontend/src/lib/store/FoodStore.ts
@@ -0,0 +1,31 @@
+import { type Writable, writable } from "svelte/store";
+import { main } from "$wails/models";
+import { GetFood } from "$wails/main/App";
+
+async function createStore(): Promise<Writable<main.Food[]>> {
+	let foods: main.Food[] = [];
+	let res: main.WailsFood = await GetFood();
+	if (!res.success) {
+		console.error("failed to get foods with error" + res.error);
+	} else {
+		foods = res.data;
+	}
+
+	const { subscribe, update, set } = writable(foods);
+	return {
+		subscribe,
+		update,
+		set,
+		// @ts-ignore
+		refresh: async () => {
+			const res = await GetFood();
+			if (!res.success) {
+				console.error("failed to get foods with error" + res.error);
+				return;
+			}
+			set(res.data);
+		},
+	};
+}
+
+export const foodStore = await createStore();
diff --git a/frontend/src/lib/store/SettingsStore.ts b/frontend/src/lib/store/SettingsStore.ts
new file mode 100644
index 0000000..4d4572f
--- /dev/null
+++ b/frontend/src/lib/store/SettingsStore.ts
@@ -0,0 +1,22 @@
+import { type Writable, writable } from "svelte/store";
+import { main } from "$wails/models";
+import { GetSettings } from "$wails/main/App";
+
+async function createStore(): Promise<Writable<main.settings>> {
+	// This should never fail
+	const settings: main.settings = await GetSettings();
+
+	const { subscribe, update, set } = writable(settings);
+	return {
+		subscribe,
+		update,
+		set,
+		// @ts-ignore
+		refresh: async () => {
+			const settings: main.settings = await GetSettings();
+			set(settings);
+		},
+	};
+}
+
+export const settingsStore = await createStore();
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index 25d1b88..fdb36e3 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,17 +1,21 @@
-import {defineConfig} from 'vite'
-import {svelte} from '@sveltejs/vite-plugin-svelte'
+import { defineConfig } from "vite";
+import { svelte } from "@sveltejs/vite-plugin-svelte";
 import { join } from "node:path";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [svelte()],
+	plugins: [svelte()],
 
-  resolve: {
-    alias: {
-      $lib: join(__dirname, 'src/lib'),
-      $components: join(__dirname, 'src/lib/components'),
-      $router: join(__dirname, 'src/lib/router'),
-      $wails: join(__dirname, 'wailsjs/go'),
-    }
+	resolve: {
+		alias: {
+			$lib: join(__dirname, "src/lib"),
+			$components: join(__dirname, "src/lib/components"),
+			$router: join(__dirname, "src/lib/router"),
+			$wails: join(__dirname, "wailsjs/go"),
+		},
   },
-})
+  
+	build: {
+		target: "esnext",
+	},
+});