Inspiration
Our teams consists fully of commuters to UBC. During the commute to the first day of the hackathon, one of our members had to go to the washroom, and faced challenges of not being able to find a public washroom and also being denied washrooms because of them being closed.
What it does
It is a platform that shows a map of all washroom locations. If you click on the washroom location, you get redirected to a page that shows information about the washroom, such as its wheelchair accessibility, the times they are open and the area its located. Furthermore, if there is a washroom that is not located on the map, you can make your own review to a new washroom location that will be shown to other users. For each review you submit, you gain points and rise the leaderboard rankings
How we built it
Used Vite to create a project using typescript with a react compiler. Created different classes like SubmitButton.tsx, Sidebar.tsx, Reviewpage.tsx, etc., each handling one component on the UI, following separation of responsibilities. Used CSS classes for each component for a more aesthetic UI. The map integration was done with the help of Leaflet, adding it as a tilelayer. Dataset for public washrooms was imported as a json file.
Challenges we ran into
Difficulties with implementing a database that updates to all users globally rather than locally. Using alternate methods of showing the map when certain APIs were inaccessible.
Accomplishments that we're proud of
Using online APIs to get data for our database Creating interactive icons on the map that route you to specific review pages for each washroom Making it possible for multiple users to see one user's reviews and updates.
What we learned
- Deepened understanding of Typescript HTML, CSS, React, Vite
- Integration of map into ui and being able to interact with it
- Washrooms are an essential human right
What's next for Washroom Finder
- We will add rewards that users can purchase using contribution points. This not only benefits the user, but also greatly motivates the user to contribute, making reviews and make the world not have to worry about finding public washrooms anymore. Additionally, we want to make the dataset dynamic, utilizing firebase instead of a static json file for user/washroom data.
Log in or sign up for Devpost to join the conversation.