A social-first mobile cooking app where people share what they're cooking, how they're saving money, and how they're using leftovers. Powered by an inventory system, AI recipes, and grocery lists.

• Feed: Infinite scroll of posts from people you follow and recommended content
• Create Posts: Share meals, fridge/pantry updates, or tips with optional recipe attachments
• Explore: Discover trending budget meals, zero-waste pros, and most re-cooked recipes
• Profiles: View user stats, posts, recipes, and badges
• Social Actions: Like, comment, and re-cook recipes from the feed

• Inventory Management: Track items in fridge, freezer, and pantry with expiry alerts
• AI Recipe Generator: Generate personalized recipes based on your inventory
• Meal Planning: Plan your week with recipes and track what you've cooked
• Grocery Lists: Smart shopping lists that respect your inventory

• React 18 with TypeScript
• Vite for fast development
• React Router for navigation
• Zustand for state management
• Tailwind CSS for styling
• Lucide React for icons
• PWA-ready with Vite PWA plugin

• Node.js 18+ and npm/pnpm

1. Install dependencies:

npm install
# or
pnpm install

2. Start the development server:

npm run dev
# or
pnpm dev

3. Open your browser to http://localhost:3000

npm run build
# or
pnpm build

The built files will be in the dist directory, ready to be deployed as a PWA.

The app is designed mobile-first with:

• Bottom tab navigation (native app feel)
• Touch-friendly targets (minimum 44x44px)
• Safe area insets for notched devices
• Responsive layouts optimized for phones
• PWA manifest for installable app experience

src/
├── components/       # Reusable UI components
├── screens/         # Main app screens
├── layouts/         # Layout components
├── store/          # Zustand state management
├── types/           # TypeScript type definitions
├── lib/             # Utility functions
└── main.tsx         # App entry point

• FeedScreen: Main social feed with posts
• CreatePostScreen: Post creation with media, recipes, and stats
• KitchenScreen: Hub for inventory, AI recipes, meal plan, and grocery list
• ProfileScreen: User profile with stats and posts
• ExploreScreen: Discover trending content and topics
• PostDetailScreen: Full post view with comments
• RecipeDetailScreen: Recipe details with ingredients and steps

1. Meal Posts: Share what you cooked with recipe and stats
2. Fridge/Pantry Posts: Before & after photos of your inventory
3. Tip Posts: Share cooking tips, hacks, or reviews

• Cost per serving (auto-calculated from inventory)
• Waste saved (tracks expiring items used)
• Expiring items used count
• Auto-generated badges (NO-WASTE, UNDER-$3, etc.)

• Analyzes your inventory
• Prioritizes expiring items
• Generates personalized recipes
• Estimates cost and waste saved

• The app uses mock data for demonstration
• In production, you'll need to connect to backend APIs
• Image uploads are simulated (use actual file upload in production)
• Camera/receipt scanning is placeholder (integrate with device APIs)

MIT