Petinder
Petinder is a platform that connects pet lovers with adoption centers, animal shelters, and pet-friendly businesses. Its mission is to promote responsible pet ownership, support animal welfare organizations, and offer resources for pet care and pet-friendly spaces. As a volunteer frontend developer, I was dedicated to supporting Petinder’s mission by ensuring a high-quality, scalable, and user-friendly platform.
Key features:
• UI Component Development
Implemented and developed almost all UI components, ensuring visual consistency and a seamless user experience across mobile and desktop platforms.
• Design System Integration
The modular architecture was selected for this project. This allows for better scalability and maintainability.
• Advanced Filtering System
Implemented dynamic filtering functionality by categories like Outdoors and Lodging, enhancing user engagement with customizable search options.
• Pet Profile Page Implementation
Developed an intuitive and informative Pet Profile Page to highlight adoptable pets, improving user interaction and navigation.
• Home Page Implementation
Created a visually appealing and engaging Home Page with sections that contains carrousels with cards that contains relationated information to highlight pet adoption centers and shelters, attracting potential adopters.
• Bug Fixing & UI/UX Enhancements
Resolved multiple UI/UX bugs.
• User Experience Enhancements
Improved navigation and interactive components, including dropdown filters, carousel behavior, and proper alignment of UI elements.
• Code Quality & Project Structure
Maintained high code quality by following best practices and enforcing a modular project structure, ensuring scalability and maintainability.
• Performance Optimization
Optimized page load times and performance by implementing lazy loading, image optimization, and code splitting, resulting in a faster and more responsive user experience.
• Accessibility Improvements
Enhanced accessibility by implementing best practices for screen readers, keyboard navigation, and color contrast, making the platform inclusive for all users.
• Cross-Browser Compatibility
Tested and refined components to ensure consistent functionality and appearance across major browsers.
• Internationalization with Next-Intl
Implemented next-intl for internationalization, enabling seamless support for both English and Spanish languages, making the platform accessible to a wider audience.
• Global State Management with Zustand
Utilized zustand for efficient global state management, providing a simple and scalable solution to handle shared states across different components.
• Testing with Vitest
Employed vitest for unit and integration testing, ensuring the stability and reliability of the frontend by covering critical functionalities and edge cases.
