This is a web application to help onboard new employees designed specifically for the Warren Center. The objective is to improve and streamline their current manual onboarding process, aiming for enhanced user efficiency and overall ease of use. The application has three types of users: admins, supervisors, and employees. Admins control all the CRUD modifications on the app. Supervisors can perform only one update action, but they have the ability to view all the pages accessible to the admin. Employees can perform no modifications and can only see their page.
Before you can run this project, you'll need to have the following software installed on your computer:
If you haven't yet installed Node.js, Docker, and VS Code, you can download them by following the steps listed in the links below :
Note: for Windows users, dedicating time to set up Windows Subsystem for Linux (WSL) will prove to be a worthwhile investment. This is not required to run the project, but is recommended.
Once you have VS Code, Docker, and Node.js installed, you can setup the project by following these steps:
Open Visual Studio Code and click on the Clone Repository button in the welcome screen
In our GitHub repository click on the green Code button and copy the HTTPS repository URL
Enter the URL of the repository and choose a local directory to clone it to
Open a terminal window in VSCode and navigate to the project directory. If you do not know how to navigate in the terminal look at this video or this blog post
From the root of the project, go to the /frontend folder and type npm install and hit the enter key (this may take a while)
Run the command cd ../backend to go to the backend folder, and run npm install (this may take a while)
Run the command cd .. to go to the root of the project and then run docker compose up in the project's root directory to start the docker container. If you don't see anything along the lines of "database system is ready to accept connections", close the terminal and try the command again.
Keep the docker terminal open and make a new terminal window
Go to the backend folder and run the command npx prisma migrate reset to create the database
Go back to the terminal and open a new terminal window in the backend folder
Now run npm run dev to start the backend
Open a fourth terminal and go to the frontend folder and run npm run dev to start the frontend
docker compose up in the root of the projectnpm run dev in the /backend foldernpm run dev in the /frontend folder (this may take a while)
If any part of the setup does not make sense or is yielding errors, you can paste these steps in ChatGPT or Bing Chat. These tools are a great first step in debugging the problem.
User with the most permissions. Can perform all CRUD operations on all pages.
User with the second most permissions. Sees everything the admin can. However, can perform the action of completing a task for a user only if they are assigned to that specific task.
User with the least permissions. Can only see their own page. Can't perform any CRUD operations.
On this page the admins and supervisors will be able to see all the users currently in the system. The admin will have the ability to CRUD users on this page, whereas the supervisor will only be able to view the users. Upon clicking on a specific user, their task list will open up. The admin will be able to mark every task as completed. Whereas, the supervisor will only be able to mark the tasks they are assigned to.
On this page the admins and supervisors will be able to see all the departments currently in the system. The admin will have the ability to CRUD departments on this page, whereas the supervisor will only be able to view the departments. Upon clicking on a specific department, the department's task list will open up. The admin will be able to perform CRUD on tasks. Whereas, the supervisor will only be able to view the tasks assigned to that deparment.
This page will have three tabs: Archived Users, Archived Departments, Archived Tasks. The admins and supervisors will be able to see all the archived users, departments, and tasks. The admin will have the ability to either permanently delete or restore users, departments, and tasks. Whereas the supervisor will only be able to view the archived users, departments, and tasks.
Employees will not be able to see any other page except this one. They can't edit anything on this page. They can only interact with the profile button and the supervisor's name. The profile button will open a modal with their profile information. Upon clicking the supervisor's name, it will open a modal with the supervisor's profile information. The idea is that the employee can see their tasks and then be able to see their supervisor's information in case they need to contact them.
| Tables | Attributes |
|---|---|
| User | Name, Email (unique) Archived (boolean) |
| Department | Name Archived (boolean) |
| Task | Description Archived (boolean) |
| Role | roleName Archived (boolean) |
| UserRoleMapping | Relates a user to a role - (userId, roleId) |
| DepartmentTaskMapping | Relates a department to a task - (departmentId, taskId) |
| DepartmentUserMapping | Relates a user to a department - (userId, departmentId) |
| ApproverTaskMapping | Relates a supervisor to a task - (userId (needs supervisor role), taskId) |
| OnboardingEmployeeTaskMapping | Relates an employee to a task - (userId (needs employee role), taskId) |
These are the most important extensions that everyone on the team should have. Other extensions are up to personal preference.
[Not deployed yet]