All Projects

November 6, 2023

PKSS HR System

Super-app Human Resources untuk PKSS (BUMN) yang memusatkan seluruh alur operasional ke dalam satu platform mobile dan web admin. Sistem ini menaungi absensi digital, manajemen kontrak PKWT, penugasan PGS, pengaturan lembur, hingga pengelolaan slip gaji karyawan perusahaan.

Sebagai salah satu pengembang utama (Front End), saya dipercaya membangun dashboard role-based, memfasilitasi sinkronisasi absensi secara terpusat, dan menyederhanakan workflow birokrasi HR konvensional menjadi terkomputerisasi.

PKSS HR System
Next.jsReact NativeAnt DesignRole-based AccessPayroll Integration

Role

Frontend Developer

Duration

4 Months

Team

7 People

Project Gallery

Swipe or hover to explore

Project Overview

Super-app HR untuk PKSS (BUMN) mencakup modul absensi mobile, portal web untuk absensi, pengajuan lembur, manajemen PKWT/PGS, dan slip gaji — dirancang untuk mengurangi proses manual HR dan menyatukan data karyawan.

Dampak & Skala Implementasi:

Kontribusi meliputi pembuatan dashboard role-based (karyawan, HR, manager) dengan visualisasi ringkas untuk attendance & overtime, form workflows untuk pengajuan & approval (with validation & status flows), integrasi client dengan mobile attendance APIs, serta fitur export slip gaji (PDF). Teknis: komponenisasi menggunakan design system, centralized axios services untuk API calls, optimasi pengambilan data (pagination, caching), dan implementasi notifikasi in-app untuk approval flows.

Problem

Proses HR yang terfragmentasi—absensi, lembur, dan slip gaji — masih bergantung pada manual entry dan spreadsheet sehingga berisiko human error dan keterlambatan proses payroll.

Goal

Menyatukan alur HR ke dalam satu platform (mobile + web) untuk mempermudah absensi, pengajuan lembur, manajemen PKWT/PGS, dan distribusi slip gaji secara digital.

Solution

Membangun front-end modular untuk workflow HR: mobile attendance integration, web-based forms & approval flows, dashboard monitoring, dan exportable payroll documents; fokus pada reliability, audit trails, dan pengalaman pengguna yang jelas untuk mengurangi kesalahan operasional.

Tech Stack

  • Next.js / React — web admin & dashboards
  • React Native — mobile attendance client
  • Ant Design — enterprise UI components
  • Centralized API services (axios)

Key Features

  • Mobile attendance sync & web dashboard
  • Overtime request & approval workflow
  • PKWT / PGS management UI
  • Payroll slip generation & export (PDF)

Architecture

Design system + service layer, role-based routing & UI, caching & pagination for large datasets, dan audit logs untuk compliance.