Imagine a world where no lost cat goes unnoticed. This is what Catspotter wants to achieve.

Catspotter is an impressive fullstack community web application designed to facilitate the swift return of lost cats to their owners by leveraging the collective power of neighborhoods and communities. Built as the final project for the WBS Coding School web & app developer bootcamp, Catspotter empowers users to report cat sightings, register lost cats, receive match notifications, and visualize all the different data on an interactive map.

Key features:

• Cat spotting and reporting:

  Leveraging the power of the community: Users can report cat sightings they encounter, contributing to a collaborative effort to locate lost felines.

  Helping visualization: In addition to the image upload possibility, the customized placeholder SVGs serve as a quick and effective visualization tool when no photos of the cat are available.

  Comprehensive infosheets: Detailed infosheets are available for each reported cat, containing essential data such as descriptions (color, pattern, hair length, etc.), contact details, and photo.

• Lost cat registration:

  Connecting owners: Cat owners can share crucial information about their lost pets, including photos, descriptions, and last known locations, as well as their own contacts.

  Amplifying outreach: By notifying the community, the chances of a safe and timely reunion between lost cats and their owners increase.

• Intelligent match notifications:

  Advanced algorithm: Catspotter's smart matching algorithm let users know when their reported sightings align with the details of a lost cat, and vice versa. Color, pattern, lost and seen dates and vicinity are also taken into account.

• Interactive map visualization:

  Geographic insight: Powered by Leaflet, the dynamic map displays reported cat sightings and lost cat locations, offering a clear visual representation of activity, using different custom map markers to help differentiate between lost or seen cat data on the first glance.

  Areas of interest: Users can identify concentrated areas of cat-related activity, aiding focused search efforts.

  Enhanced search: The availability of comprehensive information and the available filtering options streamline search and identification processes.

• User-defined location preferences:

  Customized user areas: Users can tailor their location preferences and set desired area radii to receive relevant notifications based on proximity to reported sightings, providing a personalised experience throughout the app.

Future development:

Catspotter is an ongoing project (at the moment version 1.0) with plans for continuous development and feature enhancement. Upcoming changes include refining existing functionalities, optimizing and refactoring codebase, and introducing new features to further amplify the app's impact.

Challenges & solutions:

Creating Catspotter presented a series of exciting challenges that pushed the boundaries of my development skills. Each obstacle was met with dedication and innovation, resulting in a visually appealing and functional application:

• Matching algorithm precision: Developing a matching algorithm that accurately identifies relevant cat sightings and lost cat reports. To be able to show relevant data matches only, I implemented a multi-step algorithm that considers various factors such as location, time, and description to refine accuracy.
• User authentication and data security: Ensuring the security of user data and preventing unauthorized access. I implemented user registration and login functionality with secure password hashing. Utilized JSON Web Tokens (JWT) for user authentication and authorization.
• Location-based notifications: Implementing location-based notifications for users within the vicinity of matching cat sightings. I designed a user-friendly interface that makes users able to adjust and customize their area and notification preferences, while integrating backend logic to deliver tailored updates.
• Map visualization performance: Optimizing the performance of the interactive map to handle a growing volume of reported cat activities. I utilized Leaflet's clustering and marker optimization techniques to enhance map responsiveness and maintain a smooth user experience, as well as integrating different Leaflet plugins to further enhance the possibilities for location searching.

Technologies used:

You can find the guest login credentials for checking out the demo app on GitHub!

Back to the overview