Skip to content

Microsoft Learn Student Ambassador Project. AI-powered recipe generator ranked in the Top 5, built with React.js and Azure to provide personalized meal suggestions based on ingredients, dietary needs, and user preferences.

License

Notifications You must be signed in to change notification settings

Nouran246/Personalized-Recipe-Recommender

Repository files navigation

Personalized Recipe Recommender

A web application that provides personalized recipe recommendations based on available ingredients, dietary preferences, and nutritional requirements.

Powerpoint Presentation

https://docs.google.com/presentation/d/1u2ZTVCi-GlrsA95lf-YgJGmpgjTnXTrr/edit?usp=sharing&ouid=107175027151394535275&rtpof=true&sd=true

Features

  • Ingredient-Based Recipe Generation: Input available ingredients to get customized recipes
  • Calorie Control: Set maximum calorie limits for recipe recommendations
  • Serving Size Adjustment: Easily adjust recipe portions for any number of servings
  • Interactive Chat Interface: Follow-up questions and recipe modifications through chat
  • Dietary Preferences: Add special requirements or preferences through notes
  • Real-time Ingredient Management: Add and remove ingredients with a user-friendly interface

Tech Stack

  • Frontend: React.js
  • UI Components: Custom Button and Chat components
  • Styling: CSS with responsive design
  • State Management: React Class Components with local state
Project.Name-VEED.mp4

Getting Started

Prerequisites

  • Node.js (v14 or higher)
  • npm or yarn package manager

Installation

  1. Clone the repository
git clone https://github.com/yourusername/Personalized-Recipe-Recommender.git
cd Personalized-Recipe-Recommender
  1. Install dependencies
cd client
npm install
  1. Start the development server
npm start

The application will be available at http://localhost:3000

Environment Setup

  1. Create a .env file in the client directory by copying .env.template:
cp client/.env.template client/.env
  1. Fill in your environment variables in the .env file:
REACT_APP_API_BASE_URL=https://func-api-4zrqw4pw37sga.azurewebsites.net/api
REACT_APP_API_CODE=your_function_code_here
  1. Never commit the .env file to version control

Usage

  1. Enter Ingredients

    • Type ingredients in the input field
    • Click "Add" or press Enter to add to the list
    • Click 'x' to remove ingredients
  2. Set Preferences

    • Use the slider to set maximum calories
    • Adjust number of servings using + and - buttons
    • Add any dietary restrictions or preferences in the notes
  3. Get Recommendations

    • Click "Get Recipes" to receive personalized recommendations
    • Use the chat interface for follow-up questions or modifications

Contributing

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details

Acknowledgments

  • Thanks to all contributors who have helped shape this project
  • Special thanks to the React community for excellent documentation and resources

project planning: https://github.com/users/Nouran246/projects/8

About

Microsoft Learn Student Ambassador Project. AI-powered recipe generator ranked in the Top 5, built with React.js and Azure to provide personalized meal suggestions based on ingredients, dietary needs, and user preferences.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •