Foodify is a JavaScript web application that interacts with the Forkify API to fetch and display recipe food data. This app uses modern JavaScript tools, such as Webpack to bundle the modules. The user can search for a specific recipe, and save to a favorites list via local storage. The user can easily increase or decrease servings as per his need and can view detailed directions.
- The Foodify App allows users to search for recipes.
- Users can view the recipe along with the cook time and also increase or decrease the amount of servings they need.
- Bookmarked recipes are stored in local storage so no database was required for this application.
This webapp is built with Vanilla JavaScript along with HTML and SCSS. It uses webpack as module bundler and NPM as package manager. This web application uses MVC architecture design pattern.
To get started fork this repo or download locally to your system.
Start with the latest version of NPM to avoid any errors:
- npm
npm install npm@latest -g
- Installation
Get a free API Key at Forkify API_KEY
- Clone the repo
git clone https://github.com/bacf5/foodify-project.git
- Install NPM packages
npm install
- Enter your API in config.js
const KEY = 'ENTER YOUR API';
Project idea from Coding Heroes - Master Javascript.