PetPals aimed to create an inclusive community for pet lovers, offering a platform where users can adopt pets, find information on pet care, and connect with other pet owners. Our choice to develop this website stems from a recognized need for a dedicated space where potential pet owners can find the right companion while ensuring pets find.
- Full Stack
my-app/
├─ backend/
│ ├─ config/
│ │ └─ db.js
│ ├─ middleware/
│ │ ├─ access.middleware.js
│ │ └─ auth.middleware.js
│ ├─ model/
│ │ ├─ application.model.js
│ │ ├─ blacklist.model.js
│ │ ├─ pet.model.js
│ │ └─ user.model.js
│ ├─ routes/
│ │ ├─ application.routes.js
│ │ ├─ pet.routes.js
│ │ └─ user.routes.js
│ └─ index.js
└─ frontend/
├─ src/
│ ├─ assets/
│ │ └─ img/
│ ├─ Components/
│ │ ├─ Article.js
│ │ ├─ FirstDiv.jsx
│ │ │ ├─ Footer.jsx
│ │ ├─ LoginForm.js
│ │ ├─ Menu.jsx
│ │ ├─ Navbar.jsx
│ │ ├─ Review.js
│ │ └─ SignUp.jsx
│ ├─ CSS/
│ │ ├─ Application.css
│ │ ├─ Article.css
│ │ ├─ Login.css
│ │ ├─ Navbar.css
│ │ ├─ Review.css
│ │ └─ Signup.css
│ ├─ Pages/
│ │ ├─ About.jsx
│ │ ├─ Adopt.jsx
│ │ ├─ Contact.jsx
│ │ ├─ Homepage.jsx
│ │ ├─ Login.jsx
│ │ ├─ MyApplication.jsx
│ │ └─ Signup.jsx
│ ├─ Redux/
│ │ ├─ action.js
│ │ ├─ actionTypes.js
│ │ ├─ reducer.js
│ │ └─ store.js
│ ├─ Routing/
│ │ ├─ AllRoutes.jsx
│ │ └─ PrivateRouting.jsx
│ ├─ App.jsx
│ ├─ main.jsx
│ ├─ api.js
│ └─ index.html
└─ Readme.md
video1136951398.mp4
- Codebase Walkthrough: [1-5 minutes video link]
- Dynamic searching for pets: Advanced search and filters features for searching pets.
- Responsive Design: Mobile-first, responsive design for a consistent cross-device experience.
- Streamlined Checkout: Simplified one-page checkout process to enhance user satisfaction.
- Admin Panel: Admin panel to handle backend and do basics crud operation.
- React and Context API for State Management: Chose React for its component-based architecture, facilitating reusable UI components, and Context API to manage global state like the fetching pets ensuring a seamless user experience across the application.
- Integration of viewing status of an application: Implemented a fetures to view the applicatioin status of applied application.
-
Simplified Adoption Process: Assumed users prefer a fast and hassle-free adoption process, leading to the implementation of a streamlined adoption process to reduce steps and potential friction points.
-
Expectation of Real-time Updates: Anticipated that users expect immediate feedback and updates within the adoption process, influencing the decision to implement real-time status updates on available pets and adoption requests, enhancing the overall adoption experience.
Quickly set up and start the project with these steps:
- Install the Project:
Clone and install the project's dependencies:
git clone https://github.com/sumit1921184/PetPals.git for backend cd backend npm install for frontend cd frontend npm install
Provide user credentials for authenticated pages:
- URL: https://petpals-masai.vercel.app/login
- User Login: virat@gmail.com
- Password: virat
- URL: https://pet-pals-admin.vercel.app/
- Admin Login:
- Password:
If your application relies on external APIs, document them and include any necessary links or references.
- API Base URL: https://petpals-2-261d.onrender.com/
Pets
/pets/:id
- Retrieve a specific pet by its ID.GET /pets
- Retrieve all available pets with optional pagination.POST
/pets - Add a new pet (requires admin access).PATCH /pets/:id
- Update details of a pet with the specified ID (requires admin access).DELETE /pets/:id
- Delete a pet with the specified ID (requires admin access).Users
POST /users/register
- Register a new user.POST /users/login
- Login a user.POST /users/logout
- Logout a user.GET /users
- Retrieve all users (requires admin access).GET /users/:id
- Retrieve a specific user by ID (requires admin access).DELETE /users/:id
- Delete a user by ID (requires admin access).PATCH /users/:id
- Update user details by ID (requires admin access). ApplicationsPOST /applications/:petId
- Apply for adopting a pet with the specified ID.GET /applications
- Retrieve all applications (requires admin access).PATCH /applications/update/:id
- Update details of an application with the specified ID (requires admin access).DELETE /applications/delete/:id
- Delete an application with the specified ID (requires admin access).GET /applications/getApp
- Retrieve applications of the authenticated user.
Frontend:
- React: For building the user interface.
- Chakra UI: for making componenets.
- Tailwind CSS: For styling.
- React redux: For managing state.
Backend:
- Mongodb: For database.
- Node Js: For backend.
- Express Js For making routes.