diff options
| author | Mathias Magnusson <mathias@magnusson.space> | 2025-08-14 15:11:23 +0200 |
|---|---|---|
| committer | Mathias Magnusson <mathias@magnusson.space> | 2025-08-14 18:44:19 +0200 |
| commit | 923c7c6b1a6549a6c5012713a22d5cf6e478f994 (patch) | |
| tree | 1f50b20f53745f348ea7215a0ab0dd90a45a8863 /src/index.tsx | |
| parent | 59f99c59d577ac4c640bee676856969ec035bcb6 (diff) | |
| download | uneven-923c7c6b1a6549a6c5012713a22d5cf6e478f994.tar.gz | |
Set up htmx & drizzle+libsql
Diffstat (limited to 'src/index.tsx')
| -rw-r--r-- | src/index.tsx | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/src/index.tsx b/src/index.tsx new file mode 100644 index 0000000..c72d766 --- /dev/null +++ b/src/index.tsx @@ -0,0 +1,45 @@ +import { serve } from "@hono/node-server"; +import { Hono } from "hono"; +import { createClient } from "@libsql/client"; +import { drizzle } from "drizzle-orm/libsql"; +import { groupsTable } from "./db/schema.js"; + +const app = new Hono(); +const db = drizzle(createClient({ url: "file:data.db" })); + +async function Groups() { + const result = await db.select().from(groupsTable).all(); + + return <ul>{ + result.map(group => <li>{group.name}</li>) + }</ul>; +} + +app.get("/", c => c.html( + <html lang="en"> + <head> + <meta charset="UTF-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-Akqfrbj/HpNVo8k11SXBb6TlBWmXXlYQrCSqEWmyKJe+hDm3Z/B2WVG4smwBkRVm" crossorigin="anonymous"></script> + <title>Uneven</title> + </head> + <body> + <Groups /> + <button hx-get="/button" hx-swap="outerHTML">click me!</button> + </body> + </html> +)); + +let colors = ["red", "green", "blue"]; +app.get("/button", c => c.html( + <button + hx-get="/button" + hx-swap="outerHTML" + style={{ backgroundColor: colors[Math.floor(Math.random() * colors.length)] }} + >disco button!</button> +)); + +serve({ + fetch: app.fetch, + port: 3000, +}, info => console.log(`Server is running on http://localhost:${info.port}`)); |