INDUSTRIAL TRAINING REPORT
Employee Attendance System
(Mark Presence Pulse)
Submitted in partial fulfilment of the Requirements for the award of
Degree of Bachelor of Technology in Computer Science & Engineering
Session: 2024-25
Submitted By:
Name: Anant Khandelwal
University Roll No. 22ESKCS020
Semester: V Semester
Branch: Computer Science Engineering
SUBMITTED TO:
Mr. Shirish Nagar (Assistant Professor),
Department of Computer Science & Engineering
SWAMI KESHVANAND INSTITUTE OF TECHNOLOGY, MANAGEMENT &
GRAMOTHAN,JAIPUR
DECLARATION
I hereby declare that the Industrial Training Report entitled ("Employee Attendance System") is an
authentic record of my own work as requirements of 6-weeks Industrial Training during the period
from 1 July 2024 to 20 August 2024 for the award of degree of B.Tech.(Computer Science &
Engineering), Swami Keshvanand Institute of Technology, Management & Gramothan, Jaipur,
under the guidance of Mr. Shirish Nagar, Assistant Professor, Department of Computer
Science and Engineering.
(Signature of student)
Anant Khandelwal
22ESKCS020
Date: ____________________
Certified that the above statement made by the student is correct to the best of our knowledge and
belief
Examined by:
(Signature)
Mr. Shirish Nagar
Assistant Professor
(Signature)
Head of Department
1
CERTIFICATE
2
ACKNOWLEDGEMENT
First and foremost, I wish to express my sincere thanks and gratitude to my esteemed Mentor Mr.
Rajesh Gupta who has contributed so much for successful completion of my Industrial Training
by his thoughtful reviews and valuable guidance.
Next, I would like to tender my sincere thanks to Prof. Dr. Mehul Mahrishi (Head of Computer
Science & Engineering) for his co-operation and encouragement. I am indebted and grateful to Mr.
Shirish Nagar for his continual support and guidance. I am also thankful to Dr. Yogendra Gupta,
Coordinator (II/III/IV year In-house internship 2023-24), for his support, cooperation and
motivation provided during the internship for constant inspiration, presence, and blessings.
(Signature of Student)
Anant Khandelwal
22ESKCS020
3
About Company
SMARTLINK SOFT Pvt. Ltd. is a leading provider of innovative technology solutions and
training services. Renowned for its excellence in automation tools and software development,
SMARTLINK SOFT has established itself as a key player in streamlining communication and
enhancing productivity through cutting-edge technological advancements.
The company specializes in designing and implementing robust solutions in areas such as web
automation, artificial intelligence, and data management. Its flagship projects include tools that
simplify repetitive tasks, improve business efficiency, enhance security and provide for software
solutions.
With a focus on real-world applications, SMARTLINK SOFT provides training and mentorship to
students and professionals, enabling them to master technologies like ReactJs, and Web
Technologies. The company’s team of experts ensures that each solution is aligned with the latest
industry standards and addresses the unique challenges faced by clients.
Since its inception, SMARTLINK SOFT has been at the forefront of driving innovation,
empowering organizations and individuals to achieve their goals through tailored automation and
digital solutions. Through its dedication to practical learning and impactful project delivery, the
company bridges the gap between academia and the industry, fostering the development of
next-generation tech leaders.
4
Table of Contents
1. Introduction 1
1.1 Project Overview………………………………………………………………………….1
1.1.1 Objective………………………………………………………………………..1
1.1.2 Core Features………………………………….………………………………1
1.1.3 Technologies Used…………………………………………………………….2
1.1.4 Project Structure and Architecture ……………………………………...……2
1.2 Project Scope…………………………………………………………………………….3
1.2.1 Functional Scope………………………………………………………………..3
1.2.2 Technical Scope………………………………………………………………...3
1.2.3 Security Scope…………………………………………………………………..3
1.2.4 Limitations……………………………………………………………………...4
1.2.5 Future Enhancements…………………………………………………………...4
1.3 Intended Users…………………………………………………………………………...4
1.3.1 Primary User Groups……………………………………………………………4
1.3.2 Additional User Groups………………………………………………………...4
1.3.3 Usage Scenarios………………………………………………………………...5
1.4 Project Features………………………………………………………………………….5
1.4.1 Geofencing for Attendance…………..…………………………………………5
1.4.2 Real-Time Notifications………………...………………………………………5
1.4.3 Location Visualization….………………………………………………………5
1.4.4 Attendance Reporting…………………………………………………………...5
1.4.5 Data Security……………………………………………………………………5
1.4.6 User-Friendly Design…………………………………………………………...5
2. Tools & Technologies Used 6
2.1 Software Model Used…………………………………………………………………...6
2.1.1 Model-View-Template (MVT) Architecture…………………………………...6
2.1.2 Benefits of MVT Architecture………………………………………………….6
2.1.3 Relevance to the Project………………………………………………………...6
2.2 Product User Interfaces………………………………………………………………….7
2.2.1 Authentication Interfaces……………………………………………………….7
2.2.2 Main Interfaces…………………………………………………………………7
2.2.3 Navigation and User Experience……………………………………………….7
2.3 Frontend Technologies Used……………………………………………………………7
2.3.1 HTML…………………………………………………………………………...7
2.3.2 TailwindCSS……………………………..……………………………………...7
2.3.3 JavaScript………………………………………………………………………..8
2.3.4 ReactJS………………………………………………………………………......8
2.4 Backend Technologies Used…………………………………………………………….8
2.4.1 NodeJs…………………………………………………………………………...8
2.4.2 ExpressJs Framework…………………………………………………………...8
2.4.3 MongoDB Database……………………………...……………………………...8
2.5 Use Case Diagram……………………………………………………………………….9
2.6 Design and Implementation Constraints……………………………………………….10
3. Snapshots 11
3.1 Flowchart / Proposed Workflow……………………………………………………….11
3.2 Project Screenshots…………………………………………………………………….12
3.3 Code Implementation…………………………………………………………………..12
3.3.1 PunchIn & Out Code……………….…………………………………………13
3.3.2 User Profile (Login) Code…………….………………………………………14
4. Results and Discussion 15
4.1 Application Features and User Interaction……………………………………………..15
4.1.1 System Design and Architecture……………………………………………15
4.1.2 User Experience and Interface Design……………………………………...15
4.2 System Performance and Security Analysis……………………………………………16
4.2.1 Load and Response Time Analysis……………………………………………16
4.2.2 Security and Data Protection…………………………………………………..16
5. Conclusion and Future Scope 18
5.1 Conclusion……………………………………………………………………………..18
5.2 Future Scope…………………………………………………………………………...19
5.3 Final Thoughts………………………………………………………………………...19
6. References 20
List of Figures
Figure 2.1: Use-Case Diagram……………………………………..…………………………..9
Figure 3.1: Workflow of the Employee Attendance Management…..…………………………..11
Figure 3.2: Sequence Diagram of the Employee Attendance Management……………………..12
Figure 3.3: Frontend User Interface for Employee Attendance Management…………………….13
Figure 3.4: Frontend User Interface for Employee Attendance Management…………………….14
Chapter 1
Introduction
1.1 Project Overview
The Attendance Management System Using Geographical Boundaries is a web-based solution
designed to streamline employee attendance tracking. It leverages geofencing technology to ensure
employees are within a predefined geographical boundary when marking their attendance. This
innovative system eliminates manual errors and ensures compliance with attendance policies while
maintaining flexibility and efficiency in operations.
1.1.1 Objective
The primary objective of this project is to build an efficient, secure, and accurate system for
managing employee attendance based on their physical location. The goals include:
● Automating attendance tracking using geospatial boundaries.
● Ensuring real-time updates and reducing fraudulent attendance practices.
● Providing an intuitive user interface for employees and administrators.
● Offering robust reporting and analytics features for attendance insights.
The project emphasizes practicality, simplicity, and a user-centric approach to reduce manual effort
in communication.
1.1.2 Core Features
● Geofencing for Attendance: Employees can mark attendance only within the specified
geographical boundary.
● Real-time Location Verification: Uses GPS data to validate user location.
● Interactive Map Integration: Provides an admin interface for defining and managing
geofences using Leaflet.
● Employee Dashboard: Displays attendance history and current status.
● Admin Panel: Enables management of employees, geofences, and attendance records.
● Notifications: Alerts for successful or failed attendance attempts.
● Data Reporting and Analytics: Generate attendance reports with detailed insights.
1
1.1.3 Technologies Used
Frontend:
● React.js: For building the user interface.
● Leaflet: For map-based geofencing and location visualization.
Backend:
● Node.js: For building the server-side logic.
● Express.js: For creating APIs.
Database:
● MongoDB Atlas: For securely storing employee and attendance data.
Geospatial APIs:
● OpenStreetMap: For retrieving and displaying map data.
Deployment:
● Vercel and Netlify: For deploying the frontend and backend applications.
1.1.4 Project Structure and Architecture
The project is organized into the following key modules:
Frontend: Contains React components for employee and admin dashboards, map interfaces, and
attendance status displays.
Example: components/Map.js, components/AdminDashboard.js
Backend: Contains API endpoints and business logic for managing geofences, employees, and
attendance data.
Example: routes/attendance.js, routes/employees.js
Database Schema:
Employee Schema: Manages employee data like name, ID, and location history.
Attendance Schema: Tracks attendance records with timestamps and geolocation data.
2
The system follows the MERN (MongoDB, Express, React, Node.js) stack architecture:
1. Client-Server Model: The React frontend communicates with the Node.js backend via
REST APIs.
2. Database Layer: MongoDB Atlas handles data storage with geospatial indexing for
efficient location queries.
3. Geofencing Logic: Integrated into the backend, using geospatial libraries to validate user
locations against predefined geofences.
4. Real-Time Updates: Enabled through APIs to ensure accurate and up-to-date attendance
records.
1.2 Project Scope
1.2.1 Functional Scope
The system enables organizations to track employee attendance automatically using geofencing
technology. Key functionalities include:
● Defining and managing geofences.
● Real-time attendance tracking and validation.
● Generating detailed attendance reports and analytics.
1.2.2 Technical Scope
This project incorporates:
● Frontend: Built using React.js for a responsive and intuitive user interface.
● Backend: Developed with Node.js and Express.js to handle API requests and geofencing
logic.
● Database: Uses MongoDB Atlas to store employee and attendance records with geospatial
indexing.
● Map Integration: Leverages Leaflet and OpenStreetMap for map-based geofence
visualization and management.
1.2.3 Security Scope
● Secure API communication using HTTPS.
● Authentication mechanisms to ensure only authorized access.
● Data encryption for sensitive information.
3
1.2.4 Limitations
● The system requires a stable GPS connection for accurate location validation.
● May not function optimally in areas with poor internet connectivity or GPS signal.
● Dependency on third-party map APIs, which may have limitations in coverage or precision.
1.2.5 Future Enhancements
● Integration with biometric systems for enhanced validation.
● Offline attendance marking with subsequent synchronization.
● Support for multi-language user interfaces.
● Integration with payroll systems for automated salary calculations based on attendance.
1.3 Intended Users
1.3.1 Primary User Groups
Employees:
● To mark attendance based on geolocation.
● To view attendance history.
Administrators:
● To define geofences and manage attendance records.
● To monitor attendance analytics and generate reports.
1.3.2 Additional User Groups
Human Resource Teams:
● To analyze attendance data and ensure policy compliance.
IT Teams:
● To maintain and ensure system reliability.
4
1.3.3 Usage Scenarios
● Employees marking attendance at the office or designated work site.
● Admins setting up a geofence for a temporary project location.
● Generating monthly attendance reports for performance reviews.
1.4 Project Features
1.4.1 Geofencing for Attendance
● Employees can mark attendance only when within a predefined geographical boundary,
ensuring accuracy and compliance.
1.4.2 Real-Time Notifications
● Employees receive instant feedback (success or failure) when attempting to mark
attendance based on location validation.
1.4.3 Location Visualization
● Admins can visualize geofences and employee locations on an interactive map for better
management.
1.4.4 Attendance Reporting
● The system provides detailed reports, including daily, weekly, and monthly attendance
statistics.
1.4.5 Data Security
● Secure storage of employee and attendance records with role-based access and encryption.
1.4.6 User-Friendly Design
● Intuitive interfaces for both employees and admins, ensuring a seamless experience across
devices.
5
Chapter 2
Tools and Technology Used
2.1 Software Model Used
The project follows a Model-View-Controller (MVC) architecture, ensuring a clear separation of
concerns and easier scalability.
2.1.1 Model-View-Template (MVT) Architecture
The MVT model includes the following components:
● Model: Handles the data and business logic of the application.
● View: Manages the user interface and displays data to the user.
● Controller: Handles user input, communicates between Model and View, and processes
actions.
2.1.2 Benefits of MVT Architecture
● Improved code maintainability due to separation of concerns.
● Enhanced scalability for complex systems.
● Simplified testing and debugging.
2.1.3 Relevance to the Project
The MVC architecture is integral for managing distinct layers in the system:
1. The Model represents the geofence, employee, and attendance data in MongoDB.
2. The View includes the frontend interfaces developed in React.js.
3. The Controller processes user requests, validates geofences, and connects the database via
the backend.
2.2 Product User Interfaces
The application includes intuitive user interfaces for managing core functionalities. Built with
ReactJS, and TailwindCSS, these interfaces offer responsive designs and user-friendly navigation.
2.2.1 Authentication Interfaces
● Login and registration screens for employees and administrators.
6
● Password management functionality (reset, update).
2.2.2 Main Interfaces
● Employee Dashboard: Displays attendance status, history, and geofence location.
● Admin Panel: Tools for managing geofences, employees, and attendance reports.
2.2.3 Navigation and User Experience
● Intuitive navigation menus for quick access to primary features.
● Interactive map integration for real-time geofence visualization.
2.3 Frontend Technologies Used
2.3.1 HTML
● HTML forms the backbone of the project's structure, enabling semantic, accessible content
organization.
2.3.2 Tailwind CSS
● Tailwind CSS is used for styling the application. It provides utility-first CSS classes,
enabling rapid and consistent UI development.
Key Benefits:
● Highly customizable design system.
● Lightweight and responsive by default.
● Eliminates the need for writing custom CSS.
2.3.3 JavaScript
JavaScript adds interactivity to the system, including map updates, form validations, and dynamic
content loading.
2.3.4 React.js
● React.js is the core library used to build the frontend. It ensures a dynamic and highly
interactive user experience.
Key Features:
● Component-based architecture for reusable UI components.
● Virtual DOM for efficient rendering.
7
● Integration with Leaflet for interactive map functionality.
2.4 Backend Technologies Used
The backend is developed using NodeJS and the Flask Framework, supported by the MongoDB
Database.
2.4.1 Node.js
● Node.js provides a runtime for executing backend logic, enabling real-time attendance
validation and data management.
2.4.2 Express.js Framework
● Express.js handles routing, API creation, and middleware integration, ensuring smooth
communication between frontend and backend.
2.4.3 MongoDB Atlas
● MongoDB stores data related to employees, attendance, and geofences with geospatial
indexing for location-based queries.
8
2.5 Use Case Diagram
The use case diagram below illustrates the interaction between key users (organization admins and
employees) and the attendance management system. It highlights the flow of operations, including
setting boundaries, managing employees, and attempting to mark attendance based on geolocation
and time validation.
Figure 2.1: Use-Case Diagram
Use Case Description:
Organization Admin:
● Adds employees to the organization.
● Defines organizational boundaries for geofencing.
● Views attendance records of employees after successful punches.
Employee:
● Attempts to punch in for attendance.
● Punch-in validation checks:
Is the employee in the allowed geographical area?
Is the punch-in attempt within the allowed time?
9
● Successful punch-ins are recorded in the database.
● Employees can view their profiles.
Punch-In Outcomes:
● If both conditions (allowed area and time) are met, the punch-in is successful.
● If either condition fails, the punch-in is unsuccessful, and feedback is provided.
2.6 Design and Implementation Constraints
Design Constraints:
● Must support real-time geolocation validation.
● Should work seamlessly across devices and browsers.
● Requires high availability for critical attendance operations.
Implementation Constraints:
● Relies on accurate GPS and map data, which may be limited in remote areas.
● Performance bottlenecks during high traffic if infrastructure is not scaled.
10
Chapter 3
Snapshots
3.1 Flowchart/Proposed Work
The following flowchart illustrates the workflow of the project:
Figure 3.1: Workflow of the Employee Attendance Management
11
Figure 3.2: Sequence Diagram of the Employee Attendance Management
The project begins with an Organization Admin setting up the organizational boundaries and
adding employees to the system. Employees then attempt to mark their attendance using their
mobile devices. When an employee attempts to punch in, the frontend checks if the employee is
within the allowed geographical boundary (using geolocation) and if the time is within the allowed
punch-in period.
Upon submitting the punch-in request, the data is sent to the backend, where it is validated. The
backend checks whether the employee is within the defined boundary and whether the punch-in
time is valid. If both conditions are met, the attendance is successfully recorded in the database. If
the employee is outside the allowed boundary or tries to punch in at an invalid time, the backend
returns an error message indicating that the punch-in attempt was unsuccessful.
The system also allows employees to view their profiles and check their attendance records.
12
3.2 Project Snapshots
Below are screenshots from various stages of the project execution:
3.2.1 ReactJs
This is the user interface for user profile and attendance marking page
Figure 3.3: Frontend User Interface for Employee Attendance Management
13
Figure 3.4:Frontend User Interface for Employee Attendance Management
3.3 Code
3.3.1 Punch In & Out Code
14
3.3.2 User Login (Profile)
15
Chapter 4
Results and Discussion
4.1 Application Features and User Interaction
4.1.1 System Design and Architecture
● This section explains the high-level architecture and design of the application. It covers
how the frontend, backend, and database interact. The system follows a modular
architecture, where:
● Frontend: The user interacts with the application through a responsive interface, built with
React and Tailwind CSS.
● Backend: The Django framework handles requests, business logic, and integrates with the
database.
● Database: SQLite stores the data, including employee records, attendance logs, and
organizational boundaries.
● The architecture ensures scalability, with modular components that allow for easy
integration of additional features or services, such as real-time updates or external API
integrations.
4.1.2 User Experience and Interface Design
The application has been designed to be intuitive and easy to navigate for both organization
admins and employees.
● The employee interface focuses on simplicity, allowing employees to view their profile and
attempt to punch in easily. The map view helps employees check if they are within the
defined boundaries before attempting to punch in.
● The organization admin interface includes controls for managing employee attendance,
adding employees, and configuring organizational boundaries. Admins can also monitor
attendance logs and manage the settings for punch-in validations (such as time and
location).
16
● The design is responsive, ensuring seamless use on both desktop and mobile devices. The
use of Tailwind CSS allows for rapid development of a consistent design.
User Feedback and Observations:
A pilot group of users tested the application and highlighted its simplicity and ease of use.
Recommendations for enhancements, such as additional tooltips or shortcut features, were noted
for future iterations.
4.2 System Performance and Security Analysis
4.2.1 Load and Response Time Analysis
This section analyzes how the system performs under different loads. Performance testing was
conducted to ensure that the application can handle a large number of requests simultaneously. Key
metrics include:
● Load Handling: The system can support a high number of users attempting to punch in or
access the system at the same time.
● Response Time: Response times for punch-in attempts and admin interactions are
optimized to ensure minimal delay, with an acceptable range of response times under
normal load conditions.
● The backend is optimized for fast processing and scalability to handle varying numbers of
employee interactions.
4.2.2 Security and Data Protection
Security was a critical focus area to ensure user data safety and system integrity. The following
measures were implemented:
● Data Encryption: Sensitive data, including employee details and attendance logs, is
encrypted both in transit (using HTTPS) and at rest (using encryption standards).
● Access Control: Role-based access control ensures that only authorized users (organization
admins) can access specific sensitive functionalities, such as adding employees or viewing
detailed attendance records.
17
● Authentication and Authorization: The system uses secure login mechanisms, ensuring
that only registered employees and admins can access the system. Passwords are hashed
and stored securely.
● Regular Audits: The application is subject to regular security audits and updates to ensure
it is protected against common threats.
By addressing these aspects, the application achieved a strong foundation for both usability and
security, ensuring reliable performance in its current scope and scalability for future enhancements.
18
Chapter 5
Conclusion and Future Scope
5.1 Conclusion
The Employee Attendance Management System streamlines the attendance process by offering an
automated, location-based solution. By integrating geofencing technology and time-based
restrictions, it ensures that only employees within a designated area can clock in or out, promoting
accurate and reliable attendance data. The system also offers a user-friendly interface, ensuring
easy adoption across all user levels.
Furthermore, the backend framework is built on a secure and scalable architecture, using Django
for handling user authentication and attendance data efficiently. The use of SQLite provides a
lightweight database solution that is perfect for smaller organizations while being scalable for
future needs. Data is stored securely, and the system includes role-based access control for
enhanced security.
Overall, the system presents a modern approach to attendance management, reducing
administrative overhead and improving accuracy. Its flexibility and scalability make it an ideal
solution for organizations of all sizes, with the potential for further enhancements, such as mobile
apps and integration with payroll systems, to take it to the next level.
19
5.2 Future Scope
While the current version of the WhatsApp automation tool fulfills its intended purpose, there are
several areas for potential enhancement and expansion:
Advanced User Authentication: Integration of multi-factor authentication (MFA) to enhance
security and ensure that only authorized employees can access their attendance records and the
system.
Mobile Application Development: Development of dedicated mobile applications for iOS and
Android, allowing employees to manage their attendance on the go, with features like
location-based punch-ins.
Payroll Integration: Integration with payroll management systems to automate salary calculations,
overtime, and deductions directly based on attendance data, streamlining the payroll process.
Machine Learning for Predictive Analytics: Use of machine learning to analyze attendance
patterns, predict absenteeism trends, and help managers make data-driven decisions for better
workforce management.
Performance Optimization: Optimization of the system for handling increased load, including
caching, query optimization, and load balancing, ensuring it can scale to meet the demands of large
organizations with high user activity.
5.3 Final Thoughts
The Employee Attendance Management System addresses many challenges in traditional manual
tracking by providing a scalable and user-friendly platform. With further developments such as
integration with payroll systems, machine learning for predictive analytics, and real-time updates,
it holds the potential for improving organizational efficiency and employee management..
20
6. References
[1]https://leafletjs.com/reference.html
[2]https://docs.python.org/3/
[3]https://wiki.openstreetmap.org/wiki/Beginners%27_guide
[4]Geolocation Docs
[5]https://react.dev/learn/responding-to-events
[6] M. W. Lutz, Learning Python, 5th ed., O'Reilly Media, 2017.
[7] Geolocation Techniques: Principles and Applications by Camillo Gentile
21
