Kain
AI-powered family meal planning app with Filipino cuisine focus, drag-and-drop weekly calendars, and real-time shared grocery lists. "Kain na!" means "Come eat!" in Tagalog.
Duration
Ongoing
Team Size
1 developer
Industry
Food & Family
Client
Personal Project
Project Results
Authentic Filipino recipes with full nutrition data
Shared grocery lists with live sync across devices
Brainstorm, Plan My Week, and reverse ingredient search
The Challenge
Meal planning services like Blue Apron are expensive, inflexible, and completely ignore the cuisines that many families actually cook. My family cooks Filipino food. Adobo, sinigang, kare-kare, lumpia. No meal kit service covers that. I also wanted something that worked the way real families shop: one person at the store texting "what do we need?" while someone else is at home checking the fridge.
Our Solution
I built Kain as a full-stack app with React 19, Supabase, and Google Gemini. It has a drag-and-drop weekly calendar for meal planning, a recipe library seeded with 25+ authentic Filipino dishes, and AI-powered features that actually help. The Grocery Store Brainstorm lets you type an ingredient you’re looking at in the store and get instant recipe suggestions. Plan My Week generates a full week of meals based on your household’s preferences. And the shared grocery list syncs in real-time so multiple family members can shop simultaneously.
Key Features
Technologies Used
Technical Implementation
frontend
React 19 with TypeScript 5.9 and Vite 7. Tailwind CSS 4 for styling. Zustand for client state management. dnd-kit for drag-and-drop calendar interactions. Framer Motion for animations. Recharts 3 for nutrition visualizations.
backend
Supabase handles everything: Postgres database, magic link + Google OAuth authentication, Realtime subscriptions for live grocery list sync, and Edge Functions for API proxies. Row-Level Security scopes all data to household level.
integrations
Google Gemini 3 Flash for all AI features (brainstorm, weekly planning, recipe adaptation), proxied through Supabase Edge Functions. Spoonacular for recipe search. USDA FoodData Central for ingredient nutrition. Edamam for freeform recipe analysis.
performance
Vite 7 dev server with instant HMR. TanStack React Query v5 for server state with optimistic updates. React Router v7 for client-side routing. Mobile-first responsive design with deep green and gold color palette inspired by Filipino heritage.