AI Culinary Companion
AI-powered Vietnamese recipe finder with Google Gemini 2.5-flash for intelligent recipe generation. Smart search with 101+ Vietnamese recipes database featuring advanced filtering and AI-generated custom recipes.
Timeline
Started
November 2024
Completed
December 2024
Duration
1 month
Technologies
- React 19.2.0
- TypeScript
- Vite 6.2.0
- Google Gemini 2.5-flash
- TailwindCSS (CDN)
- @google/generative-ai 1.28.0
Key Features
- AI Recipe Generator with Gemini
- Smart search & multi-criteria filtering
- 101+ Vietnamese recipes database
- Responsive design (mobile/desktop)
- Quick suggestion tags
Highlighted Features
AI Recipe Generator
Create custom recipes using Google Gemini AI - just describe what you want to cook, and AI generates detailed recipes with ingredients and steps.
Smart Search
Search by dish name, ingredients, difficulty, cooking time, and more with intelligent filtering system.
Multi-Criteria Filter
Filter by cooking time (quick/medium/slow), difficulty level, category (main dish/dessert), servings, and dietary preferences.
Responsive Design
Seamless experience across all devices with sidebar filter for desktop and modal filter for mobile.
Technical Architecture
Frontend
- Framework: React 19.2.0
- Language: TypeScript
- Build Tool: Vite 6.2.0
- Styling: TailwindCSS (CDN)
- Fonts: Quicksand, Playfair Display
AI Integration
- Platform: Google Gemini 2.5-flash
- SDK: @google/generative-ai 1.28.0
- Features: Structured recipe generation
Data Management
- Database: 101 Vietnamese recipes mock data
- Image Hosting: GitHub Raw URLs
- State Management: React Hooks (useState)