FetchMatch
Suryakumar Selvakumar
Published
FetchMatch is a responsive dog adoption platform built using React and TypeScript, featuring a catalog of over 10,000 shelter dogs across 120 breeds retrieved via API integration. The platform supports advanced filtering by breed, age range, and location, along with dynamic sorting by name, breed, or age to help users find their ideal match. I implemented cookie-based session management and client-side routing (React Router) across key pages like Home, Login, Search, and Favorites, all while maintaining end-to-end type safety and ensuring accessibility through ARIA standards. Users can save their preferred dogs in a personalized Favorites system, visualized through a curated UI with real-time feedback. The interface was crafted with Tailwind CSS, Material Tailwind, and enhanced with Motion animations for a smooth, mobile-friendly experience. The application’s stability and correctness were ensured through thorough integration testing using Vitest and React Testing Library.
GitHub - https://www.twine.net/signin
Live Demo - https://www.twine.net/signin