Paws Frontend

screenshot of Paws Frontend
react
tailwind
material-ui
firebase

A fast responsive webapp that allows you to report injured stray animals to the nearest NGOs.

Overview:

Paws is a platform developed during the Smart Bengal Hackathon 2024 with a focus on animal welfare. The project aims to enable users to report injured animals and connect them with the necessary assistance. Paws also provides features for participating in campaigns, donating to support the app, and viewing statistics related to stray animals.

Features:

  • Reporting an Animal: Users can report injured animals, and the report is automatically sent to the nearest NGO or animal hospital based on location.
  • AI Based Animal and Injury Classification: Automatically detects the type of animal, number of animals, and external injuries from user-uploaded images.
  • Campaigns: Users can participate in NGO created campaigns as volunteers or donors.
  • Support Paws: Allows users to donate to Paws for app enhancements.
  • Statistics for NGOs: Provides NGOs with access to various statistics related to stray animals.
react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

material-ui
Material UI

material-ui adds classes to Tailwind CSS for all common UI components. Classes like btn, card, etc. This allows us to focus on important things instead of making basic elements for every project.

firebase
Firebase

Firebase offers a comprehensive set of features, including real-time database, authentication, hosting, cloud functions, storage, and more. Firebase provides an easy-to-use interface and allows developers to focus on building features rather than managing infrastructure.

postcss
Postcss

PostCSS is a popular open-source tool that enables web developers to transform CSS styles with JavaScript plugins. It allows for efficient processing of CSS styles, from applying vendor prefixes to improving browser compatibility, ultimately resulting in cleaner, faster, and more maintainable code.

webpack
Webpack

Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.