Nutrition Tracker, functional website developed by Mohammad Hamarsheh

Nutrition Tracker

app logo Live Demo

Nutrition Tracker is a responsive web app that tracks a user's food consumption and provides them with charts and stats on their nutrient and calorie intake. It uses ReactJS, TypeScript, SCSS, and other libraries for a rich user experience and communicates with the server via REST APIs. The server is built with NodeJS, Express, and MongoDB.


To use the app, the user must log in or sign up and provide information on their weight, height, age, activity level, and goal weight. This information is used to calculate the recommended daily nutrient intake to achieve their goal weight.

sign uplogin


Once logged in, the user can access the Foods page to view and update previously added foods or add new ones. Each food item includes nutritional information such as calories, proteins, carbohydrates, and fats.



The History page allows the user to enter the foods they consumed throughout the day, along with the quantities, and view the foods they ate on a specific date.



The Dashboard page displays the user's daily calorie and nutrient intake statistics, along with charts showing their weight and nutrient consumption changes over the past few days.