Avocardio is a 
Users are able to search exercises by type (body part, muscle group, and equipment).
Search results are return in GIF format, that the user can easily follow along.
Below is our initial mockup of the project:
We used this to guide our decisions on page structure, component architecture, and initial MVP.
When the user opens the page they are presented with the following elements:
- Navbar, which contains the Avocardio logo.
- Search Bar, which allows the user to search for exercises by body part.
- Once a search is triggered, result count is limited to 3, which are displayed in card form, in a gallery configuration.
- Footer, which contains links to the Team's individual GitHub pages.
Since we achieved our initial MVP fairly quickly, we decided to introduce some additional functionality:
- Navbar, which now contains a link to our "About" page.
- Search Bar now allows users to search by body type, muscle group, and equipment, and search bar displays a category separator. Users can either scroll through the list of categories, or they can type and see result suggestions that match.
- User is now able to click on each of the search results and trigger a modal that displays exercise details.
Should you wish to run the project locally, follow these steps to clone the repository.
Once the repository is on your local machine, navigate to its location and run npm i to install the project dependencies.
Finally, run npm start to run the project in development mode and you should be able to now see it on your browser.
Deployed version of this project can be seen here.
Project presentation can be seen here.
