Recipe Finder

ExpressJS HTML CSS

Tuesday, November 19, 2024

Introduction

Try the Demo Here: (Note, it may take some time to load, as onrender free tier deactivates the application when unused, and only rebuilds when opened)

https://recipefinder-qyue.onrender.com/

Recipe Finder finds recipes from food barcode and food item names. The tool is written in Node and ExpressJS as the front-end, and uses two APIs, Spoonacular and Open Food Facts API.

Features

Food Barcode Search
Search food items using barcode
Ingredient Recipe Search
Get recipe by ingredient name, you can get a recipe from a food in your fridge!
Recipe Viewing
View recipes by Cost Per Serving, Serving sizes and also Ready Time, choose for the best occasion.

Features

BACKEND - Spoonacular and Open Food Facts API
  • Spoonacular offers recipe search by name, and a database with recipes
  • Open Food Facts API offers barcode search
FRONTEND - ExpressJS and Vanilla CSS
  • Front-end rendering and components done in ExpressJS
  • RESTful routing
  • If user decides to search recipe by barcode, the website will request the food item from Open Food Facts API, then the name of the item will be passed to Spoonacular for recipe search
  • If user decides to search recipe by name, the website will request recipe using the name directly from Spoonacular.
DESIGN - Figma
  • Design of application and user flow done in Figma