Skip to content

PetCare is a user-friendly web application designed to connect pet lovers with animals in need of a forever home. Whether you are looking to adopt a pet, browse available pets, or manage adoption requests, PetCare simplifies the entire process.

Notifications You must be signed in to change notification settings

sanjitgh/pet-care-forontend

Repository files navigation

PetCare

PetCare is a pet adoption platform where users can adopt, donate pets, and make payments. It features an authentication system and an intuitive user interface for easy navigation.

Key Features:

  • Adopt Pet: Browse through available pets and adopt your favorite one.
  • Payment System: Make payments securely for pet adoption.
  • Donate Pets: Users can donate their pets to the platform for adoption.
  • Authentication System: Secure sign-up and login functionality.

Technology Stack:

  • Frontend:
    • React for building the UI components.
    • Material Tailwind for UI components styled with Tailwind CSS.
    • React Router for navigation and route management.
    • Swiper for carousel/sliders.
    • SweetAlert2 for customizable alerts.
    • Date-fns for working with dates and times.
    • Tanstack Query for data fetching and caching.
    • React Icons for icon support.
    • Axios for making HTTP requests.

NPM Packages:

  • material-tailwind: A Tailwind CSS component library with Material Design elements.
  • axios: Promise-based HTTP client for making requests to the backend.
  • react-icons: A library to use popular icons in React apps.
  • react-router: A declarative routing library for React.
  • sweetalert2: Beautiful, customizable, and accessible alerts for React.
  • swiper: A modern mobile touch slider with support for carousels.
  • date-fns: A utility library for working with dates and times.
  • tanstack-query: A library for data fetching, caching, and synchronization.

NPM Packages:

  • @emotion/react: A library for styling with Emotion in React.
  • @emotion/styled: A styling library for Emotion.
  • @material-tailwind/react: Material Tailwind components for React.
  • @mui/icons-material: Material UI icons for React.
  • @mui/material: Material UI components for React.
  • @mui/styled-engine-sc: Material UI styled engine for React.
  • @stripe/react-stripe-js: Stripe library for React.
  • @stripe/stripe-js: Stripe JavaScript library.
  • @tanstack/react-query: Data fetching, caching, and synchronization library for React.
  • @tanstack/react-table: A table library for React.
  • @tiptap/core: A core library for building rich text editors.
  • @tiptap/react: React integration for Tiptap (rich text editor).
  • @tiptap/starter-kit: A set of essential extensions for Tiptap.
  • axios: Promise-based HTTP client for making requests to the backend.
  • date-fns: Utility library for working with dates and times.
  • firebase: Firebase SDK for integration with Firebase services.
  • localforage: Offline storage library for handling data persistence.
  • match-sorter: A library for sorting objects with string matchers.
  • motion: A library for animations and transitions.
  • react: A JavaScript library for building user interfaces.
  • react-countup: A React component for counting numbers.
  • react-datepicker: A React date picker component.
  • react-dom: DOM bindings for React.
  • react-helmet-async: A library for managing the document head in React.
  • react-hook-form: A library for handling forms in React.
  • react-hot-toast: A library for toast notifications in React.
  • react-icons: A library for adding popular icons to React components.
  • react-infinite-scroll-component: A React component for implementing infinite scroll.
  • react-intersection-observer: A React component to observe elements' visibility.
  • react-loading-skeleton: A skeleton loader component for React.
  • react-paginate: A pagination component for React.
  • react-quill: A React component for the Quill rich text editor.
  • react-router-dom: A routing library for React.
  • react-select: A flexible and customizable select dropdown for React.
  • react-spinners: A set of spinners for React.
  • sort-by: A library to sort arrays of objects.
  • styled-components: A library for writing styled components in React.
  • sweetalert2: A library for customizable, accessible, and beautiful alerts in React.
  • swiper: A modern mobile touch slider with support for carousels.

Installation:

To set up PetCare locally, follow these steps:

  1. Clone the repository:
    git clone https://github.com/sanjitgh/pet-care-forontend.git
    cd petcare
    
    

Live Link:

https://petcare-1777f.web.app/

About

PetCare is a user-friendly web application designed to connect pet lovers with animals in need of a forever home. Whether you are looking to adopt a pet, browse available pets, or manage adoption requests, PetCare simplifies the entire process.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages