Skip to content

Mood-Boost/mood_boost_fe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 

Repository files navigation

MOOD BOOST (Front End)

Mood Boost offers simple breathing exercises, inspiring quotes, and a touch of humor to brighten your day and put a smile on your face. You can use the application as a guest or login to have it track your activity usage.

Previews

Home Page

Home Page

Navigate to Random Page

Navigate to Random Page

Inspirational Quotes

Inspirational Quotes

Jokes

Jokes

Deployed Site

Mood Boost

Purpose

The Mood Boost App is designed to enhance users' emotional well-being through engaging and interactive features and was built using a Service-Oriented Architecture (SOA) with a Rails API backend and React frontend.

Goals

  • Deliver a Functional Solution: Address a real-world problem with practical and user-friendly features.
  • Emphasize Team Collaboration: Foster teamwork, project management, and decision-making skills in a multi-app system.
  • Enhance Professional Readiness: Provide hands-on experience with SOA, external APIs, and deployment, preparing developers for industry challenges.
  • Prioritize User Empathy: Create an inclusive, user-centered design by developing detailed user stories and conducting equity analyses.

Getting Started

Clone down the resposity to your local machine, cd into the direcotry and run:

  • npm install

To see the front end application functioning from the command line run:

  • npm start

This will allow you to use the spinner and the menu bar to navigate through all of the pages and see the application functioning. To utilize the user login portion you will also need to clone down the backend server and have it up and running as well.

Technology Used

  • React v19.0
  • React Router v7.1

Prerequisites

To use the user login functionality you will be required to have the Mood Boost Backend Repo installed and running.

Test Suite

End to End testing was done with Cypress. To run the test suite you will need to install Cypress with:

  • npm i -D cypress

Then update your package.json file by adding: "cypress": "cypress open" to your "scripts" section.

To run Cypress from the command line type:

  • npm run cypress

Contributors

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published