Grocery PWA
A voice-first grocery management PWA in daily production use by a family of four. Natural language voice input gets parsed by Claude AI into structured, categorized grocery items. Features multi-user authentication with speaker profiles, real-time inventory tracking with purchase history, category-based views, and a dislike/feedback system. Backend automation via n8n webhooks with Neon Postgres for persistence. Demonstrates end-to-end system design: voice capture, AI processing pipeline, database schema design, and responsive PWA with offline support.
My Thoughts
Why I Built This
My family of four needed a shared grocery list that anyone could add to by speaking. No app installs, no accounts to manage. Just open the browser and talk.
Architecture
Zero-framework PWA: a single HTML file with embedded CSS and JavaScript. Backend runs on n8n workflows connected to Neon Postgres. Voice input uses the Web Speech API with speaker attribution.
Key Engineering Decisions
- Zero-framework approach means the app loads instantly and works offline as a PWA. No build step, no JavaScript framework overhead.
- n8n backend handles all CRUD, auth, inventory tracking, and purchase history through API endpoints.
- Dislike system with reasons lets family members explain why they flagged an item ("nobody is eating them"), turning the app into a household communication tool.