MoodBites
Inspiration
We were inspired by the connection between food and mood. Many people eat based on how they feel—stress, sadness, happiness, or boredom often influence food choices. MoodBites was created to make users more aware of this link and help them choose healthier or more mindful food options based on their emotional state.
What it does
MoodBites allows users to log their current mood and suggests food or drink recommendations that match or improve that mood. It also tracks mood-food patterns over time, helping users make more informed choices about emotional eating and overall wellness.
How we built it
The frontend was developed using React.js and styled with Tailwind CSS for responsiveness. Mood selection, food suggestions, and mood history are handled through component-based UI logic. Vite was used for fast build and development. The application is deployed using Vercel.
Challenges we ran into
We faced issues aligning moods with the right food recommendations in a meaningful way. Managing local storage or backend sync for mood history was tricky at times. We also spent effort on ensuring the interface remained intuitive across devices.
Accomplishments that we're proud of
We created a responsive, functional app that uniquely combines mood tracking with food suggestions. The design is friendly and accessible, and the user experience is smooth and purposeful. We were able to deploy the app successfully and test it across different use cases.
What we learned
We gained insights into the psychology of emotional eating, improved our React component structuring, and learned to build clean, state-based logic for dynamic suggestions. We also became more comfortable with deployment and debugging tools.
What's next for MoodBites
We plan to integrate a full food database, connect it with APIs for nutritional info, add journaling for users to reflect on food choices, and provide mood-based wellness content. A mobile version and social sharing features are also in the roadmap.
Built With
- css
- html
- javascript
- node.js
- react
- tailwindcss
- typescript
Log in or sign up for Devpost to join the conversation.