HO CHI MINH CITY UNIVERSITY OF TECHNOLOGY AND
EDUCATION
FACULTY FOR HIGH QUALITY TRAINING

GRADUATION THESIS

BUILDING AN ATTENDANCE CHECKING
SYSTEM APPLIED FACE RECOGNITION
NGUYEN PHAM QUOC THANG
Student ID: 19110516
THACH DUONG DUY
Student ID: 19110179
Course: 2019
Major: INFORMATION TECHNOLOGY
Advisor: NGUYEN DUC KHOAN M.Sc.

Ho Chi Minh City, June 2023

THE SOCIALIST REPUBLIC OF VIETNAM
Independence – Freedom– Happiness
-Ho Chi Minh City, June …, 2023

PROJECT ASSIGNMENT
Student name: NGUYEN PHAM QUOC THANG
Student ID: 19110516
Student name: THACH DUONG DUY
Student ID: 19110179
Major: Information Technology
Class: 19110CLST
Advisor: Nguyen Duc Khoan M.Sc.
Date of assignment: 02-20-2023
Date of submission: 05-29-2023
1. Project title: Building an attendance checking system applied face recognition
2. Initial materials provided by the advisor: Implementation using Express
Framework, React, Chakra UI, faceapi.js, MySQL.
3. Content of the project: The system utilizes modern technologies such as Express,
React, and the faceapi.js library to an intuitive and user-friendly interface
that allows users to have their own facial recognition attendance system to record
and manage their attendance and have a simple Human Resource Management for
the Manager or Admin can manage a data attendance from the Employee
4. Final product: The system allows the employee can record their attendance by
using facial recognition. They also can see their attendances detail, have a leave
request, have a work shift on the Human Resource Management website.
HEAD OF DEPARTMENT
(Sign with full name)

ADVISOR
(Sign with full name)

ii

THE SOCIALIST REPUBLIC OF VIETNAM
Independence – Freedom– Happiness
-Ho Chi Minh City, June …, 2023

ADVISOR’S EVALUATION SHEET
Student name: NGUYEN PHAM QUOC THANG
Student ID: 19110516
Student name: THACH DUONG DUY
Student ID: 19110179
Major: Information Technology
Class: 19110CLST
Project title: Building an attendance checking system applied face recognition
Advisor: Nguyen Duc Khoan M.Sc.
EVALUATION
1.
Content of the project:
.......................................................................................................................................
.......................................................................................................................................
2.
Strengths:
.......................................................................................................
...

...
how to use the faceapi.js library to implementation of the
facial recognition system.
6.2. Advantage
• The Charka UI component help fast to run and decrease development time.
• The system architecture is designed readably and reasonably, so the API request
and response between the client and the server is very stable and fast.
• The whole application is deployed on the VPS so it always in available state.
The customer can access the web anytime.
• Support face record attendance.
• Support tracking all the attendance record. Have the attendance statistic for the
employee can easily tracking.
145

• Support handling the face attendance exception, can re-train to collect the face
data again to resolve the face attendance error.
• The attendance system check-in and check-out can base on the work shift and
the early leave and late arrival setting in the organization management.
• Have the leave request system so the employee can request their leave day if
they have something busy.
6.3. Disadvantage
• Human Resource Management is not completed, some incomplete features such
as: manage salary, manage contract, manage experience, …
• The UI in the employee management and department management does not have
the search bar.
• The training face UI maybe not so attractive, need to be improve in the future.
6.4. Future Planning
• In the next development strategy, we will make the mobile application which
can receive notification when the attendance has been recorded so the employee
can easily track their attendance success or not. We will improve the UI of the
face recognition system.
• Adding the salary management and contract management to the HRM system.
Also have the payslip and payroll to the salary management.
• Adding the notification system for the employee and the manager can easily
tracking the things happen in the system.

146

REFERENCES
[1] React documentation, [Online]. Available: https://react.dev/reference/react
[2] Express documentation, [Online]. Available:
https://expressjs.com/en/5x/api.html
[3] NodeJS Documentation, [Online]. Available: https://nodejs.org/en/docs
[4] faceapi.js Documentation, [Online]. Available:
https://justadudewhohacks.github.io/face-api.js/docs/index.html
[5] Chakra UI Documentation, [Online]. Available: https://chakraui.com/getting-started
[6] Docker Documentation, [Online]. Available: https://docs.docker.com/
[7] Certbot Documentation, [Online]. Available: https://certbot.eff.org/

147