Inspiration
For many people, their pets are beloved members of their family and it is a tragedy when they go missing. Over 35% of cats that go missing are never found and, while dogs fare better with only 7% never returning, a lost pet leaves a hole in the owners’ hearts.
Lost n Hound is a service that will reduce those numbers with the goal of returning every lost pet safely to their home.
What it does
Lost n Hound is a web app that allows pet owners to quickly and easily create a unique website for their pet that displays different information depending on if they are current missing. Owners can update that information at any time and choose what is visible to the public. Then, owners can order a collar tag with their pet's unique URL printed on it. If a stranger or shelter finds their pet, they can go to the website to see if the pet is lost and, if they are, contact the owners.
While microchips and traditional collars help increase the chances of being found, there are problems with each that Lost n Hound can improve upon. For example, there is no universal microchip and not all vets and shelters carry scanners that can detect every microchip. As another example, most people don't assume cats wandering around outside are lost, but with Lost n Hound, a stranger can quickly check to see if the cat is lost or simply exploring the neighborhood.
How I built it
Lost n Hound is a web app that uses React, Firebase, Javascript, HTML, CSS, and Bootstrap.
Challenges I ran into
Wow! There are a lot of steps to building a web app from scratch in one weekend! Setting up Firebase and learning how to authenticate users took much longer than expected. The most difficult part was routing to /pet/:id because I kept trying to get the document from Firestore that matched the id asynchronously, but I wasn't handling the promises properly. Eventually I found a React Hook (useDocumentData) that got me over that hurdle. The second most difficult part has been UI design since I've never worked with Bootstrap before.
Accomplishments that I'm proud of
I finished all the core features such as User Authentication, CRUD capabilities, and hosting which will allow me to build and iterate more advanced functionality in the future.
What I learned
I have worked on a group project that used React and Firebase in the past, but I wanted to dive in and create an app from scratch to learn the details behind state management, component architecture, and database management. I've started to learn some principles of UI design, but I focused on learning the ins and outs of React and Firebase for this project.
What's next for Lost n Hound
There are still some basic features I want to implement that I didn't have time for this weekend such as editing account emails and passwords, adding Firebase Cloud Functions to filter out bad words, adding additional fields to the pet documents (profile image, microchip type, medical information etc). I also have plans to change the UI and make it more intuitive. The next step after that is implementing security rules and testing those.
In terms of long term plans, I want to use this project to learn about design accessibility now that I've learned some web development basics. I think it's really important to design technology with accessibility at the forefront and I'm excited to start learning how to do that.
Log in or sign up for Devpost to join the conversation.