diff --git a/frontend/src/api.js b/frontend/src/api.js
deleted file mode 100644
index 3c6c04c0c..000000000
--- a/frontend/src/api.js
+++ /dev/null
@@ -1,23 +0,0 @@
-import backup from "./api/backup";
-import recipe from "./api/recipe";
-import mealplan from "./api/mealplan";
-import settings from "./api/settings";
-import themes from "./api/themes";
-import migration from "./api/migration";
-import myUtils from "./api/upload";
-import category from "./api/category";
-import meta from "./api/meta";
-
-// import api from "@/api";
-
-export default {
-  recipes: recipe,
-  backups: backup,
-  mealPlans: mealplan,
-  settings: settings,
-  themes: themes,
-  migrations: migration,
-  utils: myUtils,
-  categories: category,
-  meta: meta,
-};
diff --git a/frontend/src/api/index.js b/frontend/src/api/index.js
new file mode 100644
index 000000000..adb20277c
--- /dev/null
+++ b/frontend/src/api/index.js
@@ -0,0 +1,22 @@
+import backup from "./backup";
+import recipe from "./recipe";
+import mealplan from "./mealplan";
+import settings from "./settings";
+import themes from "./themes";
+import migration from "./migration";
+import myUtils from "./upload";
+import category from "./category";
+import meta from "./meta";
+
+
+export default {
+  recipes: recipe,
+  backups: backup,
+  mealPlans: mealplan,
+  settings: settings,
+  themes: themes,
+  migrations: migration,
+  utils: myUtils,
+  categories: category,
+  meta: meta,
+};
diff --git a/frontend/src/pages/LoginPage.vue b/frontend/src/pages/LoginPage.vue
new file mode 100644
index 000000000..3d8da7d63
--- /dev/null
+++ b/frontend/src/pages/LoginPage.vue
@@ -0,0 +1,19 @@
+<template>
+  <v-row justify="start" height="100%">
+    <v-col align="center">
+      <LoginForm />
+    </v-col>
+  </v-row>
+</template>
+
+<script>
+import LoginForm from "../components/Login/LoginForm";
+export default {
+  components: {
+    LoginForm,
+  },
+};
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/frontend/src/routes.js b/frontend/src/routes.js
index 3abc828c0..4b7e6c5fb 100644
--- a/frontend/src/routes.js
+++ b/frontend/src/routes.js
@@ -8,14 +8,14 @@ import AllRecipesPage from "./pages/AllRecipesPage";
 import CategoryPage from "./pages/CategoryPage";
 import MeaplPlanPage from "./pages/MealPlanPage";
 import Debug from "./pages/Debug";
-import Login from "./pages/Login";
+import LoginPage from "./pages/LoginPage";
 import MealPlanThisWeekPage from "./pages/MealPlanThisWeekPage";
 import api from "@/api";
 
 export const routes = [
   { path: "/", component: HomePage },
   { path: "/mealie", component: HomePage },
-  { path: "/login", component: Login },
+  { path: "/login", component: LoginPage },
   { path: "/debug", component: Debug },
   { path: "/search", component: SearchPage },
   { path: "/recipes/all", component: AllRecipesPage },