/Mom-Secret-Recipe

A beautiful recipe search engine made with modern JavaScript features 😋🍴

Primary LanguageJavaScript


Logo

Mom Secret Recipe

A beautiful recipe search engine made with modern JavaScript features 😋🍴

View Demo · Report Bug · Request Feature

Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Features
  5. Roadmap
  6. Contributing
  7. License
  8. Contact
  9. Acknowledgements

Video Demo

Studio.Project.Kapwing.mp4

"Mom Secret Recipe" => is a vanilla JavaScript application that interacts with the Forkify API to fetch and display recipe food data. This app uses modern JavaScript tools, such as Parcel to bundle the modules, and Babel to convert ES6, ES7 and ES8 back to ES5. 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.

Built With

This app is built with pure vanilla JavaScript along with HTML and SCSS. It uses Parcel as module bundler and NPM as package manager.

Getting Started

To get started with project just simply fork this repo or download locally on your System.

To get a local copy up and running follow these simple example steps.

Prerequisites

Start with the latest version of NPM to avoid any errors:

  • npm 
    npm install npm

Installation

  1. Get a free API Key at Forkify API_KEY
  2. Clone the repo 
    git clone https://github.com/devmuzaky/Mom-Secret-Recipe.git
  3. Install NPM packages 
    npm install
  4. Enter your API in config.js 
    const KEY = 'ENTER YOUR API';

Usage

  1. The Forkify Recipe App allows users to search for recipes.

  2. Users can view the recipe along with the cook time and also increase or decrease the amount of servings they need.

  3. Bookmarked recipes are stored in local storage so no database was required for this application.

For more examples, please refer to the Documentation

Features

  • User can search over 1,000,000 recipes.
  • Powered by the Forkify API.
  • Displays the ingredients required to prepare a dish.
  • Allows user to choose serving size and accordingly adjusts ingredients.
  • Displays recipe images.
  • Directs user to source site for detailed recipe procedure.

Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

  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