Smart Bin – Full-Stack IoT Waste Monitoring System by Busra YagciogluSmart Bin – Full-Stack IoT Waste Monitoring System by Busra Yagcioglu

Smart Bin – Full-Stack IoT Waste Monitoring System

Busra Yagcioglu

Busra Yagcioglu

Overview

Smart Bin is a full-stack IoT waste monitoring system developed as part of my Software Engineering graduation project.
The system combines embedded hardware, cloud infrastructure, a responsive web dashboard, and a cross-platform mobile application to monitor waste-bin fill levels in real time.
It addresses two practical problems:
• Manual monitoring of waste-bin capacity • Unhygienic physical contact with bin lids
The project was documented in an 80-page technical report and integrates four technical layers: ESP32-based hardware, Firebase Realtime Database, a React web application, and a React Native mobile application.
I independently developed the web application, mobile application, and Firebase cloud integration, while the hardware prototype and ESP32 firmware were developed jointly with a teammate.

The Problem

Waste bins in shared facilities are often checked manually, which can lead to inefficient collection schedules, overflowing containers, and unnecessary operational work.
Traditional lids also require physical contact, creating hygiene concerns in public or frequently used environments.
The goal was to develop a connected system that could:
• Measure bin fill levels automatically • Display live status across web and mobile applications • Allow users to register and manage multiple bins • Reduce physical contact through automatic lid control • Provide a foundation for alerts and smarter collection planning

The Solution

The final system connects sensor-equipped waste bins to Firebase through an ESP32 microcontroller.
Fill-level measurements are transmitted to the cloud and made available to connected web and mobile clients in real time.
Users can:
• Create and access a personal account • Register a smart bin using its unique device ID • Assign a custom name to each bin • Monitor the current fill percentage • Manage multiple registered bins • Remove bins from their account • Access profile and account-management tools • Review privacy, terms of service, and KVKK information
The mobile and web applications provide separate interfaces connected to the same real-time data source.
Cross-platform product experience featuring the web dashboard, mobile authentication, device registration, and smart-bin management.
Cross-platform product experience featuring the web dashboard, mobile authentication, device registration, and smart-bin management.

System Architecture

The system consists of four integrated layers.
Hardware Layer
The hardware prototype uses:
• ESP32 microcontroller • HC-SR04 ultrasonic sensors • Servo motor • LED and buzzer components • Wi-Fi connectivity
One ultrasonic sensor measures the internal fill level of the bin.
A second sensor detects nearby movement and activates the servo-controlled lid without requiring physical contact.
The embedded firmware was developed in C++ using the Arduino IDE.
Cloud Layer
Firebase Realtime Database acts as the real-time communication layer between the hardware and client applications.
The ESP32 publishes sensor measurements and device state to Firebase over Wi-Fi.
Connected web and mobile clients subscribe to changes using Firebase listeners, allowing the interface to update without manual refreshes or repeated polling requests.

Web Application

The responsive web dashboard was built with React and deployed on Netlify.
The web application includes:
• Account registration and login • Dashboard navigation • Smart-bin registration • Bin-list and fill-level monitoring • Profile and account management • Privacy Policy • Terms of Service • KVKK Information Notice
The interface uses reusable React components and provides a centralized environment for managing registered smart bins.

Mobile Application

The mobile application was developed with React Native and Expo.
It provides mobile access to the same account and smart-bin management functionality, including:
• Registration and login • Adding a bin by device ID • Bin monitoring • Profile management • Privacy and legal-information screens • Bottom-tab navigation
The application was designed to provide a consistent experience across Android devices while sharing real-time data with the web platform.

Real-Time Data Flow

The ESP32 reads sensor values and publishes device updates to Firebase Realtime Database.
Firebase distributes those changes to subscribed clients.
The React web dashboard and React Native mobile application receive the new data through real-time listeners and update the visible fill level without requiring polling.
This architecture allows hardware, cloud, web, and mobile components to remain synchronized.

Authentication and User Data

The web and mobile applications include account registration and login flows.
Authenticated users can associate smart-bin device IDs with their accounts and manage their own registered devices.
User information and device-related data are handled separately to support account-based bin management.
Firebase Authentication manages user registration and login, while database rules restrict access to account and device-related operations.

Performance Optimization

The ESP32 firmware uses non-blocking timing patterns instead of relying entirely on delay-based execution.
This allows sensor measurements, Wi-Fi communication, and servo operations to run without unnecessarily blocking one another.
On the client side, Firebase real-time listeners eliminate repeated polling and deliver updates only when the underlying data changes.
Listener cleanup is handled when components unmount to prevent duplicate subscriptions and memory leaks.

Challenges & Solutions

Sensor Stability
Ultrasonic sensors initially produced inconsistent measurements because of environmental noise, vibration, and rapid changes in the detected distance.
A multi-reading filtering approach was used before making fill-level or lid-control decisions, reducing unstable measurements and false activations.
Real-Time Synchronization
The web and mobile clients needed to display the same device state without conflicting or outdated values.
Firebase Realtime Database listeners provided a shared real-time data source for both platforms.
Listener lifecycle management was implemented to prevent duplicate connections when users moved between screens.

Hardware and Software Integration

Integrating the ESP32, sensors, servo motor, Firebase, web dashboard, and mobile app required coordinating multiple technologies with different execution models.
I separated the system into clear hardware, cloud, web, and mobile layers and tested each layer independently before validating the complete end-to-end data flow.

Legal and Privacy Experience

Because the system includes user accounts and device-related data, I also created Privacy Policy, Terms of Service, and KVKK information screens for both the mobile and web applications.

My Role

I independently designed and developed the complete web, mobile, and Firebase cloud layers of the system.
My contributions included:
• System and software architecture • React web application development • React Native and Expo mobile development • Firebase Realtime Database design • Real-time listener integration • User registration and login flows • Account-based device management • Bin registration by unique device ID • Live fill-level visualization • Profile and account-management features • Privacy Policy, Terms of Service, and KVKK interfaces • Responsive web design • Mobile interface development • Netlify deployment • Testing and debugging • Graduation-project documentation
The physical prototype, sensor integration, hardware assembly, and ESP32 firmware were developed jointly with a teammate.

Outcome

The result is a working end-to-end IoT prototype that connects physical sensors to cloud infrastructure and synchronized web and mobile applications.
The system demonstrates real-time fill-level monitoring, contactless lid operation, user authentication, device registration, multi-bin management, and account-based access.
This project demonstrates my ability to design and implement software across embedded systems, cloud services, web applications, mobile applications, real-time data flows, and user-facing product experiences.
End-to-end IoT integration combining the physical prototype, real-time Firebase monitoring, web controls, and mobile access.
End-to-end IoT integration combining the physical prototype, real-time Firebase monitoring, web controls, and mobile access.

Live Web Application

Project Page

Like this project

Posted Jul 22, 2026

Built the web, mobile, and cloud layers of a real-time IoT waste monitoring system using React, React Native, Firebase, and ESP32.