Recipe Ingredient Calculator

Through the web and digital media design program at Milwaukee Area Technical College, I had the opportunity to learn not only HTML and CSS but also JavaScript and its library jQuery. For my JavaScript class final project, I created the Recipe Ingredient Calculator, a hand-coded website with five pages plus two subpages. This site lets users easily double recipe ingredient amounts or cut them in half. It provides recipe tips and allows users to save recipes and ask recipe measuring-related questions.

The JavaScript/jQuery

I coded a lot of JavaScript/jQuery for the Recipe Ingredient Calculator. On the Recipe Tips page, a jQuery slider plugin shows which measuring utensil works best based on the ingredient. Both the Calculator and Account pages have a jQuery popup plugin that adds a secondary form to the page, for example, to reset a password. Every input field utilizes JavaScript to validate the content entered by the user. Recipes are saved on the Calculator page through web storage and then displayed on the signed-in Account page. That is only one view of the signed-in Account page.