Employetica is a modern, full-stack employee management web application where employees can track their work updates and HR executives can monitor their workflow, verify users, and manage salary payments. Admins can control user roles, adjust salaries, and manage payroll seamlessly.
🚀 Developed for Assignment 12 (assignment12_category_004) of the Programming Hero Web Development Course.
- Admin Email:
admin@employetica.com - Admin Password:
123QWE!
Live Website: employetica.web.app
Backend Repository: GitHub - Server Side Code
- React JS – Front-end library
- Tailwind CSS – Utility-first CSS framework
- DaisyUI – Tailwind-based UI component library
- TanStack Query – Efficient data fetching for GET operations
- TanStack Table – Powerful and flexible table rendering
- Firebase Authentication – Secure login & role management
- React Router DOM – Dynamic routing
- SweetAlert2 – User-friendly toast/alert notifications
- React DatePicker – Date input for task forms
- JWT (via Firebase Token) – Role-based route protection
- ImgBB – Image uploading for user photos
- 🔐 Secure registration and login system with role selection (Employee, HR only).
- 👨💻 Employees can add/edit/delete their work hours in a worksheet.
- 💵 Employees can see their own salary payment history with pagination.
- 🧑💼 HR can view all employees, verify them, pay salary, and view individual progress.
- 📈 Bar chart visualization of employee salary data using dynamic charting.
- 📊 TanStack Table used for dynamic tables with filtering and sorting features.
- 🚫 Admin can fire users and prevent login; can also promote employees to HR.
- 📬 Contact form with message submission visible to Admin on dashboard.
- ⚙️ Fully responsive design — mobile, tablet, and desktop compatible.
- ✅ All sensitive operations (e.g. salary update, role change) protected via Firebase token & role-based backend middleware.
/— Home page with banner, services, testimonials, etc./dashboard— Role-specific dashboard (Employee / HR / Admin)/contact-us— Contact form for visitors/loginand/register— Authentication routes
Client uses .env file to hide sensitive data:
POST /jwt— Generate JWT token after Firebase loginGET /logout— Clear cookie and logout user
GET /users— Get all users (admin only)POST /users— Save a new userPATCH /users/role/:id— Update user role (admin only)DELETE /users/:id— Delete a user
GET /services— Get all servicesGET /services/:id— Get a single servicePOST /services— Add a new service (provider only)DELETE /services/:id— Delete service (provider or admin)
GET /bookings— Get all bookings (admin/provider/user)POST /bookings— Create a new bookingPATCH /bookings/status/:id— Update booking status (provider/admin)DELETE /bookings/:id— Cancel a booking
GET /reviews— Get all reviews for a servicePOST /reviews— Add a review (authenticated user)DELETE /reviews/:id— Delete a review