Pet Finder

• 

  Main page

• 

  Pet page

• 

  Light mode & trait search

Inspiration

Some people have never had a pet (like Lincoln), and it's hard to choose the right one. This web application allows you to do so quickly, intuitively, and painlessly.

What it does

Pet Finder allows you to search for pets that have traits similar to what you desire. You can then view information about those pets.

How we built it

We built the frontend entirely in Solid.js, and we preprocessed, reformatted, and joined various data sources into one file with Python.

Challenges we ran into

• Publishing the project to GitHub Pages with CI
• Vite not loading some modules
• Finding data sources and corroborating them
• Making the website responsive

Accomplishments that we're proud of

• Getting the website for everyone to see on GitHub Pages
• CI build logic
• The UI, design, and thought put into it
• Dark/Light mode toggle

What we learned

• How to use Python to corroborate data
• How to do a hackathon with only 2 people
• How to create different web app build logic based on whether it's in CI or not
• How to use Windi.css to create a dark and light mode
• How to use Windi.css to make a responsive website for smaller devices

What's next for Pet Finder

• Allowing users to find places to adopt their pets

Built With

• css3
• data
• html5
• json
• python
• solidjs
• static
• typescript
• vite
• windicss