A real-time chat application built on Val Town with persistent message storage and live updates.

• Username-based login — pick a name to join the chat
• Real-time messaging — messages appear instantly via Server-Sent Events (SSE)
• Persistent storage — messages are stored in SQLite and survive across sessions
• Multi-user sync — open in two tabs to see messages sync in real-time
• Input validation — prevents empty messages, enforces length limits
• Auto-reconnect — SSE connection auto-recovers on disconnect

Rendering mermaid diagram...

1. User enters a username to join
2. Frontend loads recent messages from GET /api/messages
3. Frontend opens an SSE connection to GET /api/messages/stream?lastId=N
4. Server polls SQLite every 1s for new messages and pushes them via SSE
5. When a user sends a message, POST /api/messages inserts it into SQLite
6. All connected SSE streams pick up the new message within ~1 second

• main.ts — Hono HTTP server with API routes and SSE endpoint
• db.ts — SQLite database helpers (init, get, add messages)
• frontend/ — React UI components
  • index.html — Entry HTML page
  • index.tsx — React mount point
  • components/App.tsx — Root component with username state
  • components/UsernameForm.tsx — Login form
  • components/ChatRoom.tsx — Chat UI with SSE connection
  • components/MessageBubble.tsx — Individual message display