Library Dashboard
React
TypeScript
Vite
Tailwind
Redux Toolkit
Node.js
Express
MongoDB
Zod
Shelfy
Shelfy is a library management dashboard that brings clarity to daily operations with stats, activity logs, and structured workflows. The UI surfaces key information quickly while keeping actions intuitive.
Main Stack
Zod
Project Scope
Library Workflow
Clear, responsive operations
A streamlined interface for core library tasks and reporting.
- Book catalog CRUD with filtering and sorting.
- Borrowing flow with availability checks and due dates.
- Borrow summary dashboard with aggregated stats.
- Real-time UI updates for inventory changes.
- Zero-auth access for fast demos.
Data Integrity
Business rules enforced in the API
Server-side validation keeps records accurate and consistent.
- Zod validation with descriptive errors.
- Business logic prevents over-borrowing.
- MongoDB aggregation for borrow summaries.
- Mongoose static methods and middleware hooks.
- Structured error handling and response formats.
Stack + UX
Modern React foundation
A lightweight stack with accessible UI components.
- React 19, TypeScript, and Vite for fast iteration.
- RTK Query for caching and data sync.
- Tailwind and Radix UI for consistent styling.
- Responsive layout across devices.
- Minimal, accessibility-first design.
Challenges
What I had to solve
- Organizing dense data while keeping the layout clean and scannable.
- Designing reusable UI patterns for cards and activity lists.
- Balancing admin workflows with quick user actions.
Future Plans
Improvements and next steps
- Add role-based permissions for staff and admins.
- Introduce advanced analytics and export tools.
- Expand automation for overdue notices and reminders.