TelmaFood 🍳

A dynamic recipe discovery platform that helps users explore, search, and save their favorite recipes. Built with JavaScript, HTML, and CSS, TelmaFood offers an intuitive interface with advanced filtering options and a responsive design.

✨ Features

• 🔍 Smart Recipe Search with multiple filtering options
• 🏷️ Health Preference Tags for dietary restrictions
• 💾 Recipe Saving functionality
• 🌙 Dark/Light Theme support
• 📱 Responsive Design for all devices
• ⚡ Lazy Loading for optimal performance
• 🦴 Skeleton Screens for better loading experience
• 🎯 Accessibility focused development

🚀 Tech Stack

• Vanilla JavaScript - Core functionality
• HTML5 - Structure and semantics
• CSS3 - Styling and animations
• Edamam API - Recipe data
• Local Storage - Save recipe functionality
• Material Icons - UI icons

🎯 Performance Metrics

• Performance: 96/100
• Accessibility: 95/100
• Best Practices: 100/100
• SEO: 100/100

🛠️ Installation

1. Clone the repository:

   git clone https://github.com/mohammadhossein-asadi/telmafood.git

2. Navigate to project directory:

   cd telmafood

3. Open with live server or directly in browser:

   # Using live-server (if installed)
   live-server

🎮 Key Features

Recipe Search

• Advanced filtering options for cooking time, ingredients, and calories
• Real-time search results
• Multiple cuisine type filters

Health Preferences

• 30+ dietary filters including:
  • Vegetarian/Vegan options
  • Gluten-free recipes
  • Allergen-free choices
  • Diet-specific recipes

Recipe Management

• Save favorite recipes
• Quick access to saved recipes
• Detailed recipe information

🌟 Components

Search Component

• Real-time search functionality
• Search suggestions
• Error handling

Filter System

• Multiple filter categories
• Combination filtering
• Clear filter option

Recipe Cards

• Loading skeletons
• Save functionality
• Cooking time display

🌐 Live Demo

Experience TelmaFood live: TelmaFood App

📱 Responsive Design

• Mobile-first approach
• Tablet optimized layout
• Desktop enhanced experience
• Cross-browser compatibility

🤝 Contributing

Contributions are welcome! Feel free to:

1. Fork the project
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

• Recipe data provided by Edamam API
• Icons from Material Design Icons
• Special thanks to the open-source community

---

Created with ❤️ by Mohammadhossein Asadi