매달 급여명세서를 받을 때마다 "이번 달 잔업수당이 제대로 계산된 건가?"라는 의문이 들었습니다. 계산 기준을 직접 알아보고, 매일 잔업시간만 기록하면 월별·연간 정산을 자동으로 해주는 웹앱을 만들어 봤습니다.
잔업수당 계산은 생각보다 복잡합니다. 시급을 구해야 하고, 시급의 150%가 잔업단가가 되며, 연장근로 시간만큼 곱해서 한 달치를 더해야 합니다. 급여명세서만 봐서는 이 숫자가 어떻게 나왔는지 알 수 없었고, 직접 계산하려면 엑셀에 공식까지 만들어야 했습니다.
먼저 법정 기준을 확인했습니다. 통상임금을 월 소정근로시간으로 나눠 시급을 구하고, 연장근로는 시급의 150%를 적용합니다. 여기에 주휴수당을 포함하면 월 소정근로시간은 보통 209시간이 됩니다.
시급 = 기본급 ÷ 209시간
잔업단가 = 시급 × 1.5
월 잔업수당 = Σ(일별 잔업시간 × 잔업단가)기본급만 입력하면 이 세 값이 자동으로 나오도록 만들었습니다. 계산기가 아니라 "기록 도구"에 가깝게 설계한 이유는, 정산의 정확성은 결국 정확한 잔업시간 기록에서 나오기 때문입니다.
가장 신경 쓴 부분은 입력 UX였습니다. "날짜별 잔업시간을 어떻게 가장 쉽게 기록할 수 있을까"를 고민하다가, 달력 형태로 만들어 매일 탭 한 번으로 입력할 수 있게 했습니다.
모바일에서 가장 많이 쓸 것을 예상해 430px 기준 앱형 레이아웃으로 디자인했고, 홈 화면에 설치해서 쓰는 PWA로 만들었습니다. 데이터는 LocalStorage에 저장해서 별도 서버 없이도 영속적으로 유지됩니다.
만들다 보니 "연차도 여기서 관리하면 좋겠다"는 욕심이 생겼습니다. 입사일을 입력하면 연차 발생 타임라인을 자동으로 그리고, 연차 사용 기록을 체크할 수 있게 추가했습니다. 연차 규정이 회사마다 달라서 법정 최소 기준으로 계산하되, 사용자가 직접 조정할 수 있게 열어뒀습니다.
| 기능 | 구현 방식 |
|---|---|
| 시급·잔업단가 | 기본급 ÷ 209시간, ×1.5 자동 산출 |
| 잔업 기록 | 캘린더 UI에서 날짜별 입력 |
| 월별·연간 정산 | 시간·수당·총 수령액 테이블 |
| 연차 관리 | 입사일 기반 발생 타임라인 + 사용 기록 |
| 데이터 보존 | LocalStorage + 내보내기/가져오기 |
| 설치 | PWA — 홈 화면 설치 지원 |
가장 큰 변화는 잔업에 대한 인식이었습니다. 숫자로 매달 쌓이는 걸 보니 "적당히 하자"던 태도가 "이 시간은 내 시간"이라는 생각으로 바뀌었습니다. 그리고 급여명세서의 잔업수당이 계산과 맞는지 확인하다 보니, 실제로 회사 계산과 다른 부분을 발견해 정정 요청한 적도 있었습니다.
순수 HTML/CSS/JavaScript로 만든 프로젝트지만, "실생활의 작은 불편을 코드로 해결"하는 경험이 가장 보람 있었던 작업 중 하나였습니다.