Inspiration
Most "Smarter Resource Management" ideas target electricity or water. We targeted people. F&B businesses track food cost obsessively but still manage staffing with spreadsheets and group chats — and when someone calls in sick an hour before their shift, the usual answer is "the manager panics." We wanted to treat manpower like a smart grid treats electricity: measured, optimized, and reallocated in real time.
What it does
MRM is a dark, glassmorphic dashboard giving F&B managers a live view of their workforce. The Team Hub tracks headcount, active shifts, and per-employee data like hourly wage. The Shift Control Matrix turns the daily schedule (07:00–21:00) into an interactive timeline where admins assign, edit, or remove shifts ,even overlapping ones, with instant visual feedback. Every change propagates immediately across the app, so the dashboard is never stale.
How we built it
Next.js powers the frontend, styled with Tailwind for the dark glassmorphism UI, with TypeScript enforcing strict Member/Shift schemas across the app. On the backend, Express.js handles our API layer, Prisma acts as the ORM, and PostgreSQL (hosted on Supabase) is our persistent data store. The Team Hub and Shift Matrix share a state layer, so edits in one reflect instantly in the other.
Challenges we ran into
Rendering overlapping shifts cleanly was the toughest problem, we had to calculate fractional heights and dynamic columns so the timeline stayed readable no matter how many shifts collided. Keeping state in sync across both views without lag or stale renders took real iteration, and as always, 24 hours forced hard calls on what made the build versus the roadmap.
Accomplishments that we're proud of
We're most proud of building an algorithm that fully optimizes employee workload, automatically balancing shifts so no one is overworked while every slot stays covered. On top of that, we shipped a fully functioning dual-view system with real CRUD, live state sync, and a UI that doesn't look like a typical hackathon project. Solving the overlapping-shift layout with fractional-height math was a genuine win and we kept a clean line from problem (manpower waste, sudden absence) to solution (a live optimization dashboard).
What we learned
How to wire a Next.js/Tailwind frontend to an Express API backed by Prisma and PostgreSQL on Supabase, and how strict TypeScript schemas kept frontend and backend in sync without constant back-and-forth under time pressure.
What's next for MRM_QWER
Smart Replacement Engine — auto-detect MC/emergency leave and instantly notify the best-fit available replacement by skill, fatigue, and hours. QR Attendance Registration — digital clock-ins that update the roster live. Subscription Auto-Optimization — a recurring plan that emails optimized schedules to every employee at the press of a button. Predictive Risk Insights — flagging high-risk shifts before they happen using historical attendance patterns.
Built With
- express.js
- next.js
- postgresql
- prisma
- supabase
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.