Lehigh Valley Hackathon - Full Stack Snacks

Team Members and What we Learned - Full Stack Snacks

  • Angela Cui - I learned how to use AWS Bedrock and S3 buckets and implementing that into React
  • Ester Frank - I learned how to use React and I gained some familiarity with using git
  • Ahmed Lawal - I learned how to use React to make dynamic user friendly designs and buttons
  • Sophia Chen - I learned how to use React and its associated libraries (+ Node,js) to implement dynamic web elements

What it does

Project Overview

This web app consists of 4 main components: ChatBot, Mood Tracker, Quick Tips, and Resources to assist Lehigh Students with their mental health on campus.

Project Link

Demo

Inspiration

  • Lehigh University being ranked 2nd in most hours spent studying.

Selected Track

  • [ ] Academic Career Success
  • [ ] Course Planning
  • [X] Health and Wellness
  • [ ] Campus and Community Resources
  • [ ] Financial and Resource Management
  • [ ] Diversity, Social, and Extracurricular Engagement

Accomplishments that we're proud of

What Special Features did we include?

  • [X] AI
  • [X] AWS
  • [X] Stunning Visuals
  • [X] Mobile Compatible

How we built it

Tech Stack

  1. Version Control - Git
  2. Web - React - Javascript, HTML, CSS
  3. AWS - S3 Buckets, Lambda - Python, API Gateway, Bedrock
  4. AI - Bedrock - Claude Sonnet 3
  5. Testing - Postman
  6. Deployment - Vercel

Challenges we faced

  • Github merged conflicts between branches - resolved by teaching all members how to use Github properly
  • AWS Lambda handler issue Internal Server error 500 or Bad Gateway error 502 - needed to use proper request and response JSON formatting or wrong arn modelId
  • Merging Component files together - resolved through carefully code reviewing and looking through console
  • Designing using CSS - learned how to use CSS Grids for more responsive website.

Project Details by component

Component Name Description
Chat Bot Chat uses Bedrock and Lehigh Wellness related Knowledge Bases (from custom PDF) in S3 Buckets to curate ideal responses for students that need a quick mental chat with AI. The bot calls an API call that calls a Lambda function/handler that is written in Python.
Mood Tracker The Mood Tracker allows users to log their daily emotions and mental state. It helps students identify emotional patterns and trends over time by visually tracking their mood in a user-friendly interface. The data is visualized in an interactive pie chart rendered using the Recharts library. JavaScript handles the mood logging and state management, while responsive styling is provided by CSS.
Quick Tips & Resources The Quick Tips feature provides immediate advice to students. This advice is aimed at relieving stress, improving focus, and managing anxiety through short, actionable tips. The Resources section offers students a curated collection of mental health tools, information, and contact points at Lehigh University. It gives students easy access to mental health services on campus.
Calendar The Calendar allows provides users a convenient way to navigate between different time periods and reflect on their mental health journey. It leverages React and the React-Calendar library to provide an intuitive date-picking interface. JavaScript handles the logic behind date selection.

What's next for Mindful Hawks

  • Since our chatBot is highly reliant on AWS Bedrock it's difficult to keep going on that aspect.
  • Since our calendar doesn't have high functionality yet, we would like to redesign the calendar in a way that when you click on the chosen date, you are able to track your mood for that specific day. Further more, for different months, the calendars can have different themes based on the month or season.

Appendix

  1. Figma
  2. Brainstorming Doc

References

  1. Colleges Where Students Study the Most
  2. Run example Amazon Bedrock API requests through the AWS SDK for Python (Boto3)
  3. Invoke a Lambda Function
  4. AWS Workshop for Bedrock
  5. Anthropic Claude Messages API
  6. Error when Bedrock invoke Lambda
  7. CSE Undergraduate Resources Page
  8. bytesandbalance/Mood-Tracker

Built With

Share this project:

Updates