Welcome to WorkSphere, a powerful and user-friendly Employee Management System designed to streamline workforce administration and HR processes. This application allows admins to view, manage, and update employee details efficiently.
- Username:
admin@gmail.com - Password:
Admin@2
- Username:
hr530@gmail.com - Password:
Hr@222
- Username:
employee@gmail.com - Password:
Employee@2
Note: Please keep these credentials secure and change them if sharing publicly.
-
Responsive Design:
- Fully responsive interface, compatible with all devices (mobile, tablet, and desktop).
-
Verified Employee List:
- View a comprehensive list of all verified employees with their key details like name, email, designation, and bank account number.
-
Toggle View Modes:
- Switch seamlessly between a table view and card grid view for better data visualization.
-
Adjust Salary:
- Modify employee salaries dynamically while ensuring proper validations.
-
Promote to HR:
- Grant HR privileges to eligible employees with just one click.
-
Fire Employees:
- Mark employees as fired and update their status instantly.
-
Filter:
- Easily filter employees based on specific criteria (future enhancement).
-
Role-based Actions:
- Only eligible employees can be promoted to HR or have their salaries adjusted.
-
Interactive Modals:
- Utilize intuitive pop-ups for actions like adjusting salaries to enhance user experience.
-
Secure Data Handling:
- All updates and actions are securely managed using Axios and backend APIs.
- Frontend: React.js, Tailwind CSS
- Backend: Node.js, Express.js
- Database: MongoDB
- Libraries: React Query, Axios, SweetAlert2, React Icons
- @stripe/stripe-js:
^2.2.0- Stripe payment integration - @tanstack/react-query:
^5.8.7- Data fetching and state management - axios:
^1.6.2- HTTP client for API requests - firebase:
^10.6.0- Authentication and hosting - react:
^18.2.0- UI library - react-dom:
^18.2.0- React DOM renderer - react-hook-form:
^7.48.2- Form handling - react-hot-toast:
^2.4.1- Toast notifications - react-icons:
^4.12.0- Icon components - react-router-dom:
^6.20.0- Routing - sweetalert2:
^11.10.1- Beautiful alerts and modals
- @types/react:
^18.2.37- React type definitions - @types/react-dom:
^18.2.15- React DOM type definitions - @vitejs/plugin-react:
^4.2.0- Vite plugin for React - autoprefixer:
^10.4.16- PostCSS plugin - eslint:
^8.53.0- Code linting - postcss:
^8.4.31- CSS tool - tailwindcss:
^3.3.5- Utility-first CSS framework - vite:
^5.0.0- Build tool and dev server