Skip to content
← All projects
FrontendBackendFull-Stack

Sep 2026 - Present • Secondary School Operations Management System (Next.js 16 + Express)

Live Demo →View on GitHub →
Ảnh dự án SchoolOps — Nền tảng Quản lý Vận hành Trường học (Next.js 16 + Express)

Overview

SchoolOps is an enterprise-grade school management platform for Nguyen Tat Thanh Secondary School (2026-2027), structured as a Monorepo with Next.js 16 (Frontend) and Node.js/Express/TypeScript (Backend). Manages 16 classes, 480 students, 24 teachers with dynamic per-class RBAC, dual-perspective seating grid, real-time period attendance, and automatic timetable conflict detection.

System Architecture

Layered Monorepo architecture: Controller → Service → Repository (Express Serverless Backend) and Page/Component → Context/Service Layer → API Client (Next.js 16 Frontend). Automated 7-step SQL migration pipeline (001→007). Next.js API proxy rewrites eliminate CORS friction.

Data & Database

PostgreSQL 16 relational schema across 12 normalized tables with native node-postgres connection pooling on Neon Serverless (no ORM). Composite indexes accelerate attendance lookups, stored procedures enforce timetable conflict prevention, triggers automate updated_at timestamps, and deterministic seed data for 480 students.

Key Challenges & Technical Solutions

  1. 01

    1. Dynamic Per-Class RBAC Matrix — Contextual permissions per classroom:

    Implemented ClassContext as a dynamic role resolver looking up teacher_assignments on every class switch; Backend rbac.middleware.ts independently enforces requireClassAccess at every API route, ensuring zero trust in client state.

  2. 02

    2. 2-Shift Timetable & School-Wide Teacher Conflict Detection:

    Created partial conflict indexes (teacher_id, period, day_of_week) via migration 007; enforced pre-insert stored procedure conflict validation; wrapped schedule persistence inside atomic PostgreSQL transactions.

  3. 03

    3. 20-Desk / 40-Seat Grid — Dual-Perspective Rendering & Live Attendance Overlay:

    Encoded coordinates via absolute desk index 0-19; SeatingGrid component flips perspectives via CSS transform and reverse mapping without modifying state; decoupled live attendance indicators into a distinct badge overlay layer.

  4. 04

    4. Serverless Transition with Vercel Functions & Neon Cloud:

    Packaged Express backend into Vercel Serverless Function via vercel.json and api/index.js entrypoint; pooled PostgreSQL connections using Neon PgBouncer pooler; resolved Linux binary dependencies for seamless Vercel deployment.