Inspiration
As a friend group, health is important to us. Whether it be sending in our calories throughout the day on a shared group chat or planning times to hit the gym together, we bond over the many ways one stays healthy. It was a no-brainer then when we saw a prompt that would allow us to combine our technical expertise and passion for health into a project that would cater to both of these values.
What it does
Fithacks is a one-stop shop for all of your caloric needs and weightlifting desires as a busy student living a hectic life. The application will allow students to calculate calories, find focused workout plans, and read student testimonials.
How we built it
Once we decided on the full idea, what goals we wanted, and stretch goals we split up the project into two groups: front end and back end. We discussed the frameworks, languages, and preferences that all members had and split up accordingly. The frontend team utilized HTML, Vue, and CSS.
The frontend team utilized Vue JS as a framework to build our user interface. We used HTML and CSS to construct the website's various pages and style them to our liking. We created the website's mission statement and obtained blog posts and information for an involvement bar.
The backend team utilized Python and FastAPI to send all information back and forth. Utilizing the time during the hackathon and after hours helped us meet our goals in time and integrate both parts. The backend team first found an API that had all data on food nutrition. Once finding this information it was queried properly and parsed. In addition, the backend team parsed the information coming from the front end in order to send the inputs to the API for nutritional data. The backend team also took the needed data from the API to create a clear data visualization of the macronutrients of the foods. This data visualization was then encoded and sent to the front end which was then decoded. Lastly, the backend team sent information on different exercises for various muscle groups, videos on how to perform the exercise, and step-by-step directions.
Challenges we ran into
Some of the challenges we ran into were finding an API that met our needs when searching for a large-scale food database. Since we weren't too experienced with APIs, it was then quite difficult to parse through the user input from the front end and send that as a query to the database API. Another challenge we ran into was designating specific roles to individuals' strong suits to ensure effective collaboration and work quality. Every one of us was exposed to a framework or coding practice that was unfamiliar and had to capitalize on resources and communication to learn.
Accomplishments that we're proud of
When a group of friends puts their minds together to achieve a common goal, we became proud as soon as we began. Rather than becoming hyper-focused on an outcome, we really fell in love with the process. From celebrating our highs to being supportive of one another during the lows, we were present in the moment and with each other. No matter the outcome, we all couldn't be prouder of each other's abilities, talents, and hard work.
What we learned
Frontend Team Key Takeaways: We learned how to use Vue JS to build a website with an organized framework. Vue separates each component and allows for HTML, CSS, and JS to exist within a single file. We also learned many new HTML tags and how to create a multi-page website using router links.
Backend Team Key Takeaways: We Learned how to use the FastAPI and send information from the backend to the frontend. We also learned a lot about how to communicate with a database API and user input.
As a team, we wanted to include a wide variety of features, visualizations, and capabilities. Our ambition was large, but reality keeps us grounded. We had to filter through our ideas and categorize them as doable, reachable, or challenging. This helped us pick and choose what ideas to use given the time constraint available. Even so, when it came down to the final minutes, some ideas weren't as fleshed out as we wanted. We struggled between prioritizing and adhering to time vs completion which are both very important in the real world. It was emotionally taxing to submit our project knowing we could have done more but we realize the significance of adhering to due dates and time constraints as well.
What's next for FitHacks
Fithacks recognizes UIC's amazing culturally diverse student body. While tracking popular foods is quite easy, tracking the calories of ethnic cuisine is much more difficult. FitHacks aims to improve by finding ways to aggregate ethnic cuisine nutrition so tracking calories is, yet again, made simpler.
Log in or sign up for Devpost to join the conversation.