Welcome to the FoodRecipe application! This project is an interactive and user-friendly web application designed to help culinary enthusiasts discover and bookmark their favorite recipes. Built with React and styled using Tailwind CSS, the application fetches data from the Forkify API to display a diverse range of recipes, complete with images and detailed preparation instructions.
- Recipe Search: Users can search for any recipe using the search bar. The application fetches and displays relevant recipes from the Forkify API.
- Recipe Display: Each recipe is presented with an appetizing image, ingredient list, and step-by-step preparation instructions.
- Favorites: Users can bookmark their favorite recipes for quick access later. The Favorites section stores these recipes for easy retrieval.
- Interactive Design: The application is designed to be visually appealing and easy to navigate, providing a seamless user experience.
- React: A JavaScript library for building user interfaces.
- Tailwind CSS: A utility-first CSS framework for styling the application.
- Forkify API: An external API providing recipe data (https://forkify-api.herokuapp.com).
- GitHub Pages: For deploying the application.
To get started with the FoodRecipe application, follow these steps:
-
Clone the Repository:
git clone https://github.com/yourusername/foodrecipe.git cd foodrecipe
-
Install Dependencies:
npm install
-
Start the Application:
npm start
The application will run on
http://localhost:3000
.
-
Search for Recipes:
- Use the search bar to find recipes by name or ingredient.
- Click on a recipe to view its details, including the ingredient list and preparation steps.
-
Bookmark Favorites:
- Click the "Favorite" button on any recipe to bookmark it.
- Access your bookmarked recipes from the Favorites section.
-
Explore Recipes:
- Browse through various recipes and discover new culinary ideas.
We welcome contributions to enhance the functionality and design of the FoodRecipe application. To contribute, please follow these steps:
- Fork the Repository: Click the "Fork" button on the top right corner of this repository.
- Create a Branch: Create a new branch for your feature or bug fix.
git checkout -b feature-name
- Commit Your Changes: Make your changes and commit them with a descriptive message.
git commit -m "Add new feature"
- Push to the Branch:
git push origin feature-name
- Create a Pull Request: Open a pull request from your branch to the main repository.
This project is licensed under the MIT License. See the LICENSE file for more details.
For any questions or suggestions, feel free to reach out:
- Author: Hadi Abbas
- GitHub: HadiAbbas
Thank you for visiting the FoodRecipe project. Happy cooking!
This README provides a comprehensive overview of the FoodRecipe application, including its features, technologies, installation instructions, and contribution guidelines. The screenshot reference should be updated with the correct path to the image in the repository.