Author: Lixing Chen, Junyi Liu
Web Development Class - Fall 2023
The goal of this project is for us to apply the concepts learned by building a basic full-stack application with Node + Express + Mongo + React. It is designed to cater to the needs of both employees and managers. Employees can easily clock in their work hours, while managers can review and monitor employee time shifts.
Heading -- sans-serif
Paragraphs -- Arial
For the login and register pages, we used this color palette:
For the Employees and Manager pages, we used this color palette:
- Clone this repository.
- Run 'npm install'.
- Have MongoDB open
- Run 'node start'.
Authentications: The user can choose to sign up based on role and login and logout @Lixing Chen
Employee Page @Lixing Chen:
Add Shifts: Add shifts based on the dates
Clock In: Clock in for creating a timestamp
Display Shifts: Create a table to display all the added shifts for himself and see reviews
Delete Shifts: Delete the shift
Manager Page @Junyi Liu:
Search Shifts: Search shifts based on employee name/shift
Display Shifts: Create a table to display all the shifts for all employees
Check Clock In: Check the clock-in time for current employee
Review: Leave reviews for a specific shift
Delete Shifts: Delete the shift
Pagination: Display pages based on the wanted shift counts @Lixing Chen
NavBar: Display a Navbar with role and calendar @Junyi Liu
Typography Update
Color Palette Implementation
Change the color contrast issue for the Lighthouse test
Authentication with Passport
Reformat the spacing of the main content and pagination
Change the format of the Navbar for the signup and login page
Add the main purpose of the app under the title
Add functionalities Delete button for the manager page doesn’t work
Fix the error for the no post when clicking the last page
Put the search bar and addshift bar to the nav bar based on the role
Group related text and align them with alignment principles
Show the username based on the user login in the navbar
Login Page:
Register Page:
Employee Page:
Manager Page:
Review:
Employee Page After Review:
