Implementation of a Progressive Web App for Teacher Attendance and Payroll System at PAUD Mckids West Bekasi

Abstract

PAUD McKids West Bekasi is an early childhood education institution that previously managed teacher attendance using manual paper logbooks and calculated payroll via basic spreadsheets. Consequently, the monthly recapitulation process required 2–3 working days and remained susceptible to human calculation errors. This study aims to design and implement a Progressive Web App (PWA) for the teacher attendance and payroll system, named SIPAG McKids, providing a computerized, integrated, and multi-device accessible administrative platform. The research employed the Research and Development (R&D) method using the Waterfall software engineering model, encompassing requirements analysis, system design, implementation, testing, and maintenance. The system was developed using the CodeIgniter 3 framework under the Model-View-Controller (MVC) architecture, a MySQL relational database, a Bootstrap 5 interface, DOMPDF for automated pay slip generation, and a Progressive Web App layer driven by a Web App Manifest and Service Workers to facilitate installation and offline caching. System evaluation comprised Black Box Testing for functional validation, PWA component verification, security assessments referencing the OWASP Top 10 guidelines, and performance audits using Google Lighthouse. The implementation results demonstrated that all Black Box testing scenarios functioned as designed. Security mechanisms—including Bcrypt password hashing, CSRF protection, Query Builder parameterization against SQL Injection, and Role-Based Access Control (RBAC)—operated correctly. Furthermore, self-service attendance based on selfie photography and GPS coordinates, alongside a tiered payroll approval workflow (Draft–Approved–Paid), operated successfully with transactional records verified in the production database. Google Lighthouse audit scores achieved 85 for desktop performance, 99 for mobile performance, 100 for Best Practices, 91 for SEO, and 78 for Accessibility. The system effectively enhances administrative recapitulation efficiency, improves calculation accuracy for tardiness deductions, ensures payroll transparency for teachers, and provides seamless mobile access for the institution.