diff --git a/build.ts b/build.ts
index a112835f..105a7fde 100644
--- a/build.ts
+++ b/build.ts
@@ -3,16 +3,13 @@ import { $ } from "bun";
 import { exists, mkdir, rm } from "node:fs/promises";
 import { rawRoutes } from "~routes";
 
-if (!(await exists("./pages/dist"))) {
-    console.log("Please build the Vite server first, or use `bun prod-build`");
-    process.exit(1);
-}
+console.log("Building frontend...");
+
+await $`bun fe:build`;
 
 console.log(`Building at ${process.cwd()}`);
 
-await rm("./dist", { recursive: true });
-
-await mkdir(`${process.cwd()}/dist`);
+await $`rm -rf dist && mkdir dist`;
 
 await Bun.build({
     entrypoints: [
@@ -26,7 +23,7 @@ await Bun.build({
     target: "bun",
     splitting: true,
     minify: false,
-    external: ["bullmq", "@prisma/client"],
+    external: ["bullmq", "@prisma/client", "frontend"],
 }).then((output) => {
     if (!output.success) {
         console.log(output.logs);
@@ -48,13 +45,10 @@ await $`cp -r ${process.cwd()}/node_modules/prisma dist/node_modules/`;
 // Copy Sharp to dist
 await $`cp -r ${process.cwd()}/node_modules/sharp/build/ .`;
 
-// Create pages directory
-await $`mkdir -p dist/pages/dist`;
-
 // Copy Vite build output to dist
-await $`cp -r ${process.cwd()}/pages/dist dist/pages/`;
+await $`cp -r packages/frontend/.output dist/frontend`;
 
 // Copy the Bee Movie script from pages
-await $`cp ${process.cwd()}/pages/beemovie.txt dist/pages/beemovie.txt`;
+await $`cp ${process.cwd()}/pages/beemovie.txt dist/beemovie.txt`;
 
 console.log("Built!");
diff --git a/bun.lockb b/bun.lockb
index ee06f16a..474387cd 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index d4df4e96..e6ff919d 100644
--- a/package.json
+++ b/package.json
@@ -32,11 +32,14 @@
         "dev": "bun run --watch index.ts",
         "vite:dev": "bunx --bun vite pages",
         "vite:build": "bunx --bun vite build pages",
-        "start": "NODE_ENV=production bun run dist/index.js --prod",
+        "fe:dev": "bun --bun nuxt dev packages/frontend",
+        "fe:build": "bun --bun nuxt build packages/frontend",
+        "fe:analyze": "bun --bun nuxt analyze packages/frontend",
+        "start": "NITRO_PORT=5173 bun run dist/frontend/server/index.mjs & NODE_ENV=production bun run dist/index.js --prod",
         "migrate-dev": "bun prisma migrate dev",
         "migrate": "bun prisma migrate deploy",
         "lint": "bunx --bun eslint --config .eslintrc.cjs --ext .ts .",
-        "prod-build": "bunx --bun vite build pages && bun run build.ts",
+        "prod-build": "bun run build.ts",
         "prisma": "DATABASE_URL=$(bun run prisma.ts) bunx prisma",
         "generate": "bun prisma generate",
         "benchmark:timeline": "bun run benchmarks/timelines.ts",
@@ -48,13 +51,17 @@
         "@prisma/client",
         "@prisma/engines",
         "esbuild",
+        "msgpackr-extract",
+        "nuxt-app",
         "prisma",
         "sharp",
-        "msgpackr-extract"
+        "vue-demi"
     ],
     "devDependencies": {
         "@biomejs/biome": "1.6.4",
         "@julr/unocss-preset-forms": "^0.1.0",
+        "@nuxtjs/seo": "^2.0.0-rc.10",
+        "@nuxtjs/tailwindcss": "^6.11.4",
         "@types/cli-table": "^0.3.4",
         "@types/html-to-text": "^9.0.4",
         "@types/ioredis": "^5.0.0",
diff --git a/packages/config-manager/config.type.ts b/packages/config-manager/config.type.ts
index 0d542d93..14deaac9 100644
--- a/packages/config-manager/config.type.ts
+++ b/packages/config-manager/config.type.ts
@@ -1,4 +1,7 @@
-import { MediaBackendType } from "~packages/media-manager";
+export enum MediaBackendType {
+    LOCAL = "local",
+    S3 = "s3",
+}
 
 export interface Config {
     database: {
diff --git a/packages/frontend/.gitignore b/packages/frontend/.gitignore
new file mode 100644
index 00000000..4a7f73a2
--- /dev/null
+++ b/packages/frontend/.gitignore
@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
diff --git a/packages/frontend/README.md b/packages/frontend/README.md
new file mode 100644
index 00000000..d0b02976
--- /dev/null
+++ b/packages/frontend/README.md
@@ -0,0 +1 @@
+# FE
\ No newline at end of file
diff --git a/packages/frontend/app.vue b/packages/frontend/app.vue
new file mode 100644
index 00000000..207756e3
--- /dev/null
+++ b/packages/frontend/app.vue
@@ -0,0 +1,13 @@
+<template>
+  <NuxtPage>
+    <slot />
+  </NuxtPage>
+</template>
+
+<script setup lang="ts">
+useServerSeoMeta({
+    titleTemplate: (titleChunk) => {
+        return titleChunk ? `${titleChunk} · Lysand` : "Lysand";
+    },
+});
+</script>
\ No newline at end of file
diff --git a/packages/frontend/components/LoginInput.vue b/packages/frontend/components/LoginInput.vue
new file mode 100644
index 00000000..a5a3ae45
--- /dev/null
+++ b/packages/frontend/components/LoginInput.vue
@@ -0,0 +1,30 @@
+<template>
+    <div class="flex items-center justify-between">
+        <label for="password" class="block text-sm font-medium leading-6 text-gray-900">{{ label }}</label>
+    </div>
+    <div class="mt-2">
+        <input v-bind="$attrs" @input="checkValid" :class="['block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6',
+            (isInvalid || error) && 'invalid:!ring-red-600 invalid:ring-2']">
+        <span v-if="isInvalid || error" class="mt-1 text-xs text-red-600">{{ error ? error : `${label} is invalid` }}</span>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+
+const props = defineProps<{
+    label: string;
+    error?: string;
+}>();
+
+const isInvalid = ref(false);
+
+const checkValid = (e: Event) => {
+    const target = e.target as HTMLInputElement;
+    if (target.checkValidity()) {
+        isInvalid.value = false;
+    } else {
+        isInvalid.value = true;
+    }
+};
+</script>
\ No newline at end of file
diff --git a/packages/frontend/constants.ts b/packages/frontend/constants.ts
new file mode 100644
index 00000000..5ef419d9
--- /dev/null
+++ b/packages/frontend/constants.ts
@@ -0,0 +1,12 @@
+export const recommendedClients = [
+    {
+        name: "Soapbox",
+        icon: "https://soapbox.pub/assets/logo.svg",
+        link: "https://fe.soapbox.pub/",
+    },
+    {
+        name: "Megalodon",
+        icon: "https://sk22.github.io/megalodon/mastodon/src/main/res/mipmap-xhdpi/ic_launcher_round.png",
+        link: "https://sk22.github.io/megalodon/",
+    },
+];
diff --git a/packages/frontend/nuxt.config.ts b/packages/frontend/nuxt.config.ts
new file mode 100644
index 00000000..85aba386
--- /dev/null
+++ b/packages/frontend/nuxt.config.ts
@@ -0,0 +1,62 @@
+// import { loadConfig } from "c12";
+import pkg from "../../package.json";
+// import { defaultConfig } from "config-manager/config.type";
+
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+    modules: ["@nuxtjs/seo", "@nuxtjs/tailwindcss", "@vueuse/nuxt"],
+    app: {
+        head: {
+            link: [
+                {
+                    rel: "icon",
+                    href: "/favicon.png",
+                    type: "image/png",
+                },
+            ],
+            htmlAttrs: { lang: "en-us" },
+        },
+    },
+    nitro: {
+        compressPublicAssets: {
+            gzip: false,
+            brotli: false,
+        },
+        preset: "bun",
+        minify: true,
+        prerender: {
+            failOnError: true,
+        },
+    },
+    devServer: {
+        port: 5173,
+    },
+    schemaOrg: {
+        enabled: false,
+    },
+    vite: {
+        define: {
+            __VERSION__: JSON.stringify(pkg.version),
+        },
+        server: {
+            hmr: {
+                clientPort: 5173,
+            },
+        },
+    },
+    runtimeConfig: {
+        public: {
+            language: "en-US",
+            titleSeparator: "·",
+            siteName: "Lysand",
+            trailingSlash: true,
+            // @ts-ignore
+
+            url2: async () => await Promise.resolve("cheese"),
+            //url: `${config?.http.bind}:${config?.http.bind_port}`,
+        },
+    },
+    site: {
+        url: "https://social.lysand.org",
+    },
+});
diff --git a/packages/frontend/package.json b/packages/frontend/package.json
new file mode 100644
index 00000000..a075e686
--- /dev/null
+++ b/packages/frontend/package.json
@@ -0,0 +1,21 @@
+{
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "c12": "^1.10.0",
+    "nuxt": "^3.11.2",
+    "vue": "^3.4.21",
+    "vue-router": "^4.3.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/forms": "^0.5.7"
+  }
+}
diff --git a/packages/frontend/pages/[username]/[uuid].vue b/packages/frontend/pages/[username]/[uuid].vue
new file mode 100644
index 00000000..1b14b10f
--- /dev/null
+++ b/packages/frontend/pages/[username]/[uuid].vue
@@ -0,0 +1,71 @@
+<template>
+    <div class="flex min-h-screen flex-col justify-center px-6 py-12 lg:px-8 relative">
+        <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
+            <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+        </div>
+        <div class="code" v-html="code">
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useRoute } from "vue-router";
+import { getHighlighterCore } from "shiki/core";
+import getWasm from "shiki/wasm";
+
+const config = (await useFetch("/api/config")).data.value;
+
+if (!config) {
+    throw new Error("Config not found");
+}
+
+const url = `${config.http.bind}:${config.http.bind_port}`;
+
+const route = useRoute();
+
+const data = await fetch(
+    new URL(`/api/v1/statuses/${route.params.uuid}`, url),
+    {
+        headers: {
+            Accept: "application/json",
+        },
+    },
+)
+    .then((res) => res.json())
+    .catch(() => ({
+        error: "Failed to fetch status (it probably doesn't exist)",
+    }));
+
+const highlighter = await getHighlighterCore({
+    themes: [import("shiki/themes/rose-pine.mjs")],
+    langs: [import("shiki/langs/json.mjs")],
+    loadWasm: getWasm,
+});
+
+const code = highlighter.codeToHtml(JSON.stringify(data, null, 4), {
+    lang: "json",
+    theme: "rose-pine",
+});
+</script>
+
+<style lang="postcss">
+pre:has(code) {
+	word-wrap: normal;
+	background: transparent;
+	-webkit-hyphens: none;
+	hyphens: none;
+	-moz-tab-size: 4;
+	-o-tab-size: 4;
+	tab-size: 4;
+	white-space: pre;
+	word-break: normal;
+	word-spacing: normal;
+	overflow-x: auto;
+    @apply ring-1 ring-white/10 mt-4 bg-white/5 px-4 py-3 rounded;
+}
+
+pre code {
+    @apply block p-0;
+}
+</style>
\ No newline at end of file
diff --git a/packages/frontend/pages/[username]/index.vue b/packages/frontend/pages/[username]/index.vue
new file mode 100644
index 00000000..5da29472
--- /dev/null
+++ b/packages/frontend/pages/[username]/index.vue
@@ -0,0 +1,82 @@
+<template>
+    <div class="flex min-h-screen flex-col justify-center px-6 py-12 lg:px-8 relative">
+        <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
+            <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+        </div>
+        <div id="code" v-html="code">
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useRoute } from "vue-router";
+import { getHighlighterCore } from "shiki/core";
+import getWasm from "shiki/wasm";
+
+const config = (await useFetch("/api/config")).data.value;
+
+if (!config) {
+    throw new Error("Config not found");
+}
+
+const url = `${config.http.bind}:${config.http.bind_port}`;
+
+const route = useRoute();
+
+const username = (route.params.username as string).replace("@", "");
+
+const id = await fetch(new URL(`/api/v1/accounts/search?q=${username}`, url), {
+    headers: {
+        Accept: "application/json",
+    },
+})
+    .then((res) => res.json())
+    .catch(() => null);
+
+let data = null;
+
+if (id && id.length > 0) {
+    data = await fetch(new URL(`/api/v1/accounts/${id[0].id}`, url), {
+        headers: {
+            Accept: "application/json",
+        },
+    })
+        .then((res) => res.json())
+        .catch(() => ({
+            error: "Failed to fetch user (it probably doesn't exist)",
+        }));
+}
+
+const highlighter = await getHighlighterCore({
+    themes: [import("shiki/themes/rose-pine.mjs")],
+    langs: [import("shiki/langs/json.mjs")],
+    loadWasm: getWasm,
+});
+
+const code = highlighter.codeToHtml(JSON.stringify(data, null, 4), {
+    lang: "json",
+    theme: "rose-pine",
+});
+</script>
+
+<style lang="postcss">
+pre:has(code) {
+	word-wrap: normal;
+	background: transparent;
+	-webkit-hyphens: none;
+	hyphens: none;
+	-moz-tab-size: 4;
+	-o-tab-size: 4;
+	tab-size: 4;
+	white-space: pre;
+	word-break: normal;
+	word-spacing: normal;
+	overflow-x: auto;
+    @apply ring-1 ring-white/10 mt-4 bg-white/5 px-4 py-3 rounded;
+}
+
+pre code {
+    @apply block p-0;
+}
+</style>
\ No newline at end of file
diff --git a/packages/frontend/pages/index.vue b/packages/frontend/pages/index.vue
new file mode 100644
index 00000000..5265500a
--- /dev/null
+++ b/packages/frontend/pages/index.vue
@@ -0,0 +1,69 @@
+<template>
+    <div class="bg-white">
+        <div class="relative isolate px-6 pt-14 lg:px-8">
+            <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80"
+                aria-hidden="true">
+                <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                    style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+            </div>
+            <div class="mx-auto max-w-lg py-32 sm:py-48 lg:py-56">
+                <div class="hidden sm:mb-8 sm:flex sm:justify-center">
+                    <div
+                        class="relative rounded px-3 py-1 text-sm leading-6 text-gray-600 ring-1 ring-gray-900/10 hover:ring-gray-900/20">
+                        You are using <a href="#" class="font-semibold text-indigo-600">Lysand {{ version }}</a>
+                    </div>
+                </div>
+                <div class="text-center">
+                    <h1 class="text-4xl font-bold tracking-tight text-gray-900 sm:text-6xl">Welcome to Lysand</h1>
+                    <p class="mt-6 text-lg leading-8 text-gray-600">You can login to this server by pointing any Mastodon
+                        client at <strong class="font-bold">{{ config?.http.base_url }}</strong></p>
+                    <div class="mt-10 flex items-center justify-center gap-6 md:flex-row flex-col">
+                        <a href="https://github.com/lysand-org/lysand" target="_blank"
+                            class="rounded-md w-full bg-indigo-600 ring-indigo-600 ring-2 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Read
+                            the docs</a>
+                        <a href="https://lysand.org" target="_blank"
+                            class="rounded-md w-full ring-indigo-600 ring-2 bg-white px-3.5 py-2.5 text-sm font-semibold text-indigo-500 shadow-sm hover:bg-gray-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">About
+                            the Lysand Protocol</a>
+                    </div>
+
+                    <p class="mt-6 text-lg leading-8 text-gray-600">Here are some recommended clients:</p>
+                    <ul class="w-full flex flex-col gap-3 mt-4">
+                        <li v-for="client of recommendedClients" :key="client.name" class="w-full">
+                            <a :href="client.link" class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full flex flex-row gap-3 items-center">
+                                <img :src="client.icon" :alt="client.name" class="h-10 w-10" />
+                                <div class="flex flex-col justify-between items-start">
+                                    <h2 class="font-bold">{{ client.name }}</h2>
+                                    <span class="underline text-purple-700">{{ client.link }}</span>
+                                </div>
+                            </a>
+                        </li>
+                    </ul>
+                    <p class="mt-6 text-lg leading-8 text-gray-600">
+                        Many other clients exist, but <strong class="font-bold">they have not been tested for compatibility</strong>. Bug reports are nevertheless welcome.
+                    </p>
+
+                    <p class="mt-6 text-lg leading-8 text-gray-600">
+                        Found a problem? Report it on <a href="https://github.com/lysand-org/lysand/issues/new/choose" class="underline text-purple-700">the issue tracker</a>.
+                    </p>
+                </div>
+            </div>
+            <div class="absolute inset-x-0 top-[calc(100%-13rem)] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]"
+                aria-hidden="true">
+                <div class="relative left-[calc(50%+3rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%+36rem)] sm:w-[72.1875rem]"
+                    style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+            </div>
+        </div>
+    </div>
+</template>
+  
+<script setup lang="ts">
+import { recommendedClients } from "../constants";
+// @ts-ignore
+const version = __VERSION__;
+
+const config = (await useFetch("/api/config")).data.value;
+
+useServerSeoMeta({
+    title: "Welcome to Lysand!",
+});
+</script>
\ No newline at end of file
diff --git a/packages/frontend/pages/oauth/authorize.vue b/packages/frontend/pages/oauth/authorize.vue
new file mode 100644
index 00000000..c4fc7e6e
--- /dev/null
+++ b/packages/frontend/pages/oauth/authorize.vue
@@ -0,0 +1,114 @@
+<template>
+	<div class="flex min-h-screen relative flex-col justify-center px-6 py-12 lg:px-8">
+		<div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80"
+			aria-hidden="true">
+			<div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+				style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+		</div>
+		<div v-if="validUrlParameters" class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
+			<form class="space-y-6" method="POST"
+				:action="`/api/auth/login?redirect_uri=${redirect_uri}&response_type=${response_type}&client_id=${client_id}&scope=${scope}`">
+				<div>
+					<h1 class="font-bold text-2xl text-center tracking-tight">Login to your account</h1>
+				</div>
+
+				<div v-if="error && error !== 'undefined'"
+					class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+					<h3 class="font-bold">An error occured:</h3>
+					<p>{{ error }}</p>
+				</div>
+
+				<div>
+					<LoginInput label="Email" id="email" name="email" type="email" autocomplete="email" required />
+				</div>
+
+				<div>
+					<LoginInput label="Password" id="password" name="password" type="password"
+						autocomplete="current-password" required />
+				</div>
+
+				<div v-if="oauthProviders && oauthProviders.length > 0" class="w-full flex flex-col gap-3">
+					<h2 class="text-sm text-gray-700">Or sign in with</h2>
+					<div class="grid grid-cols-2 gap-4 w-full">
+						<a v-for="provider of oauthProviders" :key="provider.id"
+							:href="`/oauth/authorize-external?issuer=${provider.id}&redirect_uri=${redirect_uri}&response_type=${response_type}&clientId=${client_id}&scope=${scope}`"
+							class="flex flex-row justify-center rounded ring-1 gap-2 p-2 ring-black/10 hover:shadow duration-200">
+							<img :src="provider.icon" :alt="provider.name" class="w-6 h-6" />
+							<div class="flex flex-col gap-0 justify-center">
+								<h3 class="font-bold">{{ provider.name }}</h3>
+							</div>
+						</a>
+					</div>
+				</div>
+
+				<div>
+					<button type="submit"
+						class="flex w-full justify-center rounded-md bg-purple-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:shadow-lg duration-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Sign
+						in</button>
+				</div>
+			</form>
+		</div>
+		<div v-else class="mx-auto max-w-md">
+			<h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl">Invalid access
+				parameters
+			</h1>
+			<p class="mt-6 text-lg leading-8 text-gray-600">This page should be accessed 
+				through a valid OAuth2 authorization request. Please use a <strong class="font-bold">Mastodon API</strong> client to access this page.
+			</p>
+			<p class="mt-6 text-lg leading-8 text-gray-600">Here are some recommended clients:</p>
+			<ul class="w-full flex flex-col gap-3 mt-4">
+				<li v-for="client of recommendedClients" :key="client.name" class="w-full">
+					<a :href="client.link" class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full flex flex-row gap-3 items-center">
+						<img :src="client.icon" :alt="client.name" class="h-10 w-10" />
+						<div class="flex flex-col justify-between items-start">
+							<h2 class="font-bold">{{ client.name }}</h2>
+                        	<span class="underline text-purple-700">{{ client.link }}</span>
+						</div>
+					</a>
+				</li>
+			</ul>
+			<p class="mt-6 text-lg leading-8 text-gray-600">
+				Many other clients exist, but <strong class="font-bold">they have not been tested for compatibility</strong>. Bug reports are nevertheless welcome.
+			</p>
+
+			<p class="mt-6 text-lg leading-8 text-gray-600">
+				Found a problem? Report it on <a href="https://github.com/lysand-org/lysand/issues/new/choose" class="underline text-purple-700">the issue tracker</a>.
+			</p>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { useRoute } from "vue-router";
+import LoginInput from "../../components/LoginInput.vue";
+import { recommendedClients } from "../../constants";
+
+const query = useRoute().query;
+
+const redirect_uri = query.redirect_uri;
+const response_type = query.response_type;
+const client_id = query.client_id;
+const scope = query.scope;
+const error = decodeURIComponent(query.error as string);
+
+const validUrlParameters = redirect_uri && response_type && client_id && scope;
+
+const oauthProviders = ref<
+    | {
+          name: string;
+          icon: string;
+          id: string;
+      }[]
+    | null
+>(null);
+
+const getOauthProviders = async () => {
+    const response = await fetch("/oauth/providers");
+    return await response.json();
+};
+
+onMounted(async () => {
+    oauthProviders.value = await getOauthProviders();
+});
+</script>
\ No newline at end of file
diff --git a/packages/frontend/pages/oauth/redirect.vue b/packages/frontend/pages/oauth/redirect.vue
new file mode 100644
index 00000000..16478346
--- /dev/null
+++ b/packages/frontend/pages/oauth/redirect.vue
@@ -0,0 +1,175 @@
+<template>
+    <div class="flex min-h-screen relative flex-col justify-center px-6 py-12 lg:px-8">
+        <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80"
+            aria-hidden="true">
+            <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+        </div>
+        <div v-if="validUrlParameters" class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
+            <form class="space-y-6" method="POST"
+                :action="`/api/auth/redirect?redirect_uri=${encodeURIComponent(redirect_uri)}&client_id=${client_id}&code=${code}`">
+                <div class="flex flex-col items-center gap-y-5">
+                    <h1 class="font-bold text-2xl text-center tracking-tight">Allow this application to access your
+                        account?</h1>
+                    <div class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full">
+                        <h2 class="font-bold">{{ application }}</h2>
+                        <a :href="website" class="underline text-purple-700">{{ website }}</a>
+                    </div>
+                </div>
+
+                <h2 class="text-gray-900 tracking-tight text-xl font-semibold">
+                    This application will be able to:
+                </h2>
+
+                <ul class="flex flex-col gap-y-1.5">
+                    <li v-for="text in getScopeText(scopes)" :key="text[1]" class="flex flex-row gap-1">
+                        <svg class="fill-purple-600 w-5 h-5" xmlns="http://www.w3.org/2000/svg" fill="currentColor"
+                            viewBox="0 0 16 16">
+                            <path
+                                d="M10.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425z" />
+                        </svg>
+                        <h2 class="text-sm">
+                            <strong class="font-bold">{{ text[0] }}</strong> {{ text[1] }}
+                        </h2>
+                    </li>
+                </ul>
+
+                <div class="flex-col flex gap-y-1">
+                    <p class="text-sm text-gray-700">You are signing in to <b>{{ application }}</b> with your
+                        account.</p>
+                    <p class="text-sm text-gray-700">This allows <b>{{ application }}</b> to perform the above account
+                        actions.</p>
+                </div>
+
+                <div class="flex flex-col gap-3">
+                    <button type="submit"
+                        class="flex w-full justify-center rounded-md bg-purple-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:shadow-lg duration-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Authorize</button>
+                    <a type="button" href="/"
+                        class="flex w-full justify-center rounded-md bg-gray-50 px-3 py-1.5 text-sm font-semibold leading-6 text-red-600 shadow-sm hover:shadow-lg duration-200 border-2 border-red-600">Cancel</a>
+                </div>
+            </form>
+        </div>
+        <div v-else class="mx-auto max-w-md">
+			<h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl">Invalid access
+				parameters
+			</h1>
+			<p class="mt-6 text-lg leading-8 text-gray-600">This page should be accessed 
+				through a valid OAuth2 authorization request. Please use a <strong class="font-bold">Mastodon API</strong> client to access this page.
+			</p>
+			<p class="mt-6 text-lg leading-8 text-gray-600">Here are some recommended clients:</p>
+			<ul class="w-full flex flex-col gap-3 mt-4">
+				<li v-for="client of recommendedClients" :key="client.name" class="w-full">
+					<a :href="client.link" class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full flex flex-row gap-3 items-center">
+						<img :src="client.icon" :alt="client.name" class="h-10 w-10" />
+						<div class="flex flex-col justify-between items-start">
+							<h2 class="font-bold">{{ client.name }}</h2>
+                        	<span class="underline text-purple-700">{{ client.link }}</span>
+						</div>
+					</a>
+				</li>
+			</ul>
+			<p class="mt-6 text-lg leading-8 text-gray-600">
+				Many other clients exist, but <strong class="font-bold">they have not been tested for compatibility</strong>. Bug reports are nevertheless welcome.
+			</p>
+
+			<p class="mt-6 text-lg leading-8 text-gray-600">
+				Found a problem? Report it on <a href="https://github.com/lysand-org/lysand/issues/new/choose" class="underline text-purple-700">the issue tracker</a>.
+			</p>
+		</div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useRoute } from "vue-router";
+import { recommendedClients } from "../../constants";
+
+const query = useRoute().query;
+
+const application = query.application;
+const website = decodeURIComponent(query.website as string);
+const redirect_uri = query.redirect_uri as string;
+const client_id = query.client_id;
+const scope = decodeURIComponent((query.scope as string) || "");
+const code = query.code;
+
+const validUrlParameters =
+    application && website && redirect_uri && client_id && scope && code;
+
+const oauthScopeText: Record<string, string> = {
+    "rw:accounts": "$VERB your account information",
+    "rw:blocks": "$VERB your block list",
+    "rw:bookmarks": "$VERB your bookmarks",
+    "rw:favourites": "$VERB your favourites",
+    "rw:filters": "$VERB your filters",
+    "rw:follows": "$VERB your follows",
+    "rw:lists": "$VERB your lists",
+    "rw:mutes": "$VERB your mutes",
+    "rw:notifications": "$VERB your notifications",
+    "r:search": "Perform searches",
+    "rw:statuses": "$VERB your statuses",
+    "w:conversations": "Edit your conversations",
+    "w:media": "Upload media",
+    "w:reports": "Report users",
+};
+
+const scopes = scope.split(" ");
+
+// If only read scope, then we can just say "read your account information"
+// If only write, then we can just say "write to your account information"
+// If both, then we can say "read and write to your account information"
+// Return an array of strings to display
+// "read write:accounts" returns all the fields with $VERB as read, plus the accounts field with $VERB as write
+const getScopeText = (fullScopes: string[]) => {
+    const scopeTexts = [];
+
+    const readScopes = fullScopes.filter((scope) => scope.includes("read"));
+    const writeScopes = fullScopes.filter((scope) => scope.includes("write"));
+
+    for (const possibleScope of Object.keys(oauthScopeText)) {
+        const [scopeAction, scopeName] = possibleScope.split(":");
+
+        if (
+            scopeAction.includes("rw") &&
+            (readScopes.includes(`read:${scopeName}`) ||
+                readScopes.find((scope) => scope === "read")) &&
+            (writeScopes.includes(`write:${scopeName}`) ||
+                writeScopes.find((scope) => scope === "write"))
+        ) {
+            if (oauthScopeText[possibleScope].includes("$VERB"))
+                scopeTexts.push([
+                    "Read and write",
+                    oauthScopeText[possibleScope].replace("$VERB", ""),
+                ]);
+            else scopeTexts.push(["", oauthScopeText[possibleScope]]);
+            continue;
+        }
+
+        if (
+            scopeAction.includes("r") &&
+            (readScopes.includes(`read:${scopeName}`) ||
+                readScopes.find((scope) => scope === "read"))
+        ) {
+            if (oauthScopeText[possibleScope].includes("$VERB"))
+                scopeTexts.push([
+                    "Read",
+                    oauthScopeText[possibleScope].replace("$VERB", ""),
+                ]);
+            else scopeTexts.push(["", oauthScopeText[possibleScope]]);
+        }
+
+        if (
+            scopeAction.includes("w") &&
+            (writeScopes.includes(`write:${scopeName}`) ||
+                writeScopes.find((scope) => scope === "write"))
+        ) {
+            if (oauthScopeText[possibleScope].includes("$VERB"))
+                scopeTexts.push([
+                    "Write",
+                    oauthScopeText[possibleScope].replace("$VERB", ""),
+                ]);
+            else scopeTexts.push(["", oauthScopeText[possibleScope]]);
+        }
+    }
+    return scopeTexts;
+};
+</script>
\ No newline at end of file
diff --git a/packages/frontend/pages/register/index.vue b/packages/frontend/pages/register/index.vue
new file mode 100644
index 00000000..3ab1d198
--- /dev/null
+++ b/packages/frontend/pages/register/index.vue
@@ -0,0 +1,172 @@
+<template>
+    <div class="flex min-h-screen flex-col justify-center px-6 py-12 lg:px-8 relative">
+        <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
+            <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+        </div>
+        <div v-if="instanceInfo.registrations" class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
+            <form ref="form" class="space-y-6" method="POST" action="" @submit.prevent="registerUser">
+                <div>
+                    <h1 class="font-bold text-2xl text-center tracking-tight">Register for an account</h1>
+                </div>
+
+                <div>
+                    <LoginInput label="Email" id="email" name="email" type="email" autocomplete="email" required />
+                </div>
+
+                <div v-if="errors['email']" v-for="error of errors['email']"
+                    class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+                    <h3 class="font-bold">An error occured:</h3>
+                    <p>{{ error.description }}</p>
+                </div>
+
+                <div>
+                    <LoginInput label="Username" id="username" name="username" type="text" autocomplete="username"
+                        required />
+                </div>
+
+                <div v-if="errors['username']" v-for="error of errors['username']"
+                    class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+                    <h3 class="font-bold">An error occured:</h3>
+                    <p>{{ error.description }}</p>
+                </div>
+
+                <div>
+                    <LoginInput label="Password" id="password" name="password" type="password" autocomplete="" required
+                        :spellcheck="false" :error="!passwordsMatch ? `Passwords dont match` : ``" :value="password1"
+                        @input="password1 = $event.target.value" />
+                </div>
+
+                <div v-if="errors['password']" v-for="error of errors['password']"
+                    class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+                    <h3 class="font-bold">An error occured:</h3>
+                    <p>{{ error.description }}</p>
+                </div>
+
+                <div>
+                    <LoginInput label="Confirm password" id="password2" name="password2" type="password" autocomplete=""
+                        required :spellcheck="false" :error="!passwordsMatch ? `Passwords dont match` : ``"
+                        :value="password2" @input="password2 = $event.target.value" />
+                </div>
+
+                <div>
+                    <label for="comment" class="block text-sm font-medium leading-6 text-gray-900">Why do you want to
+                        join?</label>
+                    <div class="mt-2">
+                        <textarea rows="4" required :value="reason" @input="reason = ($event.target as any).value"
+                            name="comment" id="comment"
+                            class="block w-full rounded-md px-2 border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" />
+                    </div>
+                </div>
+
+                <div v-if="errors['reason']" v-for="error of errors['reason']"
+                    class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+                    <h3 class="font-bold">An error occured:</h3>
+                    <p>{{ error.description }}</p>
+                </div>
+
+                <div class="">
+                    <input type="checkbox" :value="tosAccepted" @input="tosAccepted = Boolean(($event.target as any).value)"
+                        class="rounded mr-1 align-middle mb-0.5" /> <span class="text-sm">I agree to the
+                        terms and
+                        conditions
+                        of this
+                        server, available <a class="underline font-bold" target="_blank"
+                            :href="instanceInfo.tos_url">here</a></span>
+                </div>
+
+                <div v-if="errors['agreement']" v-for="error of errors['agreement']"
+                    class="rounded bg-purple-100 ring-1 ring-purple-800 py-2 px-4">
+                    <h3 class="font-bold">An error occured:</h3>
+                    <p>{{ error.description }}</p>
+                </div>
+
+                <div>
+                    <button type="submit" :disabled="!passwordsMatch || !tosAccepted"
+                        class="flex w-full justify-center disabled:opacity-50 disabled:hover:shadow-none rounded-md bg-purple-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:shadow-lg duration-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Sign
+                        in</button>
+                </div>
+            </form>
+        </div>
+        <div v-else>
+            <h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl text-center">Registrations are disabled
+            </h1>
+            <p class="mt-6 text-lg leading-8 text-gray-600 text-center">Ask this instance's admin to enable them in config!
+            </p>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { APIInstance } from "../../../../types/entities/instance";
+import LoginInput from "../../components/LoginInput.vue";
+
+const config = (await useFetch("/api/config")).data.value;
+
+if (!config) {
+    throw new Error("Config not found");
+}
+
+const url = `${config.http.bind}:${config.http.bind_port}`;
+
+const instanceInfo = (await fetch(new URL("/api/v1/instance", url)).then(
+    (data) => data.json(),
+)) as APIInstance & {
+    tos_url: string;
+};
+
+const errors = ref<{
+    [key: string]: {
+        error: string;
+        description: string;
+    }[];
+}>({});
+
+const password1 = ref<string>("");
+const password2 = ref<string>("");
+const tosAccepted = ref<boolean>(false);
+const reason = ref<string>("");
+
+const passwordsMatch = computed(() => password1.value === password2.value);
+
+const registerUser = (e: Event) => {
+    e.preventDefault();
+    const formData = new FormData();
+
+    const target = e.target as unknown as Record<string, HTMLInputElement>;
+
+    formData.append("email", target.email.value);
+    formData.append("password", target.password.value);
+    formData.append("username", target.username.value);
+    formData.append("reason", reason.value);
+    formData.append("locale", "en");
+    formData.append("agreement", "true");
+
+    fetch("/api/v1/accounts", {
+        method: "POST",
+        body: formData,
+    })
+        .then(async (res) => {
+            if (res.status === 422) {
+                errors.value = (
+                    (await res.json()) as Record<
+                        string,
+                        {
+                            [key: string]: {
+                                error: string;
+                                description: string;
+                            }[];
+                        }
+                    >
+                ).details;
+                console.log(errors.value);
+            } else {
+                // @ts-ignore
+                window.location.href = "/register/success";
+            }
+        })
+        .catch(async (err) => {
+            console.error(err);
+        });
+};
+</script>
\ No newline at end of file
diff --git a/packages/frontend/pages/register/success.vue b/packages/frontend/pages/register/success.vue
new file mode 100644
index 00000000..6575fa04
--- /dev/null
+++ b/packages/frontend/pages/register/success.vue
@@ -0,0 +1,14 @@
+<template>
+    <div class="flex min-h-screen flex-col justify-center px-6 py-12 lg:px-8 relative">
+        <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
+            <div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]"
+                style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
+        </div>
+        <div>
+            <h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl text-center">Registration was a success!
+            </h1>
+            <p class="mt-6 text-lg leading-8 text-gray-600 text-center"> You can now login to your account in any Mastodon
+                client </p>
+        </div>
+    </div>
+</template>
\ No newline at end of file
diff --git a/packages/frontend/public/favicon.png b/packages/frontend/public/favicon.png
new file mode 100644
index 00000000..c56caef9
Binary files /dev/null and b/packages/frontend/public/favicon.png differ
diff --git a/packages/frontend/server/api/config.ts b/packages/frontend/server/api/config.ts
new file mode 100644
index 00000000..ad9db0d8
--- /dev/null
+++ b/packages/frontend/server/api/config.ts
@@ -0,0 +1,18 @@
+import { loadConfig } from "c12";
+import { type Config, defaultConfig } from "config-manager/config.type";
+
+const promise = loadConfig<Config>({
+    configFile: "./config/config.toml",
+    defaultConfig: defaultConfig,
+});
+
+export default defineEventHandler(async () => {
+    const { config } = await promise;
+    return {
+        http: {
+            bind: config?.http.bind,
+            bind_port: config?.http.bind_port,
+            base_url: config?.http.base_url,
+        },
+    };
+});
diff --git a/packages/frontend/server/tsconfig.json b/packages/frontend/server/tsconfig.json
new file mode 100644
index 00000000..deaaf79b
--- /dev/null
+++ b/packages/frontend/server/tsconfig.json
@@ -0,0 +1,3 @@
+{
+    "extends": "../.nuxt/tsconfig.server.json"
+}
diff --git a/packages/frontend/tailwind.config.ts b/packages/frontend/tailwind.config.ts
new file mode 100644
index 00000000..dac155d7
--- /dev/null
+++ b/packages/frontend/tailwind.config.ts
@@ -0,0 +1,9 @@
+import type { Config } from "tailwindcss";
+import forms from "@tailwindcss/forms";
+
+// Default are on https://tailwindcss.nuxtjs.org/tailwind/config#default-configuration
+export default (<Partial<Config>>{
+    theme: {},
+    plugins: [forms],
+    content: [],
+});
diff --git a/packages/frontend/tsconfig.json b/packages/frontend/tsconfig.json
new file mode 100644
index 00000000..51003a02
--- /dev/null
+++ b/packages/frontend/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "extends": "./.nuxt/tsconfig.json",
+  "compilerOptions": {
+    "target": "ESNext"
+  }
+}
diff --git a/server.ts b/server.ts
index 556c6ef2..2fa206f8 100644
--- a/server.ts
+++ b/server.ts
@@ -50,8 +50,7 @@ export const createServer = (
                     try {
                         if (matches(ip, request_ip)) {
                             const file = Bun.file(
-                                config.http.bait.send_file ||
-                                    "./pages/beemovie.txt",
+                                config.http.bait.send_file || "./beemovie.txt",
                             );
 
                             if (await file.exists()) {
@@ -75,8 +74,7 @@ export const createServer = (
                 for (const agent of config.http.bait.bait_user_agents) {
                     if (new RegExp(agent).test(ua)) {
                         const file = Bun.file(
-                            config.http.bait.send_file ||
-                                "./pages/beemovie.txt",
+                            config.http.bait.send_file || "./beemovie.txt",
                         );
 
                         if (await file.exists()) {
@@ -176,7 +174,7 @@ export const createServer = (
             }
 
             // Proxy response from Vite at localhost:5173 if in development mode
-            if (isProd) {
+            if (false) {
                 let file = Bun.file("./pages/dist/index.html");
                 if (new URL(req.url).pathname.startsWith("/assets")) {
                     file = Bun.file(`./pages/dist${new URL(req.url).pathname}`);