How brandobogar/absensi-web-v2 works
Aplikasi Absensi Pegawai is a React client for employee attendance and multi-OPD administration. Employees sign in, view schedules and attendance status, submit a location-checked attendance record, and review attendance; administrators manage staff, OPDs, and related configuration. The README documents a Google Apps Script API backed by Google Sheets. Source excerpts confirm the app’s routing/session role and API calls for login, attendance, and management; other frontend modules and backend internals were not sampled, so their detailed wiring is represented only where documented.
Main entry points: api.js API client · App.jsx App and session · UserLayout.jsx User navigation · Login.jsx Login
Components 21
Application flow
- React entry
src/main.jsx - App and session
src/App.jsx - Login
src/components/Login.jsx - User navigation
src/layouts/UserLayout.jsx
Employee attendance
- Home and schedule
src/pages/user/Beranda.jsx - Location attendance
src/pages/user/Absen.jsx - Attendance history
src/pages/user/Riwayat.jsx - Profile changes
src/components/user/EditProfileModal.jsx - Device GPS
Administration
- Admin dashboard
src/pages/admin/Admin.jsx - Staff management
src/pages/admin/ManajemenPegawai.jsx - OPD management
src/pages/admin/ManajemenOpd.jsx - Admin accounts
src/pages/admin/ManajemenAdmin.jsx - OPD and session settings
src/components/admin/EditOpdModal.jsx - Session editor
src/components/admin/SesiModal.jsx - Office map editor
src/components/admin/PetaModal.jsx
Backend and data
- API client
src/api.js - Apps Script API
- Google Sheets
Other components
- Employee
- Administrator
Connections 25
- React entry → App and session: renders
- Employee → Login: signs in
- Administrator → Login: signs in
- Login → API client: requests login
- API client → Apps Script API: sends API requests
- Apps Script API → Google Sheets: reads and writes
- Login → App and session: reports login
- App and session → User navigation: renders user view
- User navigation → Home and schedule: selects tab
- User navigation → Location attendance: selects tab
- User navigation → Attendance history: selects tab
- App and session → Admin dashboard: renders admin view
- App and session → Staff management: dispatches page
- App and session → OPD management: dispatches page
- OPD management → Admin accounts: opens accounts
- OPD management → API client: requests OPD data
- Staff management → API client: requests staff actions
- Home and schedule → API client: loads status and config
- Home and schedule → Profile changes: opens profile editor
- Profile changes → API client: updates credentials
- Location attendance → Device GPS: reads coordinates
- Location attendance → API client: loads config and submits
- Attendance history → API client: loads attendance records
- OPD and session settings → Session editor: edits session times
- OPD and session settings → Office map editor: edits office location