Mood tracker to journal and keep track of your overall mood each day of the year.
Tech used: EJS, CSS, JavaScript, Node.js, Express, MongoDB Atlas
Inspired by GitHub's heatmap contribution graph, I built a mood tracker with 3 different colors to represent the entered overall positive, neutral, or negative mood.
- I used EJS, to dynamically create each square as many times as there are days for the current year, as well as each date on hover and the id for each element.
- I used JavaScript together with CSS to toggle classes to show and hide the pop up elements, such as the date on hover and the mood entry form.
- I used Node.js and Express together with MongoDB Atlas to allow the user to create, update, and delete entries for each day.
Select either today's date or a date in the past.
Log your mood and, optionally, add notes about your day.
You can also delete entries as long as they exist!
- Add user authentication
- Add settings to allow customizations
- Add option to delete notes
Building with EJS and JS, I was often making decisions about whether I should create elements or text dynamically or if I should, or even could, manipulate the DOM using JS instead.