Recipe Generator with Gemini AI

A simple React application that generates a recipe based on ingredients you have on hand, powered by Google's Gemini AI.

recipe-generator-gemini.webm

🌟 Overview

As a React learner, I built this project to practice React basics. The app allows users to:

• Input ingredients they have available
• Build a list of ingredients
• Generate a recipe using Gemini AI

🚀 Technologies Used

• React
• Vite
• Google Gemini AI API
• React Markdown

🛠️ Setup

1. Clone the repository:

git clone https://github.com/yourusername/recipe-generator-gemini.git
cd recipe-generator-gemini

2. Install dependencies:

npm install

3. Create a .env file in the root directory and add your Gemini API key:

VITE_GEMINI_API_KEY=your_api_key_here

4. Start the development server:

npm run dev

📝 Learning Points

Through this project, I learned about:

• React components and props
• State management with useState
• Handling forms in React
• Async operations with API calls
• Working with external libraries
• Environment variables in Vite

🤝 Contributing

As a learning project, I welcome any suggestions or improvements!

Created by Ethan Li