About the project
The goal of this project was to develop a fully functional full-stack website, integrating both front-end and back-end development to deliver a complete, end-to-end user experience. The platform is designed to connect pet owners with trusted sitters: users can search for a sitter for their pet or offer to host a pet for a specific period.
Key features include a searchable and filterable listing of available sitters and hosts, detailed profiles for each user, and booking functionality to facilitate secure and reliable arrangements. This project allowed me to work on database design, server-side logic, and responsive front-end interfaces, ensuring the platform was both functional and user-friendly.
Structure
The platform’s data is manually added to the database and deployed via Render/Netlify. The website is structured across six distinct pages to guide users through the full pet-sitting workflow.
Signup page: Users create a profile by providing their information. Each account is assigned a secure, encrypted password and a valid authentication token.
Login page: Existing users can access their profile using their credentials.
Profile page: Once logged in, users can leverage CRUD functionalities to add, delete, or update their pets, as well as post new inquiries to find a sitter.
When a user posts an inquiry, they are redirected to a hub of available posts, displaying all pending requests from other users. Here, users can review inquiries and accept pets to care for based on their personal availability. Once a pet is accepted, the details are added to the user’s profile, and after the care period concludes, the pet can be removed from the list.
This flow ensures a dynamic and interactive experience, enabling users to manage their pets and sitter arrangements efficiently and securely.
The most challenging part
One of the biggest challenges I faced was working with JWT token validation and middleware. Understanding the underlying concepts and adapting them to my code proved to be particularly complex, even with reference materials at hand. Since certain pieces of data needed to be transferred across multiple pages, every detail had to be carefully planned to ensure the authenticator correctly recognized the token, validated the data, and passed it to the appropriate page while maintaining secure access control.
This experience strengthened my understanding of authentication workflows, middleware integration, and secure data handling in a full-stack environment.
Here you can try the live page
https://our-module-3-frontend.netlify.app/