great stuff

nose/app/dir/index.ts

@@ -1,4 +0,0 @@
-import { text } from "./other"
-
-export default (c: Context) =>
-    c.text(text)

nose/app/dir/index.tsx

@@ -0,0 +1,36 @@
+import { text } from "./other"
+import { css } from "@utils"
+
+export default (c: Context) => {
+    return <>
+        {css`
+        body {
+            background-color: cyan;
+            font-family: "Comic Sans MS", "Comic Sans", "Chalkboard", "Comic Neue", cursive;
+        }
+
+        main {
+            width: 500px;
+            margin: 0 auto;
+        }
+
+        h1 {
+            color: red;
+            border-bottom: 1px dashed red;
+        }
+
+        p {
+            color: magenta;
+            font-size: 18px;
+
+        }
+        `}
+
+        <main>
+            <h1>{text}</h1>
+            <p>
+                This is a really nice website. I'm glad you like it.
+            </p>
+        </main>
+    </>
+}

package.json

@@ -7,6 +7,10 @@
     "start": "bun src/server.ts",
     "dev": "bun --hot src/server.ts"
   },
+  "alias": {
+    "@utils": "./src/utils.tsx",
+    "@/*": "./src/*"
+  },
   "devDependencies": {
     "@types/bun": "latest"
   },

src/utils.tsx

@@ -45,3 +45,23 @@ export async function transpile(path: string): Promise<string> {
 
     return cached
 }
+
+//
+// webapp utils (for writing webapps)
+//
+
+export function css(strings: TemplateStringsArray, ...values: any[]) {
+    return <style dangerouslySetInnerHTML={{
+        __html: strings.reduce((result, str, i) => {
+            return result + str + (values[i] || '')
+        }, '')
+    }} />
+}
+
+export function js(strings: TemplateStringsArray, ...values: any[]) {
+    return <script dangerouslySetInnerHTML={{
+        __html: strings.reduce((result, str, i) => {
+            return transpiler.transformSync(result + str + (values[i] || ''))
+        }, '')
+    }} />
+}

tsconfig.json

@@ -25,6 +25,13 @@
     // Some stricter flags (disabled by default)
     "noUnusedLocals": false,
     "noUnusedParameters": false,
-    "noPropertyAccessFromIndexSignature": false
+    "noPropertyAccessFromIndexSignature": false,
+
+    // paths?
+    "baseUrl": ".",
+    "paths": {
+      "@utils": ["src/utils.tsx"],
+      "@/*": ["src/*"]
+    },
   }
 }