Deployed prerequisite-tree visualizer used by 10+ UCLA students across 100+ pathways
TreeReq
Built and deployed an interactive prerequisite-tree visualizer for UCLA students. Modeled course dependencies as interactive D3.js graphs with clickable nodes, descriptions, and prereq chains across 100+ UCLA majors/minors.
- Built and deployed interactive prereq-tree visualizer for 10+ UCLA students across 100+ UCLA majors/minors
- Modeled course dependencies as interactive D3.js graphs with clickable nodes, descriptions, and prereq chains
- Developed 5+ React/FastAPI flows for major search, profiles, requirement views, and grade-difficulty data
View case study
Problem
UCLA students struggle to understand prerequisite chains across hundreds of majors and minors. Course catalog data is scattered and hard to visualize as a dependency graph.
My role
Full-stack engineer — scraping pipeline, database schema, API design, and D3 visualization layer
Users
10+ UCLA students planning courses across 100+ major and minor pathways
Architecture
Catalog scraper → validation/deduplication → MongoDB course graph schema → FastAPI endpoints → React search/profile flows → D3 prerequisite graph
Testing & validation
Manual QA across major/minor pathways, deduplication checks on 1,000+ records, and user testing with 10+ students
Deployment
Live at treereq.com — FastAPI backend with MongoDB; React/Vite frontend with Firebase Auth
What I'd improve next
Add live catalog sync, automated scraper tests, and accessibility improvements for keyboard graph navigation
Technical challenges
- Normalizing inconsistent catalog HTML into reliable course and prereq records
- Rendering large prerequisite graphs without overwhelming the UI
- Keeping scraped data in sync as UCLA updates course listings
Tradeoffs
- Chose MongoDB document graphs over a relational schema for flexible prereq nesting
- Used D3 for graph control at the cost of more custom interaction code vs. an off-the-shelf chart library
- Prioritized read-heavy API performance over real-time catalog sync