The Problem
A vocational college in Vietnam was running its daily operations across five different platforms — one for attendance, another for grades, a separate tool for scheduling, spreadsheets for student records, and manual Word documents for certificates and transcripts.
The result: duplicated data entry, frequent errors, security blind spots, and over ₫300M per year in subscription costs for tools that didn't talk to each other. None of these platforms supported the specific workflows of Vietnamese vocational education — theory/practice course splits, department-major-subject hierarchies, or Vietnamese-language document generation with proper diacritics.
The school needed one system that did everything, owned by them, on their terms.
Our Approach
We spent the first two weeks embedded with administrative staff, teachers, and department heads — mapping every workflow, identifying pain points, and documenting the specific requirements that off-the-shelf solutions couldn't handle.
What became clear: this wasn't a generic school management problem. Vietnamese vocational programs have unique structures (departments → majors → subjects, with theory/practice distinctions) and strict document formatting requirements. We needed to build from scratch.
What We Built
Student & Academic Management
A centralized hub for all student data — enrollment, personal records, class assignments, and academic history. The system models the full institutional hierarchy: departments, majors, subjects, and course types (theory vs. practice). Administrators manage everything from a single dashboard with role-based access for teachers, staff, and students.
Attendance & Grading
Session-by-session attendance tracking with real-time status updates. Teachers mark attendance per lesson, and the system auto-generates reports by class, student, or time period. Grading supports multiple assessment types — written exams, practical evaluations, projects — with configurable weighting and automatic GPA calculations.
Scheduling & Timetables
Conflict-free timetable generation with room allocation and teacher assignment. The drag-and-drop interface lets administrators build and adjust schedules visually, with automatic conflict detection for rooms, teachers, and student groups.
Document Generation Engine
This was the hardest piece. We built a visual template editor using TipTap where staff can design certificate and transcript layouts with drag-and-drop data field bindings — student name, grades, dates, signatures — all mapped to live data. Behind it, a dedicated Python/FastAPI microservice powered by WeasyPrint renders pixel-perfect PDFs with full Vietnamese typography support. What used to take hours of manual Word editing now takes seconds.
Search & Bulk Operations
MeiliSearch powers instant, typo-tolerant search across the entire student and staff database — critical for a Vietnamese-language system where diacritics matter. Bulk import/export via Excel handles mass enrollment and data migration.
Bilingual Interface
Vietnamese as the primary language, English as secondary. Built with react-i18next across 2,000+ translation keys, with automated consistency checks to catch missing or outdated translations.
Technical Decisions
| Layer | Choice | Why |
|---|---|---|
| Framework | Next.js 15 (App Router) | Server-side rendering for fast initial loads; React 19 for modern UI patterns |
| API | tRPC | End-to-end type safety from database to frontend — catches errors at compile time, not production |
| Database | PostgreSQL + Drizzle ORM | 20+ relational tables with full referential integrity; Drizzle for type-safe queries without the ORM overhead |
| Search | MeiliSearch | Sub-100ms full-text search with Vietnamese language support and typo tolerance |
| Documents | TipTap + WeasyPrint (Python/FastAPI) | Visual template editing + high-fidelity PDF rendering with Vietnamese font support |
| Auth | NextAuth.js v5 | Role-based access control (Admin/Teacher/Student) with session management |
| Storage | AWS S3 | Versioned file storage with permission-based access |
| Runtime | Bun | Faster installs and dev server compared to Node.js |
Results
The system replaced five separate platforms with one. Key outcomes:
- Eliminated ₫300M+ in annual software subscription costs — the system pays for itself
- Document generation dropped from hours to seconds — certificates, transcripts, and reports are now one-click
- Zero data duplication — single source of truth for all student records
- Full data ownership — all records on self-hosted infrastructure, no third-party data exposure
- Staff onboarding in under a day — intuitive interface designed around existing workflows
The system is actively used across the institution and continues to evolve with new modules based on staff feedback.
Technology Stack
Frontend: Next.js 15, React 19, Tailwind CSS 4, TipTap Editor
Backend: tRPC, NextAuth.js v5, Python/FastAPI (PDF service)
Database: PostgreSQL, Drizzle ORM, MeiliSearch
Infrastructure: Self-hosted, AWS S3, Bun runtime