Inspiration
There are so many social groups like sports teams or co-workers who make group fitness goals and work toward them as a team while holding each other accountable. We wanted to make a social media app that can be used to track your own fitness and be able to share this progress with your peers.
What it does
When you get into the app you are presented with a login screen and then a create a server page. Once you name your first server and have an image for your server you are taken to the main Ludos screen. This screen contains everything you need for this app including: the servers you are in, a link the the fitness tracking page, light/dark mode, your profile manager (using the clerk api), the text and audio channels for your selected server, the settings for your selected server, the chatroom ui for your selected channel in your selected server, and the send fitness progress button. These components come together to allow users to chat and call their peers to keep each other on track with their fitness goals. What sets this apart from other social media apps is the ability to track your weight and calories for your profile and then be able to send a summary of this progress to any channel you choose. The screens on the fitness tracking app are as follows: Dashboard (add weight and calories to your profile), Progress Tracker (graphs of your weight and calories over time), Weight Table (table of all your weight data), and Calorie Table (table of all your calorie data).
How we built it
This project is built with ReactJS. It uses Prisma with MySQL for the backend, Clerk for handling the login, Tailwind for the CSS, Livekit for the video/audio calls. We developed the frontend and then the backend of the chatrooms/servers to create a simple social media app. We then created the fitness tracker app separately and combined them later.
Challenges we ran into
We had some difficulty working with the backend. Especially when linking the fitness app to the social media app. We were able to get the POST and GET api functionality working with the fitness data, but there was an edit feature that we didn't want to get rid of and we couldn't figure out the PUT api functionality by the deadline. We also had trouble deploying the project onto Vercel for the demo site. Originally we tried using Netlify, but there were errors we couldn't seem to get past. Most of the errors came from all the dependencies we were using, but we found Vercel handled these errors better than Netlify. Also, something to note is that sometimes when you login for the first time, you need to refresh to fix the formatting of the main screen.
Accomplishments that we're proud of
We are proud to say we were able to link the social media app with the fitness app without making either look out of place. We used previously made generic components to maintain a common theme between all the screens. It is also important to note that this app would definitely be useful for every member of my group. We all do some sort of regular exercise, and this app would be valuable for keeping each other and any groups we may join accountable on their fitness journey.
What we learned
We learned a lot. We all came in with different experience levels with data, React, APIs, etc. and this was a great learning experience for all of those things. Not every group member worked with every aspect of the project, but it was very good to get exposed to so many valuable programming concepts and see how they work.
What's next for Ludos
The first step continuing on with this project would definitely be to completely integrate the fitness app with the backend. This would likely mean creating a functional edit feature using a PUT API call for the fitness data. The fitness app could also use some expanding. As of now it only tracks weight and calories over time, but in the future we could add more things to track and make them more specific. For example, we could use a database of different foods and meals a user could search through and select, and the fitness app would automatically take those macros and add it to your fitness profile.
Log in or sign up for Devpost to join the conversation.