Skip to content

README.md

Latest commit

 

History

History
199 lines (152 loc) · 6.21 KB

README.md

File metadata and controls

199 lines (152 loc) · 6.21 KB

🍃 Food52 - Your Ultimate Recipe Companion

Food52 Logo

A modern recipe website offering healthy and vegetarian recipes for diverse dietary preferences

GitHub React

🌟 Overview

Food52 is a comprehensive recipe website designed to make healthy cooking accessible to everyone. Whether you're vegan, gluten-free, or have specific dietary restrictions, Food52 offers a curated collection of delicious recipes tailored to your needs.

✨ Key Features

  • 🔍 Smart Search & Filters - Find recipes by ingredients, cooking time, and dietary restrictions
  • 🥗 Diverse Recipe Collection - Healthy, vegetarian, vegan, and gluten-free options
  • 📱 Responsive Design - Perfect experience on all devices
  • ❤️ Save Favorites - Like and save recipes to your personal collection
  • 👥 Community Hub - Connect with fellow food enthusiasts
  • 📝 Recipe Sharing - Share your own culinary creations
  • 🏆 Cooking Challenges - Participate in fun community cooking contests
  • 📊 Nutritional Information - Detailed nutrition facts for every recipe

🛠️ Tech Stack

Frontend

  • React.js - Modern UI library for building interactive components
  • CSS3/SCSS - Styling and responsive design
  • JavaScript (ES6+) - Core programming language

APIs & Data

  • Recipe API Integration - External recipe data sources
  • RESTful APIs - For data fetching and management

Tools & Deployment

  • Git & GitHub - Version control
  • npm - Package management
  • Vercel/Netlify - Deployment platform

🚀 Quick Start

Prerequisites

  • Node.js (v14 or higher)
  • npm or yarn
  • Git

Installation

  1. Clone the repository

    git clone https://github.com/AdiSinghCodes/Food52.git
cd Food52

  2. Install dependencies

    npm install
# or
yarn install

  3. Set up environment variables

    # Create .env file in root directory
REACT_APP_API_KEY=your_recipe_api_key
REACT_APP_BASE_URL=your_api_base_url

  4. Start the development server

    npm start
# or
yarn start

  5. Open your browser Navigate to http://localhost:3000

📱 Features Breakdown

🔍 Advanced Search System

  • Ingredient-based search - Find recipes with specific ingredients
  • Time filters - Sort by preparation and cooking time
  • Dietary filters - Vegan, vegetarian, gluten-free, keto, and more
  • Difficulty levels - From beginner to expert recipes

👤 User Experience

  • Personalized Dashboard - Track your favorite recipes and cooking history
  • Recipe Collections - Create custom recipe folders
  • Cooking Timer Integration - Built-in timers for perfect cooking
  • Step-by-step Instructions - Clear, easy-to-follow recipe guides

🌐 Community Features

  • Recipe Sharing - Upload and share your own recipes
  • User Reviews & Ratings - Rate and review recipes
  • Cooking Challenges - Weekly/monthly cooking competitions
  • Discussion Forums - Connect with other cooking enthusiasts

🎯 Project Structure

Food52/
├── public/
│   ├── index.html
│   └── favicon.ico
├── src/
│   ├── components/
│   │   ├── Header/
│   │   ├── RecipeCard/
│   │   ├── SearchBar/
│   │   └── Footer/
│   ├── pages/
│   │   ├── Home/
│   │   ├── Recipes/
│   │   ├── Community/
│   │   └── Profile/
│   ├── services/
│   │   └── api.js
│   ├── styles/
│   ├── utils/
│   └── App.js
├── package.json
└── README.md

🌟 What Makes Food52 Special?

  • Health-Focused - Prioritizes nutritious and wholesome recipes
  • Inclusive - Caters to various dietary needs and restrictions
  • Community-Driven - Built for food lovers, by food lovers
  • Modern Interface - Clean, intuitive design for the best user experience
  • Mobile-First - Optimized for cooking on-the-go

🤝 Contributing

We welcome contributions from the community! Here's how you can help:

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

📋 Contribution Guidelines

  • Follow React best practices
  • Write clean, commented code
  • Test your features thoroughly
  • Update documentation as needed

🐛 Bug Reports & Feature Requests

Found a bug or have a feature idea? Please open an issue on GitHub:

  • Bug Report: Describe the issue with steps to reproduce
  • Feature Request: Explain the feature and its benefits
  • Enhancement: Suggest improvements to existing features

📈 Future Enhancements

  • AI Recipe Recommendations - Personalized recipe suggestions
  • Meal Planning - Weekly meal planning features
  • Shopping List Generator - Auto-generate shopping lists from recipes
  • Video Tutorials - Step-by-step cooking videos
  • Nutrition Tracker - Track daily nutrition goals
  • Recipe Import - Import recipes from other websites

👨‍💻 About the Developer

AdiSinghCodes - Full Stack Developer & ML Enthusiast

  • 🏆 Smart India Hackathon 2024 Grand Finalist
  • 💼 Toyota Hackathon 2025 Mentor
  • 🌟 Passionate about creating user-centric applications

GitHub LinkedIn

Made with ❤️ and lots of ☕ by AdiSinghCodes

Star ⭐ this repository if you found it helpful!