aethershelf
/
beth-stack-example
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

idk doesnt work

main
Ethan Niser 2023-09-14 19:24:47 +00:00 committed by GitHub
parent 7a11f92f13
commit f7355f8576
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 120 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
bun.lockb
View File

Binary file not shown.

7
package.json
Unescape Escape View File

@ -3,7 +3,8 @@
"module": "src/main.ts", "module": "src/main.ts",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "concurrently \"bun run --hot src/main.ts\" \"bun run uno:dev\"", "dev": "concurrently \"bun run --hot src/main.ts\" \"bun run uno:dev\" \"bun run liveReload\"",
"liveReload": "bun run --hot src/dev/liveReload.ts",
"start": "bun run uno && bun run src/main.ts", "start": "bun run uno && bun run src/main.ts",
"db:push": "bunx drizzle-kit push:sqlite", "db:push": "bunx drizzle-kit push:sqlite",
"db:studio": "bunx drizzle-kit studio", "db:studio": "bunx drizzle-kit studio",
@ -27,11 +28,11 @@
"@kitajs/html": "^2.1.2", "@kitajs/html": "^2.1.2",
"@libsql/client": "^0.3.4", "@libsql/client": "^0.3.4",
"@t3-oss/env-core": "^0.6.1", "@t3-oss/env-core": "^0.6.1",
"chokidar": "^3.5.3",
"drizzle-orm": "^0.28.6", "drizzle-orm": "^0.28.6",
"drizzle-typebox": "^0.1.1", "drizzle-typebox": "^0.1.1",
"elysia": "^0.6.22", "elysia": "^0.6.22",
"pino-pretty": "^10.2.0", "pino-pretty": "^10.2.0",
"zod": "^3.22.2", "zod": "^3.22.2"
"zodcli": "^0.0.4"
} }
} }

93
src/components/base.tsx
Unescape Escape View File

@ -1,18 +1,79 @@
import Html from "@kitajs/html"; import Html from "@kitajs/html";
import { config } from "../config";
export const BaseHtml = ({ children }: Html.PropsWithChildren) => ` export const BaseHtml = ({ children }: Html.PropsWithChildren) => (
<!DOCTYPE html> <html>
<html lang="en"> <head>
<meta charset="UTF-8" />
<head> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="UTF-8"> <title>THE BETH STACK</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://unpkg.com/htmx.org@1.9.3"></script>
<title>THE BETH STACK</title> <script src="https://unpkg.com/hyperscript.org@0.9.9"></script>
<script src="https://unpkg.com/htmx.org@1.9.3"></script> <link
<script src="https://unpkg.com/hyperscript.org@0.9.9"></script> rel="stylesheet"
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@unocss/reset/tailwind.min.css"> href="https://cdn.jsdelivr.net/npm/@unocss/reset/tailwind.min.css"
<link rel="stylesheet" href="/public/dist/unocss.css"> />
</head> <link rel="stylesheet" href="/public/dist/unocss.css" />
<script>
${children} {`
`; (function () {
var consoleOutput = document.getElementById('consoleOutput');
if (!window.console) {
window.console = {};
}
var oldConsoleLog = console.log;
console.log = function (message) {
// Append the log message to the consoleOutput div
if (consoleOutput) {
var logMessage = document.createElement('p');
logMessage.textContent = message;
consoleOutput.appendChild(logMessage);
}
// Call the original console.log function
oldConsoleLog.apply(console, arguments);
};
// You can do the same for other console methods like error, warn, etc. if needed
})()
`}
</script>
<script>
{`
(function () {
let socket = new WebSocket("ws://localhost:3001/ws");
socket.onopen = function(e) {
console.log("connected")
};
socket.onmessage = function(event) {
console.log(event.data);
location.reload();
};
socket.onclose = function(event) {
console.log("closed");
};
socket.onerror = function(error) {
console.log("error: " + error.message);
};
})();
`}
</script>
</head>
<body>
<div
id="consoleOutput"
style="background-color: #f0f0f0; padding: 10px;"
></div>
<script>console.log("Hello from the client side!");</script>
{children}
</body>
</html>
);

10
src/config/index.ts
Unescape Escape View File

@ -1,6 +1,5 @@
import { createEnv } from "@t3-oss/env-core"; import { createEnv } from "@t3-oss/env-core";
import { z } from "zod"; import { z } from "zod";
import { argumentParser } from "zodcli";
const env = createEnv({ const env = createEnv({
server: { server: {
@ -11,11 +10,12 @@ const env = createEnv({
runtimeEnv: process.env, runtimeEnv: process.env,
}); });
// const args = argumentParser({ const args = {
// options: z.object({}), // watch: process.argv.includes("--watch"),
// }).parse(process.argv.slice(2)); liveReload: true
};
export const config = { export const config = {
env, env,
// args, args,
}; };

33
src/dev/liveReload.ts
Unescape Escape View File

@ -0,0 +1,33 @@
import { Elysia, ws } from "elysia";
import { type ElysiaWS } from "elysia/ws";
import { watch } from "chokidar";
let wsConnections = new Set<ElysiaWS<any>>();
watch("src/**/*.{ts,tsx}").on("all", (event, path) => {
console.log("sending event");
wsConnections.forEach((connection) => {
connection.send("refresh");
});
});
const app = new Elysia()
.use(ws())
.ws("/ws", {
open(ws) {
console.log("open");
wsConnections.add(ws);
},
close(ws) {
console.log("close");
wsConnections.delete(ws);
},
message(ws, message) {
console.log("message", message);
},
})
.listen(3001);
console.log(
`🦊 Livereload running ${app.server?.hostname}:${app.server?.port}`
);

2
src/pages/index.tsx
Unescape Escape View File

@ -10,7 +10,7 @@ export const pages = new Elysia({
.get("/", ({ html }) => .get("/", ({ html }) =>
html( html(
<BaseHtml> <BaseHtml>
<body <div
class="flex w-full h-screen justify-center items-center" class="flex w-full h-screen justify-center items-center"
hx-get="/todos" hx-get="/todos"
hx-swap="innerHTML" hx-swap="innerHTML"