Brain Food is a fullstack responsive web application that allows users to signup for an account, login, enter a mood level for the day on a sadness to happiness scale from 1-5, and enter time allotted to cook. Users can choose a color theme for the application dependent how they want to feel. When a mood level and time to cook input is entered, recipes will then populate based on nutritional value meant to either boost or maintain mood levels. Users have the option to favorite recipes and view details, such as cook time, nutritional content, ingredients needed to make the meal, and instructions on how to do so. A personal dashboard is available to view favorited recipes, delete recipes, view recipe details, search for recipes by name, view average mood level, and personally rate recipes on a star rating system. Brain Food was created using React Vite + TypeScript and tested with Cypress. Accessibility was assessed via Chrome DevTools Lighthouse and Chrome WAVE extension. Happy cooking!
Erin Kelley Jack Sweeney Faisal Nazari Igor Magalhaes Laura Long
-
Clone this repository to your local machine:
git clone git@github.com:Moody-Foodies/moody-foodies-fe.git
-
Navigate to the project directory:
cd moody-foodies-fe -
Install the necessary dependencies:
npm install
-
Start the application:
npm run dev
-
Open the app at http://127.0.0.1:5173/ in your browser.
-
Goals
- Build a fullstack application over a four-week period.
- Successfully implement a stretch technology into the application.
- Collaborate on a team utilizing the SCRUM/Agile methodology, holding daily standups, sprints, frequent communication, and check-ins with our project manager.
- Utilize CI/CD to ensure seamless integration, streamline workflow, and maintain clean, quality code.
-
Wins
- Setting up CircleCI with Netlifly for continuous integration/continous deployment.
- Learning and utilizing TypeScript throughout the codebase.
- Working with backend developers to build a fullstack application!
- Making the application responsive across all major breakpoints.
- Developing a highly accessible application, verified with Chrome DevTools Lighthouse and Chrome WAVE extension.
-
Challenges
- Setting up the config.yml file for CI/CD implementation and troubleshooting pipeline errors.
- Navigating user error handling and proper user feedback with missing pieces of data, to ensure a strong and positive user experience.
- Create a save password feature for the login form and allow users to login in with Google or Facebook.
- Document the date and save user mood level for the day to more extensively be able to track mood level over time and view trends.
- Implement more recipes and allow users to choose recipes based on breakfast, lunch, or dinner suggestions.
- Allow users to add notes to recipes as they are made or chosen.