bacf5 / foodify-project

Foodify

Foodify Project

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.

Usage

• 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.

Built with

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.

• HTML
• SCSS
• JavaScript
• Webpack
• NPM

Installation

To get started fork this repo or download locally to your system.

Prerequisites

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';

Credits

Project idea from Coding Heroes - Master Javascript.

Contact

Twitter