/Wiki/sources/honojs__hono/2026/https-hono-dev-llms-full-txt-bun-with-jsx-476d30c22505-bun-with-jsx-s0712-c0000.md
Bun with JSX - hono-docs
Bun with JSX Source evidence: /Sources/raw/honojs hono/honojs hono.md Canonical citation: https://hono.dev/llms full.txt bun with jsx Summary tsx import { Ho...
Bun with JSX
Source evidence: /Sources/raw/honojshono/honojshono.md Canonical citation: https://hono.dev/llms-full.txt#bun-with-jsx
Summary
## Content
```tsx
import { Hono } from 'hono'
import { upgradeWebSocket, websocket } from 'hono/bun'
import { html } from 'hono/html'
const app = new Hono()
app.get('/', (c) => {
return c.html(
<html>
<head>
<meta charset='UTF-8' />
</head>
<body>
<div id='now-time'></div>
{html`
<script>
const ws = new WebSocket('ws://localhost:3000/ws')
const $nowTime = document.getElementById('now-time')
ws.onmessage = (event) => {
$nowTime.textContent = event.data
}
</script>
`}
</body>
</html>
)
})
const ws = app.get(
'/ws',
upgradeWebSocket((c) => {
let intervalId
return {
onOpen(_event, ws) {
intervalId = setInterval(() => {
ws.send(new Date().toString())
}, 200)
},
onClose() {
clearInterval(intervalId)
},
}
})
)
export default {
fetch: app.fetch,
websocket,
}