Lost And Found Application

Welcome to the Lost And Found Application, an intuitive platform designed to help users reconnect with their lost items or report items they have found. Built with modern technologies like React, Node.js, Express, MongoDB, and Firebase, this application ensures a smooth and efficient experience for all users.

Key Features

• Report Lost Items: Quickly create a post with detailed descriptions and images to alert the community about your lost belongings.
• Report Found Items: Share information about items you’ve found to help reunite them with their rightful owners.
• Advanced Search & Filters: Easily locate posts by filtering through categories like item type, date, and location.
• Real-Time Notifications: Get instant alerts when someone matches a lost or found item related to your post.
• Secure User Authentication: Ensure data privacy and security using Firebase Authentication.
• Community Collaboration: Build a helpful community that supports finding and returning lost items.

Technology Stack

• Frontend: Built with React.js for a dynamic, responsive, and user-friendly interface.
• Backend: Powered by Node.js and Express.js for robust and scalable server-side processing.
• Database: MongoDB ensures efficient storage and retrieval of lost-and-found data.
• Authentication: Integrated Firebase for secure user login and identity management.
• Hosting: Deployed on modern hosting platforms for high availability and performance.

---

Live Website

Visit the Application

---

Key Features

• Responsive Design: Optimized for mobile, tablet, and desktop, ensuring an exceptional user experience across all devices.
• Dynamic Campaign Management: Users can create, update, and view detailed campaigns in real time with data fetched dynamically from MongoDB.
• Sign Up/Login: Create an account or log in to access all features.
• Post an Item: Share details of the item you’ve lost or found, including location, date, and images.
• Browse Listings: Search and explore all active lost-and-found listings in your area.
• Connect: Use in-app messaging or contact details to connect with other users.
• Resolve Cases: Update the status of your post when items are found or claimed.
• Engaging User Interface: Modern animations and intuitive layouts, designed with React and Tailwind CSS, make navigation enjoyable.
• Secure Transactions: Powered by Firebase Authentication, ensuring user data is protected and secure.
• Interactive Notifications: Feedback mechanisms implemented with React-Toastify and SweetAlert2 enhance user engagement.

---

Frontend Dependencies

The frontend of this project utilizes a range of modern libraries and frameworks:

"dependencies": {
   "axios": "^1.7.9",
    "firebase": "^11.1.0",
    "framer-motion": "^11.15.0",
    "motion": "^11.15.0",
    "react": "^18.3.1",
    "react-datepicker": "^7.5.0",
    "react-dom": "^18.3.1",
    "react-helmet": "^6.1.0",
    "react-icons": "^5.4.0",
    "react-router-dom": "^7.1.0",
    "react-simple-typewriter": "^5.0.1",
    "react-toastify": "^11.0.2",
    "slick-carousel": "^1.8.1",
    "sweetalert2": "^11.15.3",
    "sweetalert2-react-content": "^5.1.0",
    "swiper": "^11.1.15"
}

---

Backend Dependencies

The backend is robustly designed with the following tools:

"dependencies": {
  "cookie-parser": "^1.4.7",
    "cors": "^2.8.5",
    "dotenv": "^16.4.7",
    "express": "^4.21.2",
    "jsonwebtoken": "^9.0.2",
    "mongodb": "^6.12.0",
    "multer": "^1.4.5-lts.1",
    "nodemon": "^3.1.9",
    "path": "^0.12.7"
}

---

How to Run Locally in Client side

1. Clone the repository:

   git clone https://github.com/programming-hero-web-course2/b10-a10-client-side-swapnilahmedshishir

2. Navigate to the project folder and install dependencies:

   cd CrowdcubeApplicationClient
   npm install

3. Start the frontend:

   npm run dev

4. Visit http://localhost:5173 in your browser to explore the application.

---

---

How to Run Locally in server side

1. Clone the repository:

   git clone https://github.com/programming-hero-web-course2/b10-a10-server-side-swapnilahmedshishir

2. Navigate to the project folder and install dependencies:

   cd CrowdcubeApplicationServer
   npm install

3. Start the frontend:

   npm run dev or npm run start

4. Add the .env file and set MongoDB username and Password.

5. Visit http://localhost:5001 in your browser to explore the application.

---

Hosting use

1. frontend:

   firebase deploy

2. server:

   vercel

---

Developer Info

Hi, I'm Swapnil Ahmed Shishir, a passionate web developer. This project showcases my expertise in creating modern web applications with React, MongoDB, and Firebase.
Feel free to connect for collaborations or feedback!

---