Unified Access
1 QR credential = ID + security check-in/out
Education
School Management System
One system serving six distinct user roles — admin, teacher, student, principal, security, and student council — across desktop, mobile, and handheld scanning, without fragmenting into separate apps.
RBACAttendanceQRGPSSchedulingMobile
School Management System
The Challenge
A single school needed one system serving six distinct user roles (admin, teacher, student, principal, security, student council) on different devices — desktop for administration, mobile for teachers and students, handheld scanning for security gates — without fragmenting into six separate apps or requiring users to re-authenticate as they moved between contexts.
The Solution
Role-based route guards (Angular CanMatchFn) read the user's role from a session cookie and gate access per route; a dedicated authGuard silently re-validates an already-authenticated session and redirects the user straight to their correct role's home screen, so a logged-in user hitting /login never sees the login form at all. Every guard includes a super_admin bypass, giving administrators cross-role visibility without a separate impersonation system.
The Engineering
Built on Ionic Angular with Capacitor for native device access. GPS trip tracking merges Capacitor's native Geolocation.watchPosition and the browser Geolocation API into a single RxJS BehaviorSubject<LocationData[]>, tagging each reading with its source: 'web' | 'native' — meaning the same trip-tracking UI and downstream logic work identically regardless of which device a teacher is using. QR codes are generated via angularx-qrcode on the ID card component and read back via @zxing/ngx-scanner — the exact same scanner component is reused across four independent contexts (teacher attendance, teacher trip check-in, security gate, and student council home).
Unified GPS trip tracking
Capacitor Geolocation
Geolocation.watchPosition (native)
Browser Geolocation API
web
→
RxJS BehaviorSubject<LocationData[]>
each reading tagged 'web' | 'native'
→
Trip Tracking UI
identical logic, any device
One scanner component, four contexts
@zxing/ngx-scanner
shared scanner component
Teacher Attendance
Teacher Trip Check-in
Security Gate
Student Council Home
Built For
AdministratorsTeachersStudentsSecurityStudent Council
The System
The timetable data model supports genuinely concurrent subjects in one period slot: each day/period cell holds a subjects array, rendered with a nested loop so multiple electives display side-by-side (separated by "/") in the same cell — not a visual trick, but a data structure built to represent real concurrent scheduling. Fixed non-academic blocks (Breakfast, Gurupuja, Form Tutor Time, Lunch, Break) share the same timetable schema as subjects but render full-width rather than per-day. Test coverage exists at the guard and service layer (.spec.ts files across auth, admin, principal, security, student, and teacher services).
Principal / Admin campus overview
Teacher attendance
Timetable with concurrent electives
Student QR ID card
Security gate QR check-in
GPS trip tracking
The Outcome
One QR credential serves both identification and security check-in/out, eliminating the need for separate ID and access-control systems. One authentication guard set handles routing for six roles with zero role-specific login pages. The timetable schema natively represents parallel elective scheduling without requiring a redesign as the school's course offerings grow more complex.
Authentication
6 roles, 0 role-specific login pages
Scalable Data Model
Native support for parallel elective scheduling
Technologies
IonicAngularCapacitorRxJSQR CodesGeolocation
Some systems and client engagements are subject to confidentiality agreements. Screenshots shown here have been selected or generalized to avoid exposing private client information.
Have a system like this in mind?
Let's scope the architecture and plan the build.