Building InsightUBC: Exploring Courses and Classrooms Through Data

Building InsightUBC: Exploring Courses and Classrooms Through Data

InsightUBC is a full-stack TypeScript and Next.js application that lets users load UBC course and room data to explore interactive insights such as grades, trends, and instructor statistics.

InsightUBC is a full-stack TypeScript and Next.js application that lets users load UBC course and room data to explore interactive insights such as grades, trends, and instructor statistics.

Category

May 15, 2024

Web Dev

Web Dev

Year

May 15, 2024

2024

2024

InsightUBC is a full‑stack TypeScript project that lets users upload and query UBC course and room datasets, then explore the results through an interactive web UI.

The backend is a Node/Express server written in TypeScript that loads ZIP archives of course and building data, parses HTML and JSON with fs-extra, jszip, and parse5, validates and normalizes records (e.g., departments, course numbers, instructors, averages, room capacities), and exposes a query engine supporting filtering, logical combinations (AND, OR, NOT), numeric and string comparisons, aggregation (e.g., AVG, MIN, MAX, SUM, COUNT), grouping, and sorting. Extensive unit and integration tests (Mocha + Chai + Supertest, with many JSON query fixtures) ensure that queries behave correctly and that invalid queries are rejected with clear errors.

The frontend (in frontend/frontend) is a Next.js 15 + React application styled with Tailwind CSS and shadcn/ui that communicates with the backend via REST APIs. It provides pages to upload datasets, browse available courses and rooms, and view computed insights such as average grade trends, grade distributions, and instructor comparisons using responsive D3-based graphs and charts. Together, the system functions as an interactive analytics dashboard for UBC academic data, turning raw CSV/HTML/ZIP inputs into visual, queryable insights.

Design by

© Copyright 2025

Design by

© Copyright 2025