This project is the Final Capstone from the Microverse Technical Curriculum. Its purpose was to create a real-world-like project, built with business specifications, based on a tracking mobile application.
The front-end was built with React, using Redux to manage the internal state. For the back-end I used Ruby on Rails, its repository can be found here.
The project's original instructions can be found here.
OhMyMood! is a mobile application to track moods and emotions. According to studies, understanding your moods is helpful to manage them and feel better fast. If a person is more aware of their mood, they may better manage their lifestyles choices, make more informed decisions, prevent or avoid triggers of negative moods, resulting in a better quality of life.
To use OhMyMood!, we require the user to sign up or log in. Every day, they can evaluate their mood with 5 different levels, represented by emojis. Also, they will have three questions to answer to better evaluate their emotions: “What went well today?”, “What went badly?”, and “What did you learn?”. On the progress page, the user can check and compare the mood evaluations from the past.
The home page has two states: if the user hasn't evaluate their mood that they, it will display a button for the evaluation form (first image). Otherwise, it will show the mood evaluation for that day (second image).
To evaluate their mood, the user selects the emoji that represents their current mood: Very happy, happy, normal, sad, and very sad. Also, they should answer the three questions, which will provide a better understanding of emotions and triggers.
In the evaluations list, all the user can see all recorded moods. This way, they can compare them and see the mood progress. By clicking in one of the recorded moods, it will show a list of the remaining answers for that day.
- Design for larger screens.
- Possibility to edit current day mood.
- Statistics page, which will show more details about mood progression.
- More features to the menu page: edit user information, profile image.
- HTML5;
- CSS3;
- JavaScript;
- React;
- Redux;
- Webpack;
- Heroku.
To install a local version of this app, download or clone the project here, then navigate to the project's directory from the terminal and run the following commands:
npm inpm start
👩 Bruna Genz
- Github: @bruna-genz
- Twitter: @Bruna_GK
- Linkedin: Bruna Genz
- Email: brunagenz92@gmail.com
- Gregoire Vella on Behance for the design idea.
- Alejandro Sabogal for the amazing tutorial about React and Rails user authentication.
- Microverse team, for being the guide on this exciting and exhaustive journey.