A Smart Queue Management System is a full stack web application designed to digitize traditional queue systems used in places like hospitals, banks, government offices, and service centers.
The system allows users to book service tokens online, track their queue position, and reduce waiting time, while administrators can manage queues efficiently.
In many service organizations such as hospitals, banks, and government offices, people often need to wait in long physical queues to access services.
This creates several problems:
- ⏳ Long waiting times
- 👥 Overcrowded waiting areas
- ❓ Lack of transparency about queue position
- 📉 Inefficient service management
The Smart Queue Management System aims to solve these problems by providing a digital platform for online token booking and queue tracking.
This system provides a web-based queue management platform where users can:
- Register and login
- Book service tokens online
- Track their queue position
- View estimated waiting time
- Cancel or manage tokens
Admins can monitor and manage the queue through a dashboard.
- Digitize traditional queue systems
- Reduce waiting time
- Improve service efficiency
- Provide real-time queue tracking
- Demonstrate full stack MERN development
- ReactJS
- Tailwind CSS
- React Router
- Node.js
- Express.js
- MongoDB
- Signup
- Login
- Logout
- Password validation
- Protected routes
- Book service tokens
- Track token number
- Cancel tokens
- Current token being served
- User token number
- Remaining queue count
- Search tokens
- Filter by service
- Sort tokens by time
Pagination is implemented for large datasets such as token lists.
Search input uses debouncing to prevent excessive API calls.
- Dark Mode
- Light Mode
- Theme stored in LocalStorage
- Create → Book token
- Read → View tokens
- Update → Update token status
- Delete → Cancel token
- ⏳ Estimated waiting time
- 🔄 Live queue updates
- 📱 QR code token system
- 📊 Admin analytics dashboard
- 🏥 Multi-service queue support
- ⭐ Priority queue support
- Home Page
- Signup Page
- Login Page
- Dashboard
- Queue Status Page
- Profile / Settings Page
- Admin Dashboard
The project demonstrates usage of important React hooks:
useStateuseEffectuseRefuseContext
POST /api/auth/signup
POST /api/auth/login
POST /api/token/book
GET /api/token
PUT /api/token/cancel/:id
GET /api/queue/status
GET /api/queue/current
GET /api/admin/tokens
PUT /api/admin/next-token
{ _id, name, email, password, role }
{ _id, serviceName, description }
{ _id, userId, serviceId, tokenNumber, status, createdAt }
The UI is built using Tailwind CSS, ensuring responsiveness across:
- Desktop
- Tablet
- Mobile devices
- Try-catch blocks
- Proper HTTP status codes
- Error messages
- Loading indicators
- API error handling
- Real-time notifications
- SMS alerts
- AI-based waiting time prediction
- Mobile app integration
- Reduces waiting time
- Improves service efficiency
- Enhances user experience
- Provides transparent queue management
Full Stack Hackathon Event
Using MERN Stack (MongoDB, Express.js, React.js, Node.js)