Athena Fitness

Inspiration

Browsing through websites promising fitness classes only to find out that they are paid to watch? Or manually searching the names of your target exercise on Youtube every time you start a workout session? Yes, been there too.

What it does

Athena Fitness is a completely free (& ad free too) web app that allows you to browse your favourite workouts based on target muscles with steps and direct links to Youtube.

How we built it

The web app was created using ReactJS and then added a visually appealing User Interface using Material UI. Fetched exercise data using RapidAPI from ExerciseDB and Youtube Search and Download. Adopted dynamic routing using React Router DOM. Hosted the application on Netlify.

Challenges we ran into

Had learnt how to create static routes before, so this was the first time I implemented dynamic routing. Ran into multiple errors including errors with React versions. I also exhausted my RapidAPI usage so it showed Error 429 a lot of times in the console. I didnot check the error code and instead kept looking so errors in my actual code. At last my eyes caught the error code and I figured I had exhausted my account limit. Hence used another account for using it.

Accomplishments that we're proud of

Coming up with the idea and finally implementing and deploying an entire webapp in less than a day as a single-member team. This was also my first time participating in MLH Hackathon so being able to execute the entire idea, I am pretty satisfied with how far I've come.

What we learned

Time management, before everything else. Secondly, dynamic routing and handling unknown challenges in such a short time. I also learnt a lot of styles from Material UI.

What's next for Athena Fitness

I would like to make it accesible in all modes (phone, tablet, computer). Maybe an Android application would be more suitable for this use. It will always be completely free of cost. I would also like to keep it ad-free if possible.

Built With

• api
• dom
• javascript
• material-ui
• netlify
• rapidapi
• react
• router