In the 21st century, as more diverse food for taste not health are promoted, the world has faced more health issues such as stress, high-blood pressure, and obesity from bad eating habits, leading to higher risks of heart diseases and cancer. To solve this public health issue, Harvard Medical School mentioned that reducing calories consumption is proven to be a safe and effective way to prevent weight gain and diabetes.

How we built it

To raise the public awareness of the importance of calories, we decided to create a website where the users are able to easily calculate the calories based on the categories of the food - proteins, vegetables, fruits, grains, and dairy - and view the total calories based on the serving size for each food item. Our main focus for this project was to create a project that can enhance our basic knowledge of javascript and html while having a chance to explore and experience our first hackathon event together as a team. We had trouble coming up with an idea that we can finish within a day’s time and was achievable for high school students that just started learning javascript last year. Nevertheless, we began with a project draft design on paper and transferred to a more finalized outline through figma. Next, we split the task between the 4 members. We were fascinated by how the GIT API allows us to easily transfer and edit code through the PUSH and PULL requests. Through this new skill, each of us worked on various parts of the code and tested the output as we progressed throughout the day.

Challenges we ran into

As high school students who have only utilized to “program”, starting from a brand new idea to programming the desired outcome presented us with enough challenges to last us through the night. We had to figure out how to style javascript elements and components created to fit within the container created. We also ran into some problems with the serving Size display, as we were having trouble determining which paragraph element to change based on the button clicked. Finally, many of us who worked on the project were not experts on javascript, and with the code being mainly javascript, each of us had to put in extra time to learn new methods that we needed.

Built With

Share this project: