04 — Native-feeling PWA
100dvh layouts
Safe-area bottom nav
GPU transitions
Embedded maps
A single React app shipping to web, iOS and Android — designed, built and deployed end-to-end.
RHV needed to reach members as an installable iOS and Android app, run a full admin console, and power event-day tooling — all without standing up a separate backend team or a second admin product. The constraint shaped the architecture: a deliberately small, modern stack chosen for speed of iteration and operational simplicity, where the same code powers the member experience, the admin console and the event tools at once.
A single codebase ships to web, iOS PWA, Android PWA and the App-Store and Play-Store shells — a 4× reduction in the surface area the team has to maintain.
RHV is a React 18 PWA built with Vite 5, deployed continuously to Vercel and wrapped with Capacitor 8 for native iOS and Android distribution. Supabase provides Postgres, Auth, Realtime and Storage, plus a Deno edge-functions runtime for transactional email and webhooks. State is split across eight scoped React contexts so boundaries stay predictable — Auth, Members, Messages, Feed, WLTM Board, and more.
| Layer | Technology | Why it was chosen |
|---|---|---|
| Frontend | React 18 · Vite 5 · React Router 6 | Lazy-loaded routes, fast HMR, mature ecosystem. |
| Styling | Tailwind CSS + RHV tokens | A strict design system with no runtime cost. |
| State | Eight scoped React contexts | Predictable boundaries per domain. |
| Backend | Supabase (Postgres / Auth / Realtime / Storage) | Production-grade auth + realtime without a custom server. |
| Edge | Supabase Edge Functions (Deno) | Transactional email via Resend, welcome / approval flows, webhooks. |
| PWA | vite-plugin-pwa + Workbox | Installable, offline-first, auto-updating service worker. |
| Native | Capacitor 8 (iOS / Android) | App-store distribution from the same codebase. |
| i18n | i18next + react-i18next | English & Spanish, scoped per page. |
| Testing | Vitest + React Testing Library | Component & integration coverage. |
| Delivery | Vercel CD from main → production | One-click deploys, preview URLs per PR. |
Every data function checks a single feature flag and falls back to localStorage when Supabase is disabled — so the full app runs as a zero-backend demo for pitches, screenshots and offline testing.
Optimistic UI → DB persist → sessionStorage backup. Conversations stay correctly marked as read even when a database write loses the race with a navigation event.
The build emits a version.json; the service worker polls every 60s and triggers a graceful reload when a new version ships. Members never see a stale app.
Posts, comments and reactions are throttled locally (5 posts/day, 20 comments/hour) before ever hitting the database — the network feels considered, not noisy.
A small access-control helper centralises the six-tier visibility rules so every page, filter and search query stays in sync with the "Boardroom-stays-hidden" contract.
GDPR consent capture with an audit log, granular email preferences, blocking, reporting, account deletion — and a privacy gate that blocks the app until a member uploads a real photo.
RHV shipped as a quietly polished product the team can run, extend and operate without engineering bottlenecks. One product, every surface: a single codebase ships to web, iOS, Android and both app stores. Operations without an ops team: registration approvals, tier changes, event scheduling, segmented push notifications and content moderation all happen inside the same app — no second admin product, no SQL console required.
Compliance from day one and ship-velocity by default: auto-deploy from main to Vercel, an auto-updating service worker, a Vitest suite and a version-pinned PWA cache make every change land with zero member friction — the app continues to ship multiple times a week.
"Quiet, considered, and built for the people in the room."
Where it goes next: deeper event tooling, richer matchmaking, sponsor analytics, a careers track — and, longer term, expansion beyond retail into adjacent invitation-only communities that share the same brief: a private network, designed with restraint.