CS 330 Midterm Project -ReciPIE

Overview

This is a recipe search webpage that takes user input and display corresponding related recipes. This project was bootstrapped with Parcel Bundler.

Available Scripts to run the project

In the project directory, to install required packages, you can run:

npm install

Then, to start the application, you can run:

npm start

Features

1. Take user input, render list of recipes related to input keyword. E.g. apple, pizza, pear and so on.
2. Upon click "MORE FACTS", definition of the first word of the title of recipe displayed on the website will be shown.
3. User could bookmark and unbookmark recipe.
4. Clicking + or - button, the recipe ingredients would be updated with the change in the number of servings.

Technologies and Tools

• ParcelJS
• HTML, SCSS/SASS
• Bootstrap
• VanillaJS

API Used

1. Forkify API
2. Free Dictionary API
3. Numbers API

Contributors

• Hudson Nguyen - A CS Sophomore @Luther College
• Millie Wang - A CS Sophomore @Luther College

Acknowledgements

The basic design of this webpage was based on Jonas Schmedtmann.

Demo