Price Plate

Price Plate is an everyday budgeting tool that allows financially aware shoppers and consumers to track the prices of the ingredients they purchase and the meals they make with them. Given the price paid for the total ingredients and the recipes you create, Price Plate can find out the exact prices for different recipes and allow the user to track their expenses. Gone are the days of manually using spreadsheets, and in are the days of automation with Price Plate.

UI Prototype

https://www.figma.com/design/8aUUnvouOA5CHVf2S0JHta/PricePlate?node-id=52-256&t=GMElLEiKnFXdw5R3-1

Development Environment Set Up

Make sure Node.js is installed, which can be installed here: https://nodejs.org/en/

To check if it is installed, run:

npm -v

In the root directory, run

npm i

To set up the environment

Now run the development server:

npm run dev

Open http://localhost:3000 with your browser to see the result.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Testing:

We test using cypress. To Install, run:

npx install cypress

Then, to open the testing, run:

npx cypress open

Deploy on Vercel

Our project is deployed on vercel here:

https://price-plate.vercel.app/

UML

UML