Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data β all from the browser, and deployed in milliseconds.
A full-stack app with two features: assistance requests and live chat β both persisted in SQLite.
- Submit assistance requests with validation
- All requests saved to the database and displayed newest-first
- Persists across page refreshes
- Enter a username to join the chat room
- Messages delivered in real-time via Server-Sent Events (SSE)
- Chat history (last 100 messages) loaded from the database on join
- Messages from you appear on the right (blue), others on the left (white)
- Live indicator shows connection status
assistance_requests
| Column | Type | Description |
|---|---|---|
id | INTEGER | Auto-incrementing PK |
textContent | TEXT | Request content (validated non-empty) |
timestamp | TEXT | ISO 8601 |
chat_messages
| Column | Type | Description |
|---|---|---|
id | INTEGER | Auto-incrementing PK |
username | TEXT | Sender's display name |
message | TEXT | Message content (validated non-empty) |
timestamp | TEXT | ISO 8601 |
| Method | Endpoint | Description |
|---|---|---|
GET | /api/requests | All assistance requests |
POST | /api/requests | Submit a request |
GET | /api/chat | Chat history (last 100) |
POST | /api/chat | Send a chat message |
GET | /api/chat/stream | SSE stream for real-time messages |
Rendering mermaid diagram...
index.ts β Hono server (API + SSE + static files)
shared/
types.ts β AssistanceRequest & ChatMessage types
frontend/
index.html β HTML shell
index.tsx β React entrypoint
components/
App.tsx β Tab navigation (Requests / Chat)
RequestForm.tsx β Assistance request form + list
LiveChat.tsx β Username gate + chat UI + SSE listener