I built a social network with a single HTML file
I've been building Relay, a small social network. It's live and free to use: https://relay-4vm.pages.dev What it has so far: For you and Following feeds Direct messages with images and GIFs Notifications Editable prof
I've been building Relay, a small social network. It's live and free to use: https://relay-4vm.pages.dev
What it has so far:
- For you and Following feeds
- Direct messages with images and GIFs
- Notifications
- Editable profiles
- Dark mode
- Password reset with email codes
The frontend is a single HTML file, now past 13,000 lines. The backend is TypeScript, and the frontend is hosted on Cloudflare Pages.
A few things I ran into:
One file works until it doesn't. Past roughly 10k lines, every change touches the same file, searching gets slow, and parallel changes conflict. I'm keeping it for now, but the CSS and JS are the first things I'd split out.
Small UI details take longer than features. Getting a message action bar to sit beside an image instead of on top of it, without resizing the image when it appears, took more effort than adding the feature itself.
Security belongs on the server. For password reset, the code check and the single-use reset token live in the backend. The UI only collects input.
Test on a real phone early. Long display names, Arabic text, and the keyboard covering buttons broke things I never saw on desktop.
It's still rough in places. If you try it, tell me what breaks or what's missing.
Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes β full credit and traffic to the original publisher.