Forkify is a modern web application that allows users to search for recipes, view detailed instructions, and save their favorite recipes for easy access. The app provides a seamless and interactive experience for cooking enthusiasts.
- Recipe Search: Users can search for a wide range of recipes by entering ingredients or dish names.
- Detailed Recipe View: Each recipe includes a list of ingredients, cooking instructions, and an image.
- Bookmarking: Save your favorite recipes for quick access later.
- Add Your Own Recipe: Users can add their own recipes to the app.
- Pagination: Navigate through results with ease using pagination.
- HTML: Structure of the web pages.
- CSS: Styling and layout.
- JavaScript (ES6): Dynamic content and interactivity.
- Webpack: Module bundler used to compile and optimize assets.
- API: Uses the Forkify API to fetch recipes.
- MVC Architecture: The application is built using the Model-View-Controller (MVC) design pattern.
- Search for a Recipe: Enter an ingredient or dish name in the search bar and press enter.
- View a Recipe: Click on a recipe from the search results to view its details, including ingredients and cooking instructions.
- Bookmark a Recipe: Click the bookmark icon to save your favorite recipes for easy access.
- Adjust Servings: Use the servings adjuster to automatically update ingredient quantities based on the number of servings.
- Add Your Own Recipe: Submit your own recipes using the "Add Recipe" feature.
If you want to run this project locally:
- Clone the repository.
- Install the necessary dependencies using
npm install. - Run the development server using
npm start. - Open
http://localhost:8080in your browser.
This project is the final project of the JavaScript course by Jonas Schmedtmann on Udemy. Special thanks to Jonas for his excellent teaching and guidance. The HTML and SASS files were provided as part of the course materials.
- User Authentication: Allow users to create accounts and save recipes across devices.
- Recipe Creation: Enable users to submit and share their own recipes.
- Enhanced Filtering: Add filters for dietary preferences, cuisine types, and more.
This project is open-source and available under the MIT License.