giant-hostel

bymalli swari

Build a production-ready full-stack Hostel Leave Request & Approval Management System. Tech Stack: Frontend: - ReactJS - Vite - Tailwind CSS - shadcn/ui - Lucide React Icons - React Router DOM - Axios - React Hook Form + Zod validation Backend: - Node.js - Express.js - SQLite - JWT Authentication - bcrypt password hashing Main Goal: Create a centralized hostel leave management portal where students can submit leave requests, wardens can review and approve/reject requests, and admins can monitor hostel activity and leave analytics. Application Requirements: ==================================== AUTHENTICATION & AUTHORIZATION ==================================== Implement secure authentication system with: - Register - Login - Logout - JWT token authentication - Role-based protected routes - Roles: - Student - Warden - Admin Features: - Store JWT securely - Password hashing using bcrypt - Session persistence - Unauthorized route protection - Role-based sidebar navigation ==================================== UI / DESIGN REQUIREMENTS ==================================== Create a premium modern SaaS dashboard UI inspired by: - Linear - Notion - Clerk Dashboard Design Requirements: - Fully responsive - Clean spacing - Soft shadows - Rounded cards - Professional typography - Modern tables - Status badges - Loading skeletons - Empty states - Error states - Toast notifications - Confirmation dialogs - Mobile responsive sidebar - Dark/light theme support Use: - Tailwind CSS - shadcn/ui components - Lucide icons ==================================== DATABASE TABLES ==================================== Create SQLite database with proper relationships. Tables: 1. users 2. hostels 3. leave_requests 4. review_comments 5. leave_history Add: - timestamps - foreign keys - indexes where needed ==================================== STUDENT FEATURES ==================================== Student Dashboard: - Overview cards - Leave statistics - Recent leave requests - Leave status tracking Student can: - Register/Login - Submit leave request - Edit leave request until review begins - Cancel leave request - View leave history - View approval/rejection comments - Track leave timeline Leave Request Form Fields: - Student name - Roll number - Hostel block - Leave reason - From date - To date - Parent contact number - Destination address - Emergency contact Validation: - Required fields - Invalid date ranges - Duplicate leave requests - Invalid phone numbers - Leave duration limit - Missing emergency contact ==================================== WARDEN FEATURES ==================================== Warden Dashboard: - Assigned requests - Pending approvals - Approval statistics Warden can: - View assigned leave requests - Search/filter requests - Add review comments - Approve/reject requests - Change request status Statuses: - Pending - In Review - Approved - Rejected - Cancelled Features: - Student leave history - Review timeline - Bulk filters - Pagination ==================================== ADMIN FEATURES ==================================== Admin Dashboard: - Total leave requests - Approved leaves - Rejected leaves - Pending requests - Hostel-wise leave percentage - Student leave frequency - Occupancy analytics Add charts using Recharts: - Leave trends - Approval ratio - Hostel occupancy - Monthly analytics Admin Features: - Search and filters - Date range filters - Hostel filters - Warden filters - Student filters - CSV export - View all activity ==================================== API REQUIREMENTS ==================================== Create clean modular Express APIs. Endpoints: POST /api/auth/register POST /api/auth/login POST /api/leaves GET /api/leaves GET /api/leaves/:id PUT /api/leaves/:id DELETE /api/leaves/:id POST /api/leaves/:id/comments GET /api/leaves/:id/comments GET /api/dashboard/summary Requirements: - Proper HTTP status codes - Validation middleware - Centralized error handling - Pagination support - Filtering support - Secure APIs ==================================== FOLDER STRUCTURE ==================================== Frontend Structure: src/ ├── components/ ├── pages/ ├── layouts/ ├── routes/ ├── hooks/ ├── services/ ├── context/ ├── utils/ ├── constants/ └── assets/ Backend Structure: server/ ├── controllers/ ├── routes/ ├── middleware/ ├── validators/ ├── services/ ├── db/ ├── config/ ├── utils/ └── app.js ==================================== EXTRA FEATURES ==================================== Add: - PDF leave approval slip generation - CSV export - Parent notification email template UI - Activity logs - Review timeline - Search and pagination - Protected routes - Reusable components - Confirmation modals - Status chips - Analytics cards ==================================== CODE QUALITY ==================================== Requirements: - Clean architecture - Reusable components - No hardcoded data - Maintainable code - Production-ready structure - Environment variables - Comments where needed ==================================== DEPLOYMENT ==================================== Prepare for deployment: Frontend: - Vercel Backend: - Render Include: - README.md - Setup instructions - Environment variables guide - API documentation - Demo credentials - Seed data ==================================== FINAL OUTPUT EXPECTATION ==================================== Generate: - Full frontend code - Full backend code - SQLite schema - API integration - Responsive UI - Authentication flow - Dashboard analytics - Working CRUD operations - Production-ready structure Ensure: - No placeholder pages - No console errors - Fully functional flows - Professional UI - Real-world SaaS quality