forked from quic-issues/427e7578-d7bf-49c8-aee9-2dd999e25316
status, created, tags, priority, created_at, updated_at, transitions, completed_at, completed
| status | created | tags | priority | created_at | updated_at | transitions | completed_at | completed | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| complete | 2026-03-16 |
|
high | 2026-03-16T07:51:47.401Z | 2026-03-16T10:01:25.930Z |
|
2026-03-16T10:01:25.930Z | 2026-03-16 |
Project Setup & Architecture
Status: ✅ Complete · Priority: High · Created: 2026-03-16 · Tags: infra, setup
Overview
Scaffold the SvelteKit project with PeerJS for WebRTC-based P2P communication. This is the foundation all other specs build on. The app is a decentralized polling tool—no central backend for poll data.
Design
- Framework: SvelteKit (SSR for public sharing pages, SPA for the app itself)
- P2P: PeerJS (WebRTC data channels for peer communication)
- Signaling: PeerJS Cloud (free tier to start; can self-host later)
- State: Svelte stores + IndexedDB (via
idb-keyvalor similar) for local persistence - Styling: Tailwind CSS (mobile-first utility classes)
- Build/Deploy: Vercel or Cloudflare Pages (static adapter for SPA routes, SSR for public pages)
Mobile-First UI Principles (applies to ALL UI work)
- Touch targets ≥ 44px
- Single-column layout on mobile; expand on larger screens
- Bottom navigation bar (thumb-friendly): Home, Create (+), Profile
- Minimal chrome—content first
- Dark mode support (
prefers-color-scheme) - System font stack for performance
- Tailwind mobile breakpoints as default (design small → scale up)
Architecture
┌─────────────────────────────────────┐
│ SvelteKit App (runs in browser) │
│ ├── Svelte Stores (reactive state) │
│ ├── IndexedDB (persistence) │
│ ├── PeerJS (WebRTC data channels) │
│ └── Crypto (identity keypairs) │
└──────────┬──────────────────────────┘
│ WebRTC
┌─────┴─────┐
│ Other Peers│
└───────────┘
Plan
- Init SvelteKit project with TypeScript
- Install dependencies: peerjs, tailwindcss, idb-keyval
- Set up Tailwind with mobile-first config
- Create basic app layout (shell, navigation)
- Set up IndexedDB persistence layer
- Configure SvelteKit adapter (adapter-auto for Vercel/CF, SSR mode)
Test
npm run devstarts without errors- Tailwind classes render correctly
- IndexedDB read/write works in browser
Notes
- PeerJS Cloud has rate limits—fine for development, may need self-hosted signaling for production
- No server-side database; all poll data lives on peers' devices