diff --git a/.vscode/settings.json b/.vscode/settings.json
index 35aabda..25fa621 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,4 +1,3 @@
-// .vscode/settings.json
 {
   "typescript.tsdk": "node_modules/typescript/lib"
 }
diff --git a/bun.lockb b/bun.lockb
index 380842b..1f9449b 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index caa1c05..c4f34e5 100644
--- a/package.json
+++ b/package.json
@@ -16,10 +16,13 @@
     "reset-cache": "rm -rf /home/whatplan/.bun/install/cache && rm -rf node_modules && bun i"
   },
   "devDependencies": {
+    "@ianvs/prettier-plugin-sort-imports": "^4.1.0",
     "@kitajs/ts-html-plugin": "^1.0.1",
     "bun-types": "latest",
     "concurrently": "^8.2.1",
     "drizzle-kit": "^0.19.13",
+    "prettier": "^3.0.3",
+    "prettier-plugin-tailwindcss": "^0.5.4",
     "typescript": "^5.2.2",
     "unocss": "^0.55.7"
   },
diff --git a/prettier.config.cjs b/prettier.config.cjs
new file mode 100644
index 0000000..74e9d1f
--- /dev/null
+++ b/prettier.config.cjs
@@ -0,0 +1,17 @@
+/** @typedef  {import("prettier").Config} PrettierConfig */
+
+/** @type { PrettierConfig | SortImportsConfig } */
+const config = {
+  arrowParens: "always",
+  printWidth: 80,
+  singleQuote: false,
+  semi: true,
+  trailingComma: "all",
+  tabWidth: 2,
+  plugins: [
+    "@ianvs/prettier-plugin-sort-imports",
+    "prettier-plugin-tailwindcss",
+  ],
+};
+
+module.exports = config;
diff --git a/src/auth/index.ts b/src/auth/index.ts
index 7a35f2c..f141c34 100644
--- a/src/auth/index.ts
+++ b/src/auth/index.ts
@@ -1,6 +1,6 @@
+import { libsql } from "@lucia-auth/adapter-sqlite";
 import { lucia } from "lucia";
 import { web } from "lucia/middleware";
-import { libsql } from "@lucia-auth/adapter-sqlite";
 import { config } from "../config";
 import { client } from "../db";
 
diff --git a/src/components/base.tsx b/src/components/base.tsx
index 660adaf..2fe87c4 100644
--- a/src/components/base.tsx
+++ b/src/components/base.tsx
@@ -1,6 +1,6 @@
-import { type PropsWithChildren } from "beth-stack/jsx";
-import { liveReloadScript } from "beth-stack/dev";
 import { htmxExtensionScript } from "beth-stack";
+import { liveReloadScript } from "beth-stack/dev";
+import { type PropsWithChildren } from "beth-stack/jsx";
 import { config } from "../config";
 
 const safeScript =
diff --git a/src/components/todos.tsx b/src/components/todos.tsx
index 993a2ae..a8ba5de 100644
--- a/src/components/todos.tsx
+++ b/src/components/todos.tsx
@@ -10,6 +10,7 @@ export function TodoItem({ content, completed, id }: Todo) {
         hx-post={`/api/todos/toggle/${id}`}
         hx-swap="outerHTML"
         hx-target="closest div"
+        class="p4 pt-2"
       />
       <button
         class="text-red-500"
diff --git a/src/context/index.ts b/src/context/index.ts
index 05a59c4..ecafd82 100644
--- a/src/context/index.ts
+++ b/src/context/index.ts
@@ -6,6 +6,7 @@ import { client, db } from "../db";
 import "beth-stack/jsx/register";
 import { bethStack } from "beth-stack/elysia";
 import { auth } from "../auth";
+
 // import { cron } from "@elysiajs/cron";
 
 // const stream = pretty({
@@ -19,7 +20,7 @@ export const ctx = new Elysia({
     bethStack({
       log: true,
       returnStaleWhileRevalidate: false,
-    })
+    }),
   )
   // .use(
   //   logger({
diff --git a/src/controllers/*.ts b/src/controllers/*.ts
index 5c2283f..5244082 100644
--- a/src/controllers/*.ts
+++ b/src/controllers/*.ts
@@ -1,5 +1,6 @@
 import Elysia from "elysia";
 import { todosController } from "./todos";
+
 // import { authController } from "./auth";
 
 export const api = new Elysia({
diff --git a/src/controllers/todos.tsx b/src/controllers/todos.tsx
index a8f06f9..be5abe3 100644
--- a/src/controllers/todos.tsx
+++ b/src/controllers/todos.tsx
@@ -1,10 +1,9 @@
+import { eq } from "drizzle-orm";
 import { Elysia, t } from "elysia";
+import { TodoForm, TodoItem, TodoList } from "../components/todos";
 import { ctx } from "../context";
-import { insertTodoSchema, todos } from "../db/schema/todos";
-import { TodoItem, TodoForm, TodoList } from "../components/todos";
-
 import { client, db } from "../db";
-import { eq } from "drizzle-orm";
+import { insertTodoSchema, todos } from "../db/schema/todos";
 
 export const todosController = new Elysia({
   prefix: "/todos",
@@ -46,7 +45,7 @@ export const todosController = new Elysia({
       params: t.Object({
         id: t.Numeric(),
       }),
-    }
+    },
   )
   .delete(
     "/:id",
@@ -57,7 +56,7 @@ export const todosController = new Elysia({
       params: t.Object({
         id: t.Numeric(),
       }),
-    }
+    },
   )
   .post(
     "",
@@ -94,5 +93,5 @@ export const todosController = new Elysia({
           t.Literal("sub"),
         ]),
       }),
-    }
+    },
   );
diff --git a/src/db/index.ts b/src/db/index.ts
index 62c22c9..2670fee 100644
--- a/src/db/index.ts
+++ b/src/db/index.ts
@@ -1,7 +1,7 @@
-import { drizzle } from "drizzle-orm/libsql";
 import { createClient } from "@libsql/client";
-import * as schema from "./schema";
+import { drizzle } from "drizzle-orm/libsql";
 import { config } from "../config";
+import * as schema from "./schema";
 
 export const client = createClient({
   url: config.env.DATABASE_URL,
diff --git a/src/db/schema/auth.ts b/src/db/schema/auth.ts
index 2d312f0..777ec7a 100644
--- a/src/db/schema/auth.ts
+++ b/src/db/schema/auth.ts
@@ -1,4 +1,4 @@
-import { sqliteTable, text, blob } from "drizzle-orm/sqlite-core";
+import { blob, sqliteTable, text } from "drizzle-orm/sqlite-core";
 
 export const user = sqliteTable("user", {
   id: text("id").primaryKey(),
diff --git a/src/db/schema/index.ts b/src/db/schema/index.ts
index 8bfc8b1..7113cbe 100644
--- a/src/db/schema/index.ts
+++ b/src/db/schema/index.ts
@@ -1,2 +1,2 @@
 export { todos } from "./todos";
-export * from "./auth"
\ No newline at end of file
+export * from "./auth";
diff --git a/src/db/schema/todos.ts b/src/db/schema/todos.ts
index f589fa3..53dee22 100644
--- a/src/db/schema/todos.ts
+++ b/src/db/schema/todos.ts
@@ -1,4 +1,4 @@
-import { text, integer, sqliteTable } from "drizzle-orm/sqlite-core";
+import { integer, sqliteTable, text } from "drizzle-orm/sqlite-core";
 import { createInsertSchema, createSelectSchema } from "drizzle-typebox";
 
 export const todos = sqliteTable("todos", {
diff --git a/src/main.ts b/src/main.ts
index 7062413..010f4f8 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,8 +1,8 @@
-import { Elysia } from "elysia";
 // import { swagger } from "@elysiajs/swagger";
 import { staticPlugin } from "@elysiajs/static";
-import { api } from "./controllers/*";
+import { Elysia } from "elysia";
 import { config } from "./config";
+import { api } from "./controllers/*";
 import { pages } from "./pages/*";
 
 const app = new Elysia()
@@ -24,5 +24,5 @@ const app = new Elysia()
 export type App = typeof app;
 
 console.log(
-  `app is listening on http://${app.server?.hostname}:${app.server?.port}`
+  `app is listening on http://${app.server?.hostname}:${app.server?.port}`,
 );
diff --git a/src/pages/(auth)/*.ts b/src/pages/(auth)/*.ts
index ee050dc..e8e688a 100644
--- a/src/pages/(auth)/*.ts
+++ b/src/pages/(auth)/*.ts
@@ -1,6 +1,7 @@
 import Elysia from "elysia";
 // import { signup } from "./signup";
 import { profile } from "./profile";
+
 // import { signin } from "./signin";
 
 export const authGroup = new Elysia()
diff --git a/src/pages/(auth)/profile.tsx b/src/pages/(auth)/profile.tsx
index 8861fa7..39f9198 100644
--- a/src/pages/(auth)/profile.tsx
+++ b/src/pages/(auth)/profile.tsx
@@ -9,6 +9,10 @@ export const profile = new Elysia()
 
     const session = await authRequest.validate();
     return html(() =>
-      session ? <div>Hello {session.user.email}</div> : <div>Not logged in</div>
+      session ? (
+        <div>Hello {session.user.email}</div>
+      ) : (
+        <div>Not logged in</div>
+      ),
     );
   });
diff --git a/src/pages/*.ts b/src/pages/*.ts
index 48aa384..78fcf4b 100644
--- a/src/pages/*.ts
+++ b/src/pages/*.ts
@@ -1,5 +1,5 @@
 import Elysia from "elysia";
-import { index } from "./index";
 import { authGroup } from "./(auth)/*";
+import { index } from "./index";
 
 export const pages = new Elysia().use(index).use(authGroup);
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index d5eba2c..a1579a8 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,8 +1,8 @@
+import { persistedCache, revalidateTag } from "beth-stack/cache";
+import { renderToStream, renderToString, Suspense } from "beth-stack/jsx";
 import { Elysia } from "elysia";
 import { BaseHtml } from "../components/base";
 import { ctx } from "../context";
-import { Suspense, renderToStream, renderToString } from "beth-stack/jsx";
-import { persistedCache, revalidateTag } from "beth-stack/cache";
 
 const start = Date.now();
 
@@ -58,7 +58,7 @@ function wait(ms: number): Promise<number> {
   return new Promise((resolve) =>
     setTimeout(() => {
       resolve(ms);
-    }, ms)
+    }, ms),
   );
 }
 
diff --git a/src/types/htmx.d.ts b/src/types/htmx.d.ts
index 9da79be..070d502 100644
--- a/src/types/htmx.d.ts
+++ b/src/types/htmx.d.ts
@@ -1,6 +1,6 @@
 type RoutesByType<
   Schema extends Record<string, any>, // Ensure keys are strings
-  Type extends "get" | "post" | "put" | "delete" | "patch"
+  Type extends "get" | "post" | "put" | "delete" | "patch",
 > = RouterPattern<
   RemoveSlash<
     string &