What to Eat: AI Recipes and Meal Planning You Can Self-Host

10月6日 Published inLifestyle Tools

You open the fridge to find three random vegetables, half a block of tofu, and no plan. Instead of ordering takeout, you enter those ingredients into a simple interface and receive a complete recipe, wine pairings, and a realistic image of the finished dish. This is What to Eat.

Smart Recipe Generation Input your available pantry items and preferred cuisine, and the AI builds a full recipe. It eliminates the frustration of staring blankly at your kitchen shelves.

Nutrition Analysis Every dish includes a detailed nutritional breakdown and a health score, helping you keep track of exactly what you are consuming.

AI Imagery Generate a photo of the meal with a single click. See how the dish should look before you even begin prep.

Wine Pairing The system acts as a digital sommelier, suggesting a specific drink to complement the flavors of your meal.

Sauce Design Create custom signature sauces or dressings to give any dish a professional, personal touch.

Collection Save your favorite recipes to a personal library that is easy to search, sort, and reuse.

Kitchen Fortune A playful addition to your routine. Get a daily culinary fortune for a bit of extra fun while you cook.

Ready to try it out or tinker with the code? This project is open-source and ready for local setup.

Requirements

Node.js 18 or newer.

Local Development

  1. Clone: Run git clone https://github.com/liu-ziting/what-to-eat.git and then cd what-to-eat.
  2. Install: Run npm install to install dependencies.
  3. Environment: Copy the template file using cp .env.example .env. Open .env and add your AI API keys.
  4. Start: Run npm run dev to view and debug the app locally.

Build and Deploy

  • Standard Build: Run npm run build for type checking and production bundling.
  • Netlify: Run npm run build:netlify.
  • Preview: Run npm run preview to test the production build locally.

What to Eat supports one-click deployment on Vercel and Netlify. Simply click the "Deploy" button and follow the prompts.

Environment Variables

The application is compatible with OpenAI-style endpoints. Configure these in your .env file:

# Text generation (Lingyiwanwu)
VITE_TEXT_GENERATION_BASE_URL=https://api.lingyiwanwu.com/v1/
VITE_TEXT_GENERATION_API_KEY=your_text_api_key_here
VITE_TEXT_GENERATION_MODEL=yi-lightning

# Image generation (Zhipu AI)
VITE_IMAGE_GENERATION_BASE_URL=https://open.bigmodel.cn/api/paas/v4/
VITE_IMAGE_GENERATION_API_KEY=your_image_api_key_here
VITE_IMAGE_GENERATION_MODEL=cogview-3-flash

You can substitute these with any provider that follows the standard OpenAI specification.

Add a New Cuisine

  1. Update the cuisine configurations in src/config/cuisines.ts.
  2. Write a specific AI prompt that defines the unique character of the cuisine.
  3. Assign an icon and description for the user interface.

Extend the App

  1. Create a new page component in src/views/.
  2. Define a new route in src/router/.
  3. Add a link to the new page within the navigation component.

AI Service Integration

  • Text generation logic is handled in src/services/aiService.ts.
  • Image generation is managed via src/services/imageService.ts.
  • The architecture allows you to switch between different AI providers by adjusting these service files.