# Project 2 - Mood Tracker

➜ [See codepen demonstration](https://codepen.io/jyo2105/pen/QWKKKPw)


## :memo: Problem
2020 has been a very difficult year for everyone. Examples such as job loss, family loss, family pressures, both internal and external pressure has put enormous strain on the mind.

## :memo: Solution
I created a mood tracker app. A mood tracker app can help a person monitor their mood over time and how external factors, such as diet or lifestyle,which may affect how they feel. Mood tracker app can also make it easier for a person to track their progress in therapy or the effects of taking medication. Furthermore, understanding how and when mood shifts can help a person identify important patterns in their behavior.

## :memo: User Interface
The Mood Tracker app inclues three major components: the Monthly Calendar, User Activities, and Journal.

### Monthly Calendar

The Monthly Calendar locates on the left section under My Monthly Mood Tracker page title. It includes three parts:

- Month and Year on the first row indicates the current month and year.
- The five Mood Emoji on the middle row represent the following emotions respectively: Happy, In Love, Meh, Frown, and Angry.
- The bottom section displays all days in the current month.

### User Activities

The User Activities encompasses more than a dozen buttons, each represents an activity, for users to pick from to represent what they had been up to today.

### Journal

The Journal entries are located at the bottom of the Monthly Tracker. It provides a view of all user daily activities.

## :memo: User Experience

It's been a long day for Emma after working for 10 hours from home. Before she goes to bed, she logs in to her Monthly Mood Tracker account. Today, she feels very happy because she finished a top priority project for work, and it received excellent feedbacks from her supervisors. She drags the red happy emoji face then drops it in today's date on the monthly calendar.

Emma takes a sip of her hot cocoa, and starts to reflect what she had been up to today. Today, she did work, did yoga exercise, ate vegetable salad for lunch, watched a movie, and she is going to bed early. She clicks on Exercise, Work, Sleep Early, Eat Healthy and the Movie buttons in the What Have You Been Up To section, then clicks on the Add to Journal button. Instantly, her today's journal entry shows up in the Journal section at the bottom. Task completes, she is going to catch some z's.

## :memo: Reflection

It has been a wonderful semester for me. I have learnt a lot about front-end web development. My top three favorites of web development are bootstrap, DOM, and always think from the users' persepctives when designing an application. With programming background in Python, I was able to see the similarities and differences between Python and JavaScript, and pick up JavaScript fairly quickly and easily. Throughout doodles and projects, my computational thinking skills have been drastically improved.